2018-06-11深入浅出ES6（箭头函数）

学习箭头函数之前，先普及一个小知识点。

function show(a=1){
  let a = 2;
  console.log(a);
}
show();

上面的代码告诉我们函数的参数默认已经被定义了，一经声明，就不能再用let或者const进行声明了，只能用var。下面一起来看箭头函数吧。

//普通函数的写法
function show(){
  return 1;
}
show();

//箭头函数的写法
let show = () =>  1;//箭头的左边是参数右边是返回值
console.log(show());

如果想要在函数里面写语句的时候，写法是这样的：

let show = (a=1,b=2) => {
 console.log(a,b);
}
show();

箭头函数在写法和普通桉树除了写法不用之外。还有三点不同

let json = {
  name: 'Cyril',
  show: function(){
    setTimeout(function(){
        console.log(this.name);//控制台什么都没输出
    },1000);
  }
}
json.show();

这个例子大多是在vue等框架下开发遇到的问题，因为this指向是当前函数，先要让他指向外面的json对象，就还要在外面进行转换，太麻烦，而箭头函数则不同。

let json = {
  name: 'Cyril',
  show: function(){
    setTimeout(() => {
      console.log(this.name); //Cyril
    })
  }
}
json.show();

第一个不同之处就是箭头函数里的this指向的是定义函数所在的对象，而不是运行时所在的对象。

第二个就是箭头函数里面不能使用arguments，用了就是is not defined

解决办法：扩展运算符（本章的第五小节）

let show = (...a) => {
  console.log(a); //[1,2,3,4,5]
}
show(1,2,3,4,5);

第三个事箭头函数不能当作构造函数来用

let Show = () => {
  this.name = 'Cyril'；
}
let a = new Show();
console.log(a.name); //Show is not a constrator

GitHub个人主页 ：https://github.com/Cyrildog

有些鸟儿天生即使关不住的，他们的羽毛太鲜明，歌声太甜美。也太狂野了，所以你只能放他们走，否则那天你打开笼子喂它们时，他们也会想办法扬长而去。

[图片上传失败...(image-11e537-1528698466423)]