The guiding principle in Cycle.js is we want to separate logic from effects. This first part here was logical, and this second part here was effects. Effects are everything that change the external world somehow, the real world such as the DOM is connected to the browser, which is the connected to the user, so when we do something like set the text content, we are changing the screen that will shown to the user. So things like console.log and HTTP network requests, all of these things are effects, and these things live in subscribes.

Logic on the other hand, this is not changing the external world anyhow, it's just an event stream of numbers every second, and we're mapping that event stream to another event stream with strings. This part here is functional, it's all about mapping some primitives to others, and this side is imperatives. Our guiding principle for Cycle.js is we want to push subscribes as far away as we can from our app.

So this part of subscribe we want this to live in the framework, and this part is the only thing that the developer will write as the app. That is the guiding principle to separate logic from effects.

console.clear();
// Logic
Rx.Observable.timer(0,1000)
.map( i => `Second elapsed ${i}`) // Effect
.subscribe( text => console.log(text))

[Cycle.js] The Cycle.js principle: separating logic from effects的更多相关文章

  1. c#调用js,以及js调用C#里的函数, c#自己生成js代码,实现对web的控制

    using mshtml;using System;using System.Collections.Generic;using System.Linq;using System.Security.P ...

  2. JavaScript模块化-require.js,r.js和打包发布

    在JavaScript模块化和闭包和JavaScript-Module-Pattern-In-Depth这两篇文章中,提到了模块化的基本思想,但是在实际项目中模块化和项目人员的分工,组建化开发,打包发 ...

  3. MVC、MVP、MVVM、Angular.js、Knockout.js、Backbone.js、React.js、Ember.js、Avalon.js、Vue.js 概念摘录

    注:文章内容都是摘录性文字,自己阅读的一些笔记,方便日后查看. MVC MVC(Model-View-Controller),M 是指业务模型,V 是指用户界面,C 则是控制器,使用 MVC 的目的是 ...

  4. 再谈React.js实现原生js拖拽效果

    前几天写的那个拖拽,自己留下的疑问...这次在热心博友的提示下又修正了一些小小的bug,也加了拖拽的边缘检测部分...就再聊聊拖拽吧 一.不要直接操作dom元素 react中使用了虚拟dom的概念,目 ...

  5. spring访问静态资源出错,No mapping found for HTTP request with URI xxx/resources/js/jquery.min.js...

    问题:spring访问静态资源出错,No mapping found for HTTP request with URI xxx/resources/js/jquery.min.js... web.x ...

  6. prototype.js 和 jQuery.js中 ajax 的使用

    这次还是prototype.js 和 jQuery.js冲突的问题,前面说到过解决办法http://www.cnblogs.com/Joanna-Yan/p/4836252.html,以及上网说的大部 ...

  7. LazyLoad.js及scrollLoading.js

    http://blog.csdn.net/ning109314/article/details/7042829 目前图片延迟加载主要分两大块,一是触发加载(根据滚动条位置加载图片):二是自动预加载(加 ...

  8. JS引用另外JS文件的顺序问题。

    1.在a.js中可以引用b.js文件,这样就可以在网页中只引用a.js文件,从而可以使用a.js和b.js文件中的所有方法. 引用格式如下:document.write('<script typ ...

  9. jquery的validate.js 和 form.js 的使用方法

    在使用 Jquery 的方法的验证并且修改 原Form 表单的提交方式的时候,需要引用的文件有 <script type="text/javascript" src=&quo ...

随机推荐

  1. C#逻辑运算符详解

    代码如下: namespace ConsoleApplication1 { class @class { static void Main_1(string[] args) //输出用户输入的内容 { ...

  2. JavaScript异步编程 ( 一 )

    1. 异步编程 Javascript语言的执行环境是"单线程"(single thread).所谓"单线程",就是指一次只能完成一件任务.如果有多个任务,就必须 ...

  3. Python进阶之路---1.5python数据类型-字符串

    字符串 *:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: 0 !important; ...

  4. mongo 初始配置

    连接mongo 时  在window的可视化工具 有时会出现这种无法找到表的情况 那么我们所需要的是什么?? 用客户端的命令行 查看是否能够真正连接成功 下载mongo window 并安装  这个网 ...

  5. 自定义控件 进度条 ProgressBar-2

    使用 <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"     xmlns:bqt ...

  6. Entity Framework 4.1 绕过 EF 查询映射

    原文:http://blog.csdn.net/eqera/article/details/8411437 这是这了系列的最后一篇,我将讨论如何绕过 EF 的查询映射. 像所有优秀的框架一样,EF 知 ...

  7. C#基础枚举的设计

    枚举分为:简单枚举和标记枚举(为了枚举值位操作) 标记枚举的用法:

  8. 浅谈css的预编译---less语言

    正如各位所知道的一样,css是一门标记性语言,语法相对简单,对使用者的要求也比较低 .不过可乐不知道友友们有没有发现,在使用css的时候需要书写大量看似没有逻辑的代码,不方便维护及扩展,不利于复用,尤 ...

  9. pd的django To Do List教程-----3:模板的建立

    ---恢复内容开始--- 1:在app下建立static文件夹并且放入bootstrap文件包以及一个写好的css文件style.css.文件目录如下: style.css代码: .form-cont ...

  10. C#获取当前路径的几种方法

    C#获取当前路径的方法如下: 1. System.Diagnostics.Process.GetCurrentProcess().MainModule.FileName -获取模块的完整路径. 2. ...