1.ES6– 新一代JavaScript范例
1.1 const和let关键字
之前只要全局变量以及函数内部的局部变量，所以之前的局部变量只能定义在函数内里，然则如今不是了，能够经由过程let关键字来定义局部变量。同时经由过程const关键字来定义常量，定义后的基础范例数据是不能转变的，然则定义的是援用范例的变量的话，照样能够转变的。
1.2 函数
1.箭头函数，在回调中很有作用，箭头函数永远是匿名的
2.this在箭头函数中的运用：在嵌套函数中，碰到setInterval, setTimeout等定时器函数时，this会发作漂移，指向windows（global对象），之前我们要将this缓存[var self = this;]()或许经由过程[(){}.bind(this]())来转变this的内部函数的指向，然则有了箭头函数后，再也不必更忧郁这个题目了；
3.函数默许参数，之前的函数默许参数 [var a = a || []]();然则ES6支撑了函数的默许参数；
4.rest参数[…](),rest参数是没有指定变量名的参数数组，而arguments是一切参数的鸠合。而且arguments参数不是一个真正的数组，而rest参数是一个真的数组，能够挪用sort和map要领。能够离别arguments参数了；
1.3.睁开符操纵
…能够用于函数的挪用，数组字面量，以及对象的睁开（ES7）.
1.4.模板字符串
用反引号标识。它能够看成平常字符串运用，也能够用来定义多行字符串，或许在字符串中嵌入变量。模板字符串中嵌入变量，须要将变量名写在${}当中。
// 字符串中嵌入变量
var name = "Bob", time = "today";
Hello {name}, how are you {time}?1.5 解构赋值
解构要领能够很快的从数组或许对象中提取变量，能够用一个表达式读取全部解构；
1.6 类
JavaScript是原型继续的，但声明起来却很怪，一切供应了一个原型链的class语法糖。经由过程class关键字定义了一个“类”，能够看到内里有一个constructor要领，这就是组织要领，而this关键字则代表实例对象。constructor要领是类的默许要领，经由过程new敕令天生对象实例时，自动挪用该要领。一个类必须有constructor要领，假如没有显式定义，一个空的constructor要领会被默许增加。
注重，定义“类”的要领的时刻，前面不须要加上function这个关键字，直接把函数定义放进去了就能够了。别的，要领之间不须要逗号分开，加了会报错。类的数据范例就是函数，类自身就指向组织函数。
Class之间能够经由过程extends关键字完成继续，这比ES5的经由过程修正原型链完成继续，要清楚和轻易许多。
子类必须在constructor要领中挪用super要领，不然新建实例时会报错。这是由于子类没有本身的this对象，而是继续父类的this对象，然后对其举行加工。假如不挪用super要领，子类就得不到this对象。另一个须要注重的处所是，在子类的组织函数中，只要挪用super以后，才够运用this关键字，不然会报错。这是由于子类实例的构建，是基于对父类实例加工，只要super要领才返回父类实例。
super这个关键字，既能够看成函数运用，第一种状况，super作为函数挪用时，代表父类的组织函数。第二种状况，super作为对象时，指向父类的原型对象。能够采纳super(). + 要领名字来挪用父类的要领。
类相当于实例的原型，一切在类中定义的要领，都会被实例继续。假如在一个要领前，加上static关键字，就示意该要领不会被实例继续，而是直接经由过程类来挪用，这就称为“静态要领”。
1.7 模块
1.起首推出Require.js的AMD范例，Node.js降生后，随之而来的是CommonJS花样，厥后的browerify，晓得es6推出了模块化，对模块化举行了支撑；
es6模块功用重要由两个敕令组成：export和import。export敕令用于划定模块的对外接口，import敕令用于输入其他模块供应的功用。经由过程as取别号。
export {firstName, lastName, year};
import {firstName, lastName, year} from './profile';
function setName(element) {
element.textContent = firstName + ' ' + lastName;
}1.8 运用Babel
种种计划屡见不鲜，JavaScript不断生长，致使许多机能没法提高，babel供应了JavaScript多用途编译器。让你能够高兴的运用ES6.
Babel经由过程装置插件（plugin）或许预设（preset，就是一组设定好的插件）来编译代码。建立一个.babelrc文件。
{
"presets":[],
"plugins":[]
}2.Component组件与模块化
起首要邃晓两个观点：模块（module）和组件（component）,模块是指的言语层面的，在前端大多数指的是一个JavaScript模块，每每变现为一个JavaScript文件，以及其对外暴露的一些属性和要领。组件更倾向于营业层面，每每是一个自力功用的完成，比方一个下拉菜单，文本编辑器，路由体系等。一个组件每每包含其所需的一切资本，包含逻辑js,款式css，模板html（template），以至图片和笔墨。
2.1模块化计划的阶段
1.全局变量+定名空间：
防止污染全局作用域，模块内部通经常使用匿名自实行函数。题目多多：（1）依靠全局变量，污染全局变量的同时，不安去.（2）依靠商定的定名空间，不可靠。（3）要手动治理并掌握实行，轻易失足，在上线前要手动兼并一些模块
2.AMD+CommonJs
处置惩罚时上述的题目，全局下定义require和define，不须要其他变量
经由过程文件途径或模块声明来定义模块
依靠与加载都是由加载器完成，供应了打包东西自动剖析依靠并兼并
3.ES6模块化
JavaScript带来了本身的模块化计划，比拟AMD/CommonJS,功用更壮大，援用和暴露的体式格局更多样，支撑庞杂的静态剖析，使构建东西更细粒度地移除模块完成中的无用代码。
2.2 组件化阶段
1.基于定名空间的多进口文件
基于前面的第一种模块化计划，差别资本手动导入，最典范的就是jQuery插件；
2.基于模块的多进口文件
跟着前端模块化计划的盛行，组件也趋于AMD如许的范例，把组件也暴露为一个模块。一个AMD模块的JavaScript，一个CSS(Less,Sass)模块的款式，以及其他资本。
3.单JavaScript进口的组件
这是如今比较盛行的计划，借助browerify、webpack如许的打包东西，许可我们将平常的资本当作JavaScript模块来看待。并一致的加载进来。
4.Web Component
这是组件化里的国家队，与2011年提出，然则还处于不温不火的状况，重要包含自定义元素（Custom Element）、HTML模板（HTML Template）、Shadow DOM、HTML 的引入（HTML Import）
3.前端开辟经常使用东西
1.包治理东西
用来装置、治理和分享JavaScript包，同时自动处置惩罚多个包之间的依靠。重要有包治理东西，Bower、Component、Spm、以及Node.js的亲儿子npm;
2.使命流东西
在前端项目中会碰到林林总总的使命，比方紧缩兼并代码、考证代码花样、测试代码、看管文件等等，实行这些要领不可能每次都去手动写这些敕令，异常贫苦，打仗Linux的肯定会想到shell剧本。如今前端比较盛行的有Grunt和Gulp两个；
3.模块打包东西
重要有bundler和webpack两个，webpack作为后起之秀，它支撑AMD、CommonJS范例，经由过程loader机制也能够运用ES6的模块花样，正向一个全能型构建东西生长。
