1. 研究目的与意义及国内外研究现状

选题目的

设计并实现一个mvvm架构的web前端框架zues.js。框架暴露指令api, 实现html模板渲染。实现模板界面和应用数据之间的双向数据绑定，能将模型数据传递到界面展示，并在视图界面的变更时实时更新到数据模型。从而解耦视图模板和业务逻辑，避免在业务逻辑代码中大量进行dom操作。

2. 研究的基本内容

模板分析和渲染

模板分析的主要目的是对 {} 标记和html标签上的自定义指令进行收集。收集完成之后生成一个视图更新函数，在函数内部保存着这个标记所在的Dom片段和相关的数据名称，函数被调用时会去重新取数据名称对应的数据(或者由外部将相应的数据作为参数传入)，然后更新dom片段。这样就实现了视图的更新。一般框架会在启动时就将模板分析完，生成相应的视图更新函数。当数据更新的时候，就调用这些更新函数来更新视图。

数据检测

数据检测就是需要检查数据的改动， 当数据更新的时候，需要实时的更新视图。

3. 实施方案、进度安排及预期效果

实施方案

1. 设计框架暴露出的内置指令
• d-repeat: 重复渲染html模板
• d-class: 动态添加class
• d-show/d-hide: 视图显示隐藏
• d-model: 注册监听数据
• d-click: 注册监听函数
2. 实现一个compiler函数可以遍历dom,并且可以解析和转换指令表达式，把值映射到DOM上。
3. 使用一套数据检查机制，当数据更新的时候，需要实时的更新视图。
4. 实现一些demo一个使用这个框架实现的todoMVC(todolist例子)

进度安排

2015年11月~12月：学习整理前端框架angularjs、backbone、vue、ember；设计完成框架模型（finished)；

2016年1月~2月（开学前）：测试框架，编写demo-todolist例子（finished);

2016年3月~5月：撰写毕业论文,编写演示ppt；

4. 参考文献

[1]React官方网站 http://facebook.github.io/react/

[2]angular.js官方网站 https://angularjs.org/

[3]vue.js官方网站 http://vuejs.org/