JavaScript基本知识点——this

面试题：什么是this指针？各种情况下的this指向哪里？

所谓的this，就是一个对象。不同情况下this指向不同，同时我们也可以手动修改this指向。

this指向问题

对象调用

对象调用时，this指向该对象（谁调用，this就指向谁）

let obj = {
  name: '张三',
  fun: function () {
    console.log(this)
  }
}

obj.fun()	// { name: '张三', fun: [Function: fun] }

直接调用

直接调用时，this指向全局window对象

console.log(this)	// window

new

通过new的方式，this永远指向新创建的对象

function Person(name) {
  this.name = name
  console.log(this);
}

let zhangsan = new Person('zhangsan')	// Person { name: 'xiaoming' }

箭头函数中的this

箭头函数的this与声明所在的上下文相同，即调用箭头函数时，不会隐式调用this参数，而是从定义时的函数继承上下文

const obj = {
  name: 'zhangsan',
  fun: () => {
    console.log(this);
  }
}

obj.fun()	// {}

修改this指向

修改方式有三种：call，apply，bind

这些方法的第一个参数应该是一个对象。如果参数为空，null和undefined，则默认传入全局对象。

三种方法的差别在于后续传参的方式

• call的后续参数是单个传递的
• apply的后续参数是以数组的形式传递的
• bind的后续参数没有规定，单个传递和数组传递都行，但是bind函数会返回一个修改好指向的新函数。

var obj = {
    name:'zhangsan',
    age:'22',
}

function print(){
    console.log(this);       // 打印 this 的指向
    console.log(arguments);  // 打印传递的参数
}

// 通过 call 改变 this 指向
print.call(obj,1,2,3); 

// 通过 apply 改变 this 指向
print.apply(obj,[1,2,3]);

// 通过 bind 改变 this 的指向
let fn = print.bind(obj,1,2,3);
fn();

// 最终结果都是:
// { name: 'zhangsan', age: '22' }
// [Arguments] { '0': 1, '1': 2, '2': 3 }

面试题：箭头函数的this指向能否被修改？

箭头函数没有自己的this指针，使用这三个方法时，只能传递参数，不能绑定this，它们的第一个参数会被忽略。