1.vue.js是什么？
vue.js是一套构建用户界面的渐进式框架。
vue.js目标是通过尽可能简单的API实现相应的数据绑定和组合的视图组件
vue.js单页面应用程序（SPA）
vue.js的核心只关注视图层，HTML中的DOM就可以与其他的部分独立开来划分出一个层次，这个层次就叫做视图层。
Vue.js有声明式，响应式数据绑定，组件化开发，Virtual DOM（虚拟DOM）
2.响应式数据绑定
vue.js会自动对页面中某些数据的变化做出响应
3.组件化开发
Vue.js通过组件，把一个单页应用中的各种模块拆分到一个一个单独的组件（component）中，我们只要先在父级应用中写好各种组件标签（占坑），并且在组件标签中写好要传入组件的参数（就像给函数传入参数一样，这个参数叫做组件的属性），然后再分别写好各种组件的实现（填坑），然后整个应用就算做完了。
4.Virtual DOM
Virtual DOM是一种可以预先通过JavaScript进行各种计算，把最终的DOM操作计算出来并优化，由于这个DOM操作属于预处理操作，并没有真实的操作DOM，所以叫做虚拟DOM。最后在计算完毕才真正将DOM操作提交，将DOM操作变化反映到DOM树上。
5.相关学习
ECMAScript6，Webpack，NPM、Vue-router、VueX、Vue-Cli、Node.js。
6.webpack:前端打包和构建工具
因为单页应用程序中用到很多素材，如果每一个素材都通过在HTML中以src属性或者link来引入，那么请求一个页面的时候，可能浏览器就要发起十多次请求，往往请求的这些资源都是一些脚本代码或者很小的图片，这些资源本身才几k，下载连1秒都不需要，但是由于HTTP是应用层协议，它的下层是TCP这个运输层协议，TCP的握手和挥手过程消耗的时间可能比下载资源本身还要长，所以需要把这些小文件全部打包成一个文件，这样只要一次TCP握手和挥手的过程，就把多个资源给下载下来了，并且多个资源由于都是共享一个HTTP请求，所以head等部分也是共享的，相当于形成了规模效应，让网页展现更快，用户体验更好。
Webpack还有构建的功能，这就不得不提到了ECMAScript6这个新版本的JavaScript，但是现在国内外还有很多人用着老版本的浏览器，这些浏览器并不支持ECMAScript6，那么我们的前端项目如何在这种浏览器上运行呢？这就需要Webpack的Loader自动载入一个转换器来将我们写的ECMAScript6转换成浏览器能支持的老版本JavaScript语言，这个转换器的名字叫做babel，这也是Webpack的构建功能。当然对前端有更深入的同学还会知道Sass，Less，stylus之类的CSS预处理器，我们也可以通过在Loader中编写特定的规则来实现自动将这些CSS预处理语言转换成普通浏览器能识别的CSS代码。
开头的介绍提到了vue.js可以使用单文件组件开发项目，其实也是通过Webpack将单文件组件中的模版，样式以及JS转换到主页面中当然Webpack不止这点功能，它还可以通过安装各种插件来扩展，比如说热加载技术，就是解放键盘的F5键。让我们修改代码，并且按Ctrl+S保存之后，浏览器页面自动刷新变化，不需要我们去手动刷新，还有一些插件可以自动添加注释，自动给CSS代码加上一些浏览器内核对CSS3兼容前缀，就像webkit-xxx之类的一样。
7.NPM和Node.js又是什么？它们是什么关系？
我们知道通常情况下，JavaScript的运行环境都是浏览器，因此JavaScript的能力也就局限于浏览器能赋予它的权限了。比如说读写本地系统文件这种操作，一般情况下运行在浏览器中的JavaScript代码是没有这个操作权限的。如果我们想用JavaScript写出一些能够运行在操作系统上的，能够具有像PHP，JAVA之类的编程语言具有的功能的程序该怎么办呢？Node.js就解决了这个问题。Node.js是一个服务端的JavaScript运行环境，通过Node.js可以实现用JavaScript写独立程序。像我们之前提到的Webpack就是Node.js写的，所以作为一个前端开发，即使你不用Node.js写独立程序，也得配一个Node.js运行环境，毕竟很多前端工具都是使用它写的
NPM是一个node.js的包管理器。通过npm install xxx包名称的方式引入它，比如说npm install vue就自动在当前项目文件夹下导入了这个包，并且npm自动下载好了vue这个包依赖的其他包。
8.Vue-CLi又是啥？
它是一个vue.js的脚手架工具。一个自动帮你生成好项目目录，配置好Webpack，以及各种依赖包的工具，它可以通过npm install vue-cli -g的方式安装，后面的-g表示全局安装的意思，意味着你可以打开命令行之后直接通过vue命令调用它。
9.Vuex和Vue-route，它们又是什么？
Vuex是vue的一个状态管理器。用于集中管理一个单页应用程序中的各种状态。
Vue-route是vue的一个前端路由器，是一个管理请求入口和页面映射关系的东西。它可以实现对页面局部进行无刷新的替换，让用户感觉就像切换到了网页一样。
10.我还在一些地方看到过Vue-resource和Axios，它们又是什么？
单页应用程序属于前后端分离开发，这个单页应用程序中的数据就得通过ajax的方式获取，也要通过ajax的方式提交到后端。在传统开发中我们都是通过xmlhttprequest手动操作，或者通过JQuery的ajax方法来进行数据提交获取。vue.js本身没有封装ajax操作库，所以我们要通过Vue-resource和Axios来进行ajax操作，而因为种种原因，现在vue.js2.0已经将axios作为官方推荐的ajax库了。
网友评论