title: 箭头函数

箭头函数

ES6允许使用“箭头”（=>）定义函数。

  1. let [函数名] = (参数) => (
  2.     返回值
  3. )

等同于下面函数

  1. function [函数名]([参数]){
  2.     return (
  3.     返回值
  4.     )
  5. }

注意：箭头函数的参数小括号，一位参数时可以省略小括号。

如果函数执行多条js语句，用{}包裹。如果有返回值使用return返回

  1. let [函数名] = (参数) => {
  2.     js语句;
  3.     return (
  4.         返回值
  5.     )
  6. }

如果函数返回对象，用({})包裹

  1. let [函数名] = (参数) => ({
  2.     js语句;
  3.     return (
  4.         返回值
  5.     )
  6. })

匿名箭头函数

  1. setTimeout(function(){
  2.         console.log('a')
  3.       } ,1000)

可以写为

  1. setTimeout( () => 
  2.     console.log('a')
  3. ,3000)

箭头函数的this指向

  1. let sun = () => console.log(this);
  2. sun()

指向定义时所在的对象，而不是使用时所在的对象。

普通函数指向window

  1. function sun(){
  2.     console.log(this)
  3. };
  4. sun()
  5. //undefined

在严格模式下输出undefined

箭头函数指向的this在声明时就会绑定，以后所有的this都指向声明时的this。

  1. function foo() {
  2.   setTimeout(() => {
  3.     console.log('id:', this.id);
  4.   }, 100);
  5. }
  7. var id = 21;
  9. foo.call({ id: 42 });

箭头函数里的this指向本身，也就是foo，执行foo的时候指向foo的id替换为42