乐趣区

关于javascript:js原型链中的this

原型链中的 this 是指谁,通过三步确认:

1, 看是谁调用(点之前是谁,就是谁调用)
2, 进行 this 替换
3, 基于原型链确认后果
举例如下:

function Pointer(x,y){
  this.x = x
  this.y = y
  this.returnX = function(){console.log(this.x)
  }
}
Pointer.prototype.returnX = function(){console.log(this.y)
}
Pointer.prototype.sum = function(){console.log(this.x + this.y)
}
Pointer.prototype.param = function(){this.z = 4}
let p1 = new Pointer(2, 3)
console.log(p1.y) // 第一步:this:p1 , 第二步: p1.y , 第三步:p1.y =y  =>3 
p1.returnX() // 第一步:this:p1 , 第二步: p1.returnX , 第三步:p1.x =>2 
p1.__proto__.returnX() // 1: 第一步:this: p1.__proto__, 第二步: Pointer.prototype.returnX , 第三步:Pointer.prototype.y  =>undefined
Pointer.prototype.returnX() // 1: 第一步:this: Pointer.prototype, 第二步: Pointer.prototype.returnX , 第三步:Pointer.prototype.y  =>undefined
Pointer.prototype.sum() // 1: 第一步:this: Pointer.prototype, 第二步: Pointer.prototype.sum , 第三步:Pointer.prototype.x + Pointer.prototype.y  =>undefined +undefined = NaN
p1.param() // 1: 第一步:this: p1, 第二步: this.z => p1.z , 第三步:p1.z = 4  => 给 p1 实例增加一个 z 属性
Pointer.prototype.param() // 1: 第一步:this: Pointer.prototype, 第二步: this.z => Pointer.prototype.z , 第三步:Pointer.prototype.z = 4  => 给原型上设置一个 z 属性(实例的私有属性)
退出移动版