this的指向以及修改this指向

this指向

this的基本指向

调用方式	this指向
普通函数调用	window
构造函数调用	实例对象 原型对象里的方法也指向实例对象
对象方法调用	该方法所属对象
事件绑定方法	绑定事件对象
定时器函数	window
立即执行函数	window

总结来说：除了定时器、普通函数和立即执行函数this指向为window，其他都指向调用者

this指向被改变的情况

• call()：调用函数并改变函数的this指向

    var o ={
      name:'mkbird'
    }
    function fn(){
      console.log(this);
    }
    fn() // 输出window

    fn.call(o); // 调用fn并将fn的this指向o，输出对象o

// 所以es5很多时候在子类继承父类时会使用Father.call(this)来使用父类的属性，es6使用super()

// 同时call()在实现调用函数功能时，还能传入参数
    var o ={
      name:'mkbird'
    }
    function fn(a,b){
      console.log(a+b);
    }
    fn.call(o,1,2); // 输出3

• apply()：与call的区别在于参数，必须传入数组，返回的是字符串或数字

fun.apply(thisArg,[argsArray])

// apply主要利用它传入数组返回数字的特性解决数组中的问题
// 比如Math.max只支持传入数字，但是我们现在用的是数组
var arr = [1.2,3]
var max = Math.max.apply(null,arr)
console.log(max) // 3

• bind()：bind不会调用函数，只修改this的指向，返回的是原函数改变this后的新函数

//如果有函数不想立即调用，又想改变函数的内部指向，这时就用bind
    var o ={
      name:'mkbird'
    }
    function fn(){

    }
    var f =fn.bind(o)
    f();

箭头函数中的this

// 箭头函数是函数换了一种写法
(参数)=>{函数体}

箭头函数与普通函数最大的区别是，箭头函数不会绑定this，箭头函数中的this指向箭头函数定义区的this

注意：箭头函数没有剩余参数arguments，如果想保存剩余参数只能使用…

…可以将剩余参数以数组的形式存起来

let students = ['zs','ls','ww']
let [s1,...s2] = student;
console.log(s1);  //'zs'
console.log(s2);  //['ls','ww']