Flux是Facebook在现有MVC框架数据流动复杂,难以设计和维护大型的前端应用的情况下设计的一种新的数据架构协议。叫做协议是因为Flux本身就像MVC一样,规定了一种机制,但是Facebook提供了官方的实现,实际上目前Flux总共有多达十几种实现,其中的佼佼者就是Redux,这就是Flux和Redux的关系。
Flux为了使数据流看起来更加清晰,应用结构更加清晰,不像传统的MVC框架允许数据在model、view、controller的双向流动,提出了一个action->dispatcher->store->view的模型,并只允许从左到右的单向流动,不能反过来操作。
其中的action就是一个action对象,可以由view生成,dispatcher相当于一个管理中心,注册了action和store的操作之间的关系,action的派发将带来store的一个操作;store的操作最终通过观察者模式(事件监听机制)触发view 的更新。

实际上这个模型和我们用的ExtJS也比较像,ExtJS虽然是MVC框架,但我感觉主要的流动方向如下图所示:

view->controller->model->view的一个流动,只是额外多了controller->view的流动。
所以可以说Flux和MVC总体上有很多相似的地方,这是正常的,新的东西脱胎于老的东西,继承了其中的一些好的东西,但是Flux从上图可以看出最大的不同是MVC核心是Controller,但是Flux处在controller位置上的dispatcher算是一个调度中心,这两者的区别在于controller包含了项目几乎所有的逻辑和事件处理、网络请求等等工作,甚至可以直接反过来操作view(图中多出的一个箭头),但是dispatcher感觉更像承上启下的一个环节,不能直接操作数据,更不能直接反过来操作view,只是一个调度意义上的中心,具体的还需要继续在项目中使用来体会Flux,只是一点粗浅的认识,不足之处请指正!

Flux和ExtJS MVC框架的异同点介绍的更多相关文章

  1. mvc框架 与vuex的介绍

    应用级的状态集中放在store中: 改变状态的方式是提交mutations,这是个同步的事物: 异步逻辑应该封装在action中. const vuex_store = new Vuex.store( ...

  2. 产品前端重构(TypeScript、MVC框架设计)

    最近两周完成了对公司某一产品的前端重构,本文记录重构的主要思路及相关的设计内容. 公司期望把某一管理类信息系统从项目代码中抽取.重构为一个可复用的产品.该系统的前端是基于 ExtJs 5 进行构造的, ...

  3. Extjs MVC学习随笔01

    Extjs Mvc模式下的整个MVC框架体系即下图: 包含了Controller(实现方法层),Store(数据来源管理层),View(页面布局层).之所以用MVC我想是因为减轻针对某一页面的单一的J ...

  4. ExtJS MVC学习手记 2

    开发环境 eclipse(indigo) ExtJS4.0 开发目标 使用store.model和controller创建菜单树 开发步骤 之前我们已经建立了一个MVC的项目框架.现在要做的就是在这个 ...

  5. ExtJS MVC学习手记 1

    开发环境: ExtJS4.2 eclipse indigo 开发目标  搭建项目框架,创建viewport 开发步骤说明 这次主要使用extjs4的mvc模式创建viewport.籍此初步了解mvc模 ...

  6. Extjs MVC模式开发,循序渐进(一)

    本文讲述extjs mvc的Helloworld,tabPanel,event,页面布局layout等内容. 本页包含:MVC模式案例(一)~MVC模式案例(六),从搭建extjs mvc到点击按钮生 ...

  7. 开源:Taurus.MVC 框架

    为什么要创造Taurus.MVC: 记得被上一家公司忽悠去负责公司电商平台的时候,情况是这样的: 项目原版是外包给第三方的,使用:WebForm+NHibernate,代码不堪入目,Bug无限,经常点 ...

  8. 编写自己的PHP MVC框架笔记

    1.MVC MVC模式(Model-View-Controller)是软件工程中的一种软件架构模式,把软件系统分为三个基本部分:模型(Model).视图(View)和控制器(Controller). ...

  9. 转 10 个最佳的 Node.js 的 MVC 框架

    10 个最佳的 Node.js 的 MVC 框架 oschina 发布于: 2014年02月24日 (33评) 分享到:    收藏 +322 Node.js 是一个基于Chrome JavaScri ...

随机推荐

  1. 使用LogKit进行日志操作

    1.      概述 任何一个系统中,日志都是不可缺少的,现在Apache提供了两套日志工具,一个就是Log4j,另一个是本文要给出例子的LogKit. Log4j和LogKit有很多相似的地方.比如 ...

  2. python的read() 、readline()、readlines()、xreadlines()

    先来一个小例子: import sys dir= os.path.dirname(os.path.abspath(__file__)) file_path='%s/test.txt'  % dir f ...

  3. 【freeradius2.x】 安装和学习

    虚拟机中centos 安装和学习 radius2 版本是2.2.x 的使用等知识 安装 为了测试方面,yum安装 yum -y install freeradius* 配置文件的位置是 /etc/ra ...

  4. 传输控制协议(TCP) -- 连接建立及终止过程

    TCP简介 相对于不可靠.无连接的用户数据报协议(User Datagram Protocol, UDP),传输控制协议(Transmission Control Protocol, TCP)是可靠的 ...

  5. SpriteBuilder中的loadAsScene:方法的返回值

    见如下代码: CCScene *scene = [CCBReader loadAsScene:@"GameScene"]; GameScene *gameScene = (Game ...

  6. IP的种类与获取方式

    IP 的种类与取得方式 接下来要跟大家谈一谈也是很容易造成大家困扰的一个部分,那就是 IP 的种类!很多朋友常常听到什么『真实IP, 实体 IP, 虚拟 IP, 假的 IP....』烦都烦死了-其实不 ...

  7. myeclipse不编译

    错误: org.eclipse.core.internal.registry.configurationElementHandle cannot be cast to org.eclipse.jdt. ...

  8. init()和onEnter()方法的区别

    init()和onEnter()这俩个方法都是CCNode的方法.其区别如下: 1.其被调用的顺序是先init(),后onEnter(). 2.init()在类的初始化时只会调用一次. 3.onEnt ...

  9. 关于masm中PTR伪指令的一点思考

    在masm中,PTR伪指令只能修饰内存变量类型,因为任何寄存器的大小都是已知的且不能改变的(如果PTR修饰的是寄存器,则它修饰的是寄存器本身而不是其指向的内容)所以不能用PTR改变寄存器的大小,例如: ...

  10. 多线程编程 NSOperation

     前言 1.NSThread的使用,虽然也可以实现多线程编程,但是需要我们去管理线程的生命周期,还要考虑线程同步.加锁问题,造成一些性能上的开销.我们也可以配合使用NSOperation和NSOper ...