如何使用javascript的PureMVC框架

一、如何使用javascript的PureMVC框架

Controller保存所有Command的映射。Command类是无状态的，只在需要时才被创建。

Command是负责处理复杂的数据逻辑的地方，它的使用归纳起来有两种

1.通过发送Notification来触发Command

口水不要太多，我们马上进入正题

在demo文件夹下建立文件夹controller，然后在controller夹下建立一个叫StartupCommand.js的js文件，输入以下内容

var StartupCommand= Objs("sweeps.controller.StartupCommand",

*添加Subcommands来启动PuerMVC组件

*通常这里是先准备Model（即Proxy），然后是View（即Mediators);

initializeMacroCommand: function( note)

alert('收到由facade发来的');

//this.addSubCommand( PrepModelCommand);

//this.addSubCommand( PrepViewCommand);

跟着在demo文件夹下面建立一个文件夹abc来存放Noticefiction，在abc文件夹下建立NotificationNames.js文件，输入下面内容

二、函数式编程--纯函数(Pure Function)

函数式编程中的纯函数是一种特殊的函数，它具有确定性，即对于相同的输入，始终会产生相同的输出，且不受外部状态和副作用影响。以下是纯函数的几个关键特性：

1.确定性：纯函数的输出完全取决于其输入，不依赖于任何隐藏信息或外部状态改变。例如，`double(2)`总是返回4，而`random(2)`则可能返回不同的随机数。

2.不可变性：纯函数不会修改输入值以外的任何变量。如`const`声明的number、boolean和string类型的变量是不可变的，但object类型的数据可能因对象本身被修改而失去纯性。

3.无副作用：纯函数执行过程中不会产生任何可观察的副作用，如修改外部状态、触发事件等。如`slice`方法是纯的，而`splice`方法则不是。

纯函数的优点包括：便于测试（只需验证输入和输出），利于缓存（结果可重复利用），以及在并行处理和重构时不会带来意外影响。然而，JavaScript中实现完全的纯函数可能会遇到挑战，尤其是涉及对象和DOM操作时。

如果你对纯函数的更深入理解或具体应用感兴趣，可以参考以下资源：[1] [2] [3] [4]

[1] zh.wikipedia.org/wiki/%E7%9F%A5%E5%9E%8B%E5%8A%A8%E7%94%A8%E8%AF%89

[2] llh911001.gitbooks.io/m...

[3] juejin.cn/post/68449036...

[4] zhuanlan.zhihu.com/p/12...

三、Vue 和 React 的使用场景和深度有何不同

首先，其实 Vue也完全可以全量赋值的，唯一需要的小优化就是给 v-repeat列表一个 track-by属性，提示一下如何判断两个对象是否是同一份数据。如果是没有复杂交互的列表，可以直接 track-by="$index"原地复用 DOM元素。

合理使用 track-by的情况下，Vue甚至可以比 React更快（这里渲染的是 100* 5的数据表，每一帧都是全量新数据赋值）：

在超大量数据的首屏渲染速度上，React有一定优势，因为 Vue的渲染机制启动时候要做的工作比较多，而且 React支持服务端渲染。

需要指出的一点：React的 Virtual DOM也不是不需要优化的。复杂的应用里你有两个选择 1.手动添加 shouldComponentUpdate来避免不需要的 vdom re-render；2. Components尽可能都用 pureRenderMixin，然后采用 Flux结构+ Immutable.js。其实也不是那么简单的。相比之下，Vue由于采用依赖追踪，默认就是优化状态：你动了多少数据，就触发多少更新，不多也不少。

说起 Flux架构，FB提供的标准实现非常繁琐，所以社区的各种造轮子版本层出不穷，目前其实还没有找到一个公认的最佳实践，而且大部分新 Flux实现都引入了很多函数式概念，你如果对函数式编程不熟悉，光搞清楚那些概念就得花很久。

如果你真的理解了 Flux，你又会发现其实 Vue也是可以应用 Flux架构的。比如 optimizely/nuclear-js· GitHub是一个 Flux变种，他们就是同时把这个东西用在了 React和 Vue上面。

再谈谈开发风格的偏好：React推荐的做法是 JSX+ inline style，也就是把 HTML和 CSS全都整进 JavaScript了。Vue的默认 API是以简单易上手为目标，但是进阶之后推荐的是使用 webpack+ vue-loader的单文件组件格式：

依然是熟悉的 HTML和 CSS，但是可以放在一个文件里。而且你还可以使用你想要的预处理器，比如 LESS, Jade, Coffee, Babel，都可以。

然后扯一扯模板 vs. JSX的问题。JSX在逻辑表达能力上虽然完爆模板，但是很容易写出凌乱的 render函数，不如模板看起来一目了然。当然这里也有个人偏好的问题。

React的社区/组件生态比 Vue大很多，这个是很显然的。不过说实话我很少见到现成的第三方组件完全符合我的要求。

最后，使用场景上来说：React配合严格的 Flux架构，适合超大规模多人协作的复杂项目。理论上 Vue配合类似架构也可以胜任这样的用例，但缺少类似 Flux这样的官方架构。小快灵的项目上，Vue和 React的选择更多是开发风格的偏好。对于需要对 DOM进行很多自定义操作的项目，Vue的灵活性优于 React。

楼下有些回答说 Vue的核心是 MVVM双向绑定，然后就直接跳跃到了『不适合持续工程迭代』的结论。且不说这样的跳跃太草率，这样的看法本身对于双向绑定的理解也是有偏差的。表单的双向绑定，说到底不过是（value的单向绑定+ onChange事件侦听）的一个语法糖，你如果不想用 v-model，像 React那样处理也是完全可以的。另一方面，组件间的数据传递，Vue默认是单向的，和 React一样。

React本身并不存在所谓的『单向数据流』，这完全是 Flux引入的概念。其核心还是在于避免组件的 local state，强调把 state抽取出来进行集中的管理。没有 Flux的情况下 React一样会有状态难以管理的问题，其根源在于在哪里存放和管理 state，和双向绑定没有本质联系。那难道 Vue就不能这样管理状态吗？当然是可以的，Vue现在可以通过 egoist/revue· GitHub和 Redux进行配合，也可以用 Vue专属的状态管理架构 Vuex: vuejs/vuex· GitHub，『单向数据流』并没有 React吹的那么神，直接因为这一点就觉得 Vue不适合工程迭代，完全站不住脚。