vuepress 框架 访问量是怎么来的 vue框架描述

---

文章目录

• 系列文章总结
• 一、vue框架的优缺点

• 1.1 优点
• 1.2 缺点

• 二、vue实现双向绑定

• 2.1 原理
• 2.2 实现过程
• 2.3 相关api

---

一、vue框架的优缺点

1.1 优点

1. 轻量级、易上手、可以有简洁的API提供高效的数据绑定和灵活的组件系统
2. 组件（component）是vue最强大的功能之一，组件可以扩展HTML元素，封装可重用的代码
3. 双向数据绑定的实现更容易操作DOM（vue.js)则使用object.defineProperty（）方法，监控对方数据的操作，从而可以自动触发数据同步，可以精准的将变更发给绑定的视图，而不是对所有数据都执行一次检测（不同于angular.js）。
4. vue是单页面应用；使页面局部刷新，不要求每次跳转页面都要请求所有数据和DOM。
5. vue采用虚拟DOM，不再使用原生的dom操作节点,极大解放dom操作,但具体操作的还是dom不过是换了另一种方式

1.2 缺点

1. vue的开发更加依赖一个单独的人，而非团队，它不便于共同开发。
2. 生态不太成熟，编辑器里语法提示不完善
3. 首次渲染耗费资源比较大

---

二、vue实现双向绑定

2.1 原理

双向数据绑定是通过数据劫持结合发布订阅者模式的方式来实现的，也就是说数据和视图同步（数据驱动），数据发生变化，视图也跟着发生变化，视图变化，数据也跟着变化。

• 订阅发布模式（观察者模式）定义了一种一对多的关系，让多个观察者同时监听一个主题对象，这个主题对象的状态发生变化时就会通知所有观察者对象。
• 其实现双向数据绑定的核心时Object.defineProperty（）方法。

Object.defineProperty： obj：定义其属性上的对象。 prop：定义或修改的属性。
descriptor：具体的改变方法

简单来说，就是用这个方法定义一个值，然后调用里面的get（）方法，当我们给这个属性赋值时，又调用了里面的set方法。

---

2.2 实现过程

1. 实现一个监听器observer，用来劫持并监听所有属性，如果有变动就会通知订阅者。
2. 实现一个订阅者watcher，可以受到属性变化通知并执行相应的函数，从而更新视图。（dep是Observer与Watcher的纽带）
3. 实现一个解析者compile，可以扫描和解析每个节点的相关指令，并根据初始化模块数据以及初始化相应的订阅器。

---

2.3 相关api

主要实现{{}}、v-modal和事件指令的功能。

---