一个有意思的this指向问题

2020-05-07 23:03:55 阅读：273 来源： 互联网

标签：function 有意思 flower 指向问题 petalCount LateBloomer bloom declare

首先来看一段代码：

function LateBloomer() {
  this.petalCount = Math.ceil(Math.random() * 12) + 1;
}

// Declare bloom after a delay of 1 second
LateBloomer.prototype.bloom = function() {
  setTimeout(this.declare.bind(this), 1000);
};
LateBloomer.prototype.declare = function() {
  console.log('I am a beautiful flower with ' +
    this.petalCount + ' petals!');
};

var flower = new LateBloomer();
flower.bloom();  // 一秒钟后, 调用'declare'方法

在bloom中，为什么要这样写呢？

this.declare.bind(this)
首先，这里的this指的是LateBloomer构造函数所要实例化的对象，即：

this.declare = function() {
  console.log('I am a beautiful flower with ' +
    this.petalCount + ' petals!');
};

若这么写：

setTimeout( function() {
  console.log('I am a beautiful flower with ' +
    this.petalCount + ' petals!');
}, 1000);

setTimeout的回调函数内部的this指向的是window，但petalCount属性是属于LateBloomer的instance，所以要用bind把this的指向变回来。

标签：function,有意思,flower,指向,问题,petalCount,LateBloomer,bloom,declare
来源： https://www.cnblogs.com/arduka/p/12823035.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

一个有意思的this指向问题