JS中的this指向问题，以及this的作用

this是作用域中的参数，因为常用到，在这里做一下总结。

1. this的概述

(1) 解析器在每次调用函数的时候都会向函数内部传递进一个隐含的参数，这个隐含的参数就是this；

(2) this指向的是一个对象，函数执行的上下文对象；

(3) 在这里我把this理解为一个操作这个函数执行的句柄(操作者)，就像一个人(this)拿着锯子(函数)去锯木头(函数执行的上下文对象功能)；

(4) 根据函数的调用方式的不同,this会指向不同的对象

var name = '全局';
function an(){
    console.log(this);
}
an();  // 等同于 window.an(); 输出Window对象： Window {...}

var obj = {
    name:'周瑜',
    do:an
}
obj.do();  // 输出obj对象： {name: "周瑜", do: ƒ}
var obj2 = {
    name:'小乔',
    do:an
}
obj2.do();  // 输出obj2对象： {name: "小乔", do: ƒ}

从上面的结果图可以看到，用obj和obj2调用do方法的时候，输出的this就是指向操作他们的句柄(操作者)，obj和obj2；另外，在全局作用域中定义的变量和函数都会作为window的属性和方法保存，所以执行an()，等同于执行window.an()，this同样指向调用do方法的句柄window。

2. this的作用

现在假设我们有如下需求，有三个人要来公司上班，每个人都要打卡，在他们打卡的时候我需要获得他们每个人的名字。

这时候我分析了一下，三个人打卡，就是三个人或者更多人都做打卡这个操作，每个人都是一个独立不同的对象，都有自己的名字。

根据这个，我创建一个员工对象类，类中包含打卡这个方法，这里我将使用es6创建类的语法

class worker{
  constructor(name) {
    this.name = name
  }
  // 打卡
  record(){
    console.log(this.name)
  }
}
let zhouyu = new worker('周瑜');
let xiaoqiao = new worker('小乔');
let daqiao = new worker('大乔');

zhouyu.record();   // 周瑜
xiaoqiao.record(); // 小乔
daqiao.record();   // 大乔

扫描二维码关注公众号，回复： 1815212 查看本文章

如上面看到的，可以有任意多个人去打卡，只需要使用this，就可以直接获取打卡人的名字