箭头函数

箭头函数可以缩减代码，最主要的是可以改变this指向

1.缩减代码

ES5

const double1=function(number){
    return number*2
}
console.log(double1(2))//4

ES6 

const double2=(number)=>{
    return number*2
}
console.log(double2(2))//4

const double3=(number)=>number*2

console.log(double3(2))//4

const double4=number=>number*2

console.log(double4(2))//4

const double5=(number=>number*2)

console.log(double5(2))//4

const double6=(number1,number2)=>number1+number2

console.log(double6(2,3))//5

 2.改变this指向

ES5

const schools={
    members:['清华大学','北京大学','北京外国语大学'],
    pos:'北京',
    check:function(){
        let self=this;
        return this.members.map(function(member){
            //map函数里的this不知道指向谁了,所以需要在进入map函数之前定义一个变量self来储存this
            return `${member}在${self.pos}`;
        })
    }
}

const schools={
    members:['清华大学','北京大学','北京外国语大学'],
    pos:'北京',
    check:function(){
        return this.members.map(function(member){
            //map函数里的this不知道指向谁了,可以绑定一个bind来绑定父级的this
            return `${member}在${this.pos}`;
        }.bind(this))
    }
}

 ES6

箭头函数的this指向他的父级

const schools={
    members:['清华大学','北京大学','北京外国语大学'],
    pos:'北京',
    check:function(){
        return this.members.map((member)=>{
            //map函数里的this不知道指向谁了,可以绑定一个bind来绑定父级的this
            return `${member}在${this.pos}`;
        })
    }
}
console.log(schools.check())

/*
[ 
"清华大学在北京",
​
"北京大学在北京",
​
"北京外国语大学在北京"
]
*/