vue系列教程:1.为啥选择vue.js?

时间:17-02-18 栏目:Vue, web前端 作者:zongyan86 评论:0 点击: 2,560 次

vue系列教程:

vue系列教程:1.为啥选择vue.js?

vue系列教程:2.vue.js的第一个demo


为啥选择vue.js而不是其他呢?都说它是灵活,易用,性能卓越的框架。具体都体现在哪呢?

一、

当我们打开vue.js的官网,你就能发现三个字“渐进式”。没错,vue是个渐进式的框架。

什么是渐进式框架呢?也就是说,你并不一定非得要使用vue.js的路由,可能你只想用他的组件,那您就愉快的用吧。

您可以随意组合vue.js提供的技术栈,但并无需引入过多的代码,按需加载即可。

二、

vue.js有两个比较核心的点:数据驱动组件化

大家还在烦扰jquery那恶心的操作Dom的方式吗?一个人一种写法,哪一天dom结构发生变化,可能你的Dom操作又得跟着更改了。然后,数据驱动却完全避免了上面的恶习。页面的渲染只跟随数据的变动而进行渲染,代码变得简洁优雅。我们可以监听数据的改动,触发不同的事件。大家都很清楚如今快节奏的生活,更需要您在工作中提高效率,而组件化恰到好处的帮你偷懒!您可以把您能想到的东西都抽离出组件来,最后的页面就变成简单的搭积木了。

三、

一提到vue.js,就不得不说虚拟Dom。

大家都知道浏览器渲染最坑爹的就是Dom渲染了,这是web开发的硬伤。vue.js 2.0华丽地使用了虚拟Dom技术,让您页面的性能大大提高。当然,如果您有兴趣也可以去研究下react.js,毕竟它是虚拟Dom的始祖。

四、

vue.js 是mvvm框架?

总的来说,vue.js主要作用在V层,它本质上是视图层的一个框架,它实现的双向绑定,您可以像使用angular那样愉快地进行数据的操作。

五、

声明式渲染?

这是个什么鬼?首先我们先了解下声明式与命令式的概念。
命令式编程:命令“机器”如何去做事情(how),这样不管你想要的是什么(what),它都会按照你的命令实现。
声明式编程:告诉“机器”你想要的是什么(what),让机器想出如何去做(how)。
我举个例子吧。

// 命令式关注如何做(how)

var numbers = [1,2,3,4,5,6]

var doubled = []

for(var i = 0; i < numbers.length; i++) {
  var newNumber = numbers[i] * 2
  doubled.push(newNumber)
}
console.log(doubled) //=> [2,4,6,8,10,12]
遍历整个数组,取出每个元素,乘以二,然后把翻倍后的值放入新数组,每次都要操作这个双倍数组,直到计算完所有元素。

// 声明式关注做什么(what)

var numbers = [1,2,3,4,5,6]

var doubled = numbers.map(function(n) {
  return n * 2
})
console.log(doubled) //=> [2,4,6,8,10,12]
map 函数所作的事情是将直接遍历整个数组的过程归纳抽离出来,让我们专注于描述我们想要的是什么(what)。

六、

模板、指令

用过angular的人,肯定都会对指令系统爱不释手。Vue.js同样也小巧的实现了指令系统。Vue.js 使用了基于 HTML 的模版语法,允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。所有 Vue.js 的模板都是合法的 HTML ,所以能被遵循规范的浏览器和 HTML 解析器解析。在底层的实现上, Vue 将模板编译成虚拟 DOM 渲染函数。结合响应系统,在应用状态改变时, Vue 能够智能地计算出重新渲染组件的最小代价并应用到 DOM 操作上。如果你熟悉虚拟 DOM 并且偏爱 JavaScript 的原始力量,你也可以不用模板,直接写渲染(render)函数,使用可选的 JSX 语法。

七、

拥有自己的构建工具,支持您用ES6愉快的写代码。

八、

作者是中国人,但是,牛B程度不逊色与react,不选择不行啊!

web开发分享



声明: 本文由( zongyan86 )原创编译,转载请保留链接: vue系列教程:1.为啥选择vue.js?

关注我们