ECMAScript 6学习方案和侧重点

初接触前端的框架都会对里面的js代码一脸懵逼，因为框架都是使用es6或者更高版本的js。那么当我们接触框架前学会es6不是就简单许多了。

记住每个语言的更新都是为了完善缺点，强化优点，补充不足，增强功能为目的的

很多人也包括我都对前端的日新月异所烦恼，甚至还有抵触。因为今天才学会，下个月就发现有了替代方法和新知识出现。但程序语言就是一个不停迭代更新的东西，特别是新生代的语言前端例如JS，CSS，HTML，后端例如Go，PHP……恨不得一天一更新！但是他们的更新永远是为了更好，更完善这门语言的。所以你不用抵触，应该欣喜，因为你前面苦恼的东西也许这次更新就解决了这个问题。

学习ES6的目的是为了框架，所以不用全部研究透彻。

虽然现在浏览器开始慢慢的支持了大多数ES6的方法，可是依旧不是全部。所以我们并不能完全使用ES6直接上手项目。那么我们也就没必要全部掌握牢固，当然如果你能自然最好，可是为了效率，公司现在马上要前后端分离使用框架，等不及你的时候，你要学会侧重学习。学习框架所常用的ES6方法和知识，而你不会框架怎么知道学那些呢？我告诉你！

变量声明不再常用var而是使用let和const。

var声明变量是有很多坑的，变量提升、重复声明、跨作用域，如果你写的代码和项目够多，那你一定知道这些坑极其烦人。所以ES6出来了let和const两种声明变量的方式。

• 不存在变量提升，必须在使用之前声明。
• 不存在重复声明，一旦重复马上报错。
• 不跨出声明所在的作用域，也就是{}内，外面不能使用。
• const 一旦赋值不允许修改。
  [详情学习参看]:http://es6.ruanyifeng.com/#docs/let

箭头函数替代function

框架中的this都是指向框架实例本身，而你以前学习的this指向是window实例，如果在函数体内，那就是函数本身！而框架中大多数时候我们要用的都是当前实例数据，这个this最好就是框架实例。而使用function fun() {}一定会改变this指向，箭头函数则不会。

• 基本格式 () => {} 写法更简洁
• this的指向始终是指向定义它所在的对象，而不会指向调用它的对象
  [详情学习参看]:http://es6.ruanyifeng.com/#docs/function#箭头函数

for...of循环替代for(;;)循环

忘记for循环，使用for...of循环。偶尔有特殊场景当然还得用for循环。看看实例谁更清晰更一目了然。

  var arr = [{name: 'xiaoxiajie', age: 17},{name: 'fengzi', age: 18}]

  for(var i = 0; i < arr.length; i++) { 
    console.log(arr[i].name + '今年' + arr[i].age + '岁'
  }
  // 对比
  for(let key of arr) {
    console.log(key.name + '今年' + key.age + '岁'
  }

• 代码手打未检测准确性！
  [详情学习参看]:http://es6.ruanyifeng.com/#docs/iterator

Module是框架里依赖的重中之重

这是理解框架必须学习的东西，也是js之前没有的概念。框架里随处可见。

• export default
• import * from
  [详情学习参看] :http://es6.ruanyifeng.com/#docs/module

Promise和Async、Await

js异步处理的几个方式，Promise是最基本的，后面的算是对他进一步封装和加强。

Promise:
http://es6.ruanyifeng.com/#docs/promise
Async/Await
https://www.cnblogs.com/fundebug/p/6667725.html

...拓展运算符

随处可见...，其实是一种运算符，是ES6新增的。看实例。

var str = 'xiaoxia'
console.log(...str) // ['x','i','a','o','x','i','a']

不好讲清楚，还是自己看吧，包括对象结构也可以看看。

[对象结构和拓展运符]https://www.cnblogs.com/chrischjh/p/4848934.html

待补充...