前端框架总结&react初学

前端框架

angular vue react

jquery zepto

库和框架有什么区别？

库：核心思想还在js，高度封装js，方便大家使用

框架：angular vue react

angular 1.X MVC google

2.x MVVM

vue 2.x MVVM 中国大神（尤雨溪）

 

react 更注重视图层 facebook

vue

1.虚拟DOM

react

1.虚拟DOM

2.性能高

3.解决里一些终端问题（pc端，手机端）

Vue.js的特点：MVVM框架、数据驱动、组件化、轻量、简洁、高效、快速、模块友好

1.与angularjs的区别

相同点：

都支持指令：内置指令和自定义指令。

都支持过滤器：内置过滤器和自定义过滤器。

都支持双向数据绑定。

都不支持低端浏览器。

 

不同点：

(1).AngularJS的学习成本高，比如增加了Dependency Injection特性，而Vue.js本身提供的API都比较简单、直观。

(2).在性能上，AngularJS依赖对数据做脏检查，所以Watcher越多越慢。

Vue.js使用基于依赖追踪的观察并且使用异步队列更新。所有的数据都是独立触发的。

对于庞大的应用来说，这个优化差异还是比较明显的。

 

2.与React的区别

相同点：

react采用特殊的JSX语法，Vue.js在组件开发中也推崇编写.vue特殊文件格式，对文件内容都有一些约定，两者都需要编译后使用。

中心思想相同：一切都是组件，组件实例之间可以嵌套。

都提供合理的钩子函数，可以让开发者定制化地去处理需求。

都不内置列数AJAX，Route等功能到核心包，而是以插件的方式加载。

在组件开发中都支持mixins的特性。

 

不同点：

React依赖Virtual DOM,而Vue.js使用的是DOM模板。React采用的Virtual DOM会对渲染出来的结果做脏检查。

Vue.js在模板中提供了指令，过滤器等，可以非常方便，快捷地操作DOM。

react

1.直接引入 （比较适合初学）

2.脚手架

 

bower

 

node

npm install bower -g

 

bower info jquery

install jquery#1.9.1

 

 

vue :0.0.0': '2013-12-07T06:09:48.297Z

react : 2011-10-26T17:46:22.746Z

angular: 2012-03-28T11:40:22.074Z

 

1.reactjs 自己什么也做不了 必须借助插件

 

react-dom -》虚拟DOM

babel ？ JSX

let a = '<div>aaa</div>'

JSX

1.

let b = (<div>

<div>aaa</div>

<span>fsdfsd</span>

</div>)

2.

var f = 'hello react';

let b = (<div>

<div>{f}</div>

<span>fsdfsd</span>

</div>)

3.

div{

width:100px;

}

let b = (<div style={{width:'100px'}}>

<div>{f}</div>

<span>fsdfsd</span>

</div>)

4.必须有闭合标签

<input />

<img />

<br />

<hr />

<div></div>

 

5.

react -> ReactDOM.render(

内容，

元素。

)

 

6.class -> className