箭头函数

es6 容许应用“箭头”（=>）定义函数。岂但简化了代码，最重要的一点就是解决了es5中的this指向问题,在es6中的箭头函数里this指向的永远是定义时的对象，而非应用时的对象。例如：

let f = v => v;// 等同于let f = function (v) { return v;};

如果箭头函数不须要参数或须要多个参数，就应用一个圆括号代表参数局部。例如：

let f = () => 5;// 等同于let f = function () { return 5 };  let sum = (num1, num2) => num1 + num2;// 等同于let sum = function(num1, num2) {    return num1 + num2;};

如果箭头函数的代码块局部多于一条语句，就要应用大括号将它们括起来，并且应用return语句返回。例如：

let sum = (num1, num2) => { return num1 + num2; }

箭头函数使得表白更加简洁。例如：

const isEven = n => n % 2 == 0;const square = n => n \* n;

下面代码只用了两行，就定义了两个简略的工具函数。如果不必箭头函数，可能就要占用多行，而且还不如当初这样写醒目。

箭头函数的一个用途是简化回调函数。

// 失常函数写法[1,2,3].map(function (x) { return x * x;});// 箭头函数写法[1,2,3].map(x => x * x);// 失常函数写法var result = values.sort(function (a, b) { return a - b;});// 箭头函数写法var result = values.sort((a, b) => a - b);

箭头函数有几个应用留神点。

（1）函数体内的this对象，就是定义时所在的对象，而不是应用时所在的对象。

（2）不能够当作构造函数，也就是说，不能够应用new命令，否则会抛出一个谬误。

（3）不能够应用arguments对象，该对象在函数体内不存在。

例如：

let handler = {    id: '123456',    init: function() {        document.addEventListener('click',event => this.doSomething(event.type), false);    },    doSomething: function(type) {        console.log('Handling ' + type  + ' for ' + this.id);    }  };

下面代码的init办法中，如果用是是一般的function函数，this本该是document自身，应用了箭头函数后，使这个箭头函数外面的this，总是指向handler对象；
doSomething里的this指向的是doSomething运行时所在的对象handler。

this关键字

this能够用在构造函数之中，示意实例对象。除此之外，this还能够用在别的场合。但不论是什么场合，this都有一个共同点：它总是返回一个对象，简略说，this就是属性或办法“以后”所在的对象。

this次要有以下几个应用场合

（1）全局环境

全局环境应用this，它指的就是顶层对象window。

this === window // truefunction f() {    console.log(this === window);}f() // true

留神：严格模式下 一般函数外部 this 等于 undefined

（2）构造函数

构造函数中的this，指的是实例对象

function Person(p) {   this.p = p;   console.log(this)//Person { p: "测试this指向" } }; var obj = new Person()

从打印后果能够看出下面代码里的this指向的就是Person实例

（3）对象的办法

如果对象的办法外面蕴含this，this的指向就是办法运行时所在的对象。

var person = {    name: '张三',    describe: function () {        return '姓名：'+ this.name;    } };person.describe()// "姓名：张三"

下面代码中，this.name示意name属性所在的那个对象。因为this.name是在describe办法中调用，而describe办法所在的以后对象是person，因而this指向person，this.name就是person.name。

(4)匿名函数中的this
在办法外部呈现匿名函数，那么匿名函数里的this指向的对象是不确定的,例如：

var dogs={    name:"小黑",    age:"1岁",    voice:function(){        console.log(this.name);        setTimeout(function(){            console.log(this);//返回的是window            console.log(this.name);//没有返回值，因为这里的name是一个不存在的属性            //解决办法是console.log(dogs.name);        },1000);    }}dogs.voice();

扭转this指向

1.应用箭头函数
2.函数里，如果想在办法里的事件外部调用这个办法内部的办法，能够在内部申明一个变量，let that=this;
例如：

function a(){    let that=this;    function b(){        console.log(that)    }    b();}

3.应用bind或者、call、或者apply办法扭转this指向；
bind是es6的办法，扭转的是新函数的this;
call和apply是es5的办法:
call扭转的是原函数的this,它的第一个参数是扭转的this指向的对象，残余的参数顺次赋值给原函数形参;
apply扭转的也是原函数的this,它的第一个参数也是扭转的this指向的对象，第二个参数是一个数组，数组里的值顺次赋值给原函数的形参
例如：

//在全局申明一个box函数，应用bind办法将this指向从window变为boxfunction box(){    console.log(this);//[object global]}box();let res=box.bind(box);res();//bind:绑定数组function box2(a,b){    console.log(this);//1,2}let arr=[1,2];let res2=box2.bind(arr);res2(...arr);//bind:绑定对象function objs(o){    console.log(this);//{ o: '对象' }}let obj={o:"对象"};let res3=objs.bind(obj);res3(obj.o);//es5:callfunction box4(aa,bb){    console.log(this);//[ 1111 ]}let ccc=[1111];box4.call(ccc,10,12);//es5:applyfunction box5(cc,dd){    console.log(this);//{a:"你好"}}var obj={a:"你好"};box5.apply(obj,[88,99]);//apply的max和min办法//如果第一个参数为空示意不扭转原对象var arr2=[5,7,10,11,345,365];console.log(Math.max.apply(null,arr2));//365console.log(Math.min.apply(null,arr2));//5