箭头函数

箭头函数即 省略function关键字 添加 => 符号

    const numArr = [1, 2, 3, 4]
    
    //function函数
    const num2 = numArr.map(function(num) {
        return  num*num
    })
    //箭头函数
    const numArr2 = numArr.map((num) => {
        return num*num
    })

特点

参数

当只有一个参数时,箭头函数中的()可省略,多个参数在括号中用,分割

    //箭头函数 
    const numArr2 = numArr.map(num => {
        return num*num
    })

隐式返回

箭头函数可以隐式返回
此时可以省略大括号和return关键字

    //大括号 和 return关键字必须同时省略
    const numArr2 = numArr.map((num) => num*num)

匿名函数

箭头函数是匿名函数

当要使用匿名函数时 我们可以将函数赋值给其他变量 然后使用

箭头函数的this继承父作用域

箭头函数没有自己的this值, 它的this值继承自父作用域

普通函数的this值是在运行时动态绑定的

因此当我们需要执行函数绑定this为当前运行对象时 可以使用箭头函数

   const people = {
       ownname: "fk",
       names: ["lyy", "tt"],
       showName: function() {
            this.names.map(function(name){
                //此时函数未回调的独立函数 this为window
                console.log(this) //window
                 //因为this此时为window 因此获取不到执行对象
                console.log(this.ownname+"名字"+name)
            })
       },
       showName2: function() {
            this.names.map(name => {
                //此时箭头函数的this继承了showname函数为people对象 
                //可以获取到对象
                console.log(this.ownname+"名字"+name)
            })
       }
   }
   people.showName()
   people.showName2()

当一个函数是独立函数时(常出现在回调函数中),即独立运行 而不是作为对象的方法执行时，该方法中的this会指向window对象，此时我们可以使用 call apply by等绑定执行对象 或者 使用箭头函数

不使用箭头函数的情况

作为构造函数、为原型或对象增加方法

当作为构造函数或者为原型对象添加方法时 不能使用箭头函数,因为此时获取不到this对象,需要使用传统的function函数

当函数没有父级作用域时而我们需要this时

当箭头函数作为对象方法的调用时,此时不能用箭头函数,因为此时箭头函数的this为window而不是该对象，此时使用传统function函数,作为对象方法执行可以将this绑定为当前对象

当需要arguments对象时

箭头函数中没有arguments对象
我们可以使用ES6新增的 ...arg