【问题标题】:Javascript: get the parent's prototype `this`Javascript:获取父母的原型`this`
【发布时间】:2015-07-22 16:44:41
【问题描述】:

我致力于改进一些贝塞尔曲线缓动函数,但 this 存在问题。基本上,一个Ease 对象。

Ease.bezier = function(mX1, mY1, mX2, mY2) {
    return _bezier.processBezier(mX1, mY1, mX2, mY2);
};

var _bezier = Ease.bezier.prototype;

_bezier.processBezier = function (mX1, mY1, mX2, mY2) {

    console.log(this) // this shows the proper object       
    this.mX1 = mX1;
    this.mX2 = mX2;
    this.mY1 = mY1;
    this.mY2 = mY2;

   return _bezier.render;      
};

_bezier.render = function(aX){ 
    console.log(this) // this shows another object
    if (this.mX1 === this.mY1 && this.mX2 === this.mY2) return aX;

    if (aX === 0) return 0;
    if (aX === 1) return 1; 
    return _bezier.computeBezier(_bezier.gx(aX), this.mY1, this.mY2);       
};

_bezier.render 函数是绑定到补间引擎的函数,例如tween.js,因此继承了它的this,因此this.mX1 的值和其他与贝塞尔相关的值在_bezier.render 中未定义功能。

如果我将 this 替换为 _bezier,动画可以工作,但将始终使用最后一个实例的值来处理所有其他动画。

那么,问题是,有没有办法以某种方式从 _bezier.processBezier 中的 _bezier.render 函数中获取 this

或者也许我可以通过绑定函数来简化代码以访问正确的this

非常感谢。

【问题讨论】:

  • 我不明白你的代码。为什么在创建它之前使用 _bezier? Ease.bezier = function(mX1, mY1, mX2, mY2) { return _bezier.processBezier(mX1, mY1, mX2, mY2); };
  • 我认为你不了解 oop 和 javascript 原型方式。
  • 为什么不在函数内部使用“this”,而不是_bezier?
  • 正如我所说,this 不再是 Ease 对象,而是另一个对象。
  • 请告诉我们render是如何“绑定到像tween.js这样的补间引擎”的。可能你可以简单地使用.bind,然后再将它传递到那里。

标签: javascript object prototype


【解决方案1】:

尝试使用 .bind() 方法获取正确的 'this':

// ...
_bezier.processBezier = function (mX1, mY1, mX2, mY2) {

    console.log(this) // this shows the proper object
    this.mX1 = mX1;
    this.mX2 = mX2;
    this.mY1 = mY1;
    this.mY2 = mY2;

    // use .bind(this)
    return _bezier.render.bind(this);
};
// ...

【讨论】:

  • 嘿,感谢您的输入,不幸的是,此绑定似乎与在 render 函数中使用 _bezier 而不是 this 产生相同的结果。
  • @thednp:那是因为你的电话 _bezier.processBezier(…) 是错误的,而 this === _bezier (你肯定不想要)。
  • @Bergi 我认为我最好将 Ease 对象合并到 TWEEN.Tween 原型中,这样我就可以在整个 Ease 对象中拥有我需要的确切 this
  • @thednp: 做任何你想做的事,只要你了解它是如何工作的 :-)
  • @Bergi,抱歉,快速提问:我可以使用.bind 链接EaseTween 对象吗?这样,我可能在整个 Ease 对象中拥有我需要的确切 this
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2013-06-24
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2015-08-30
  • 2022-11-24
  • 2011-05-08
相关资源
最近更新 更多