Javascript:获取父元素's原型' this '

Javascript: get the parent's prototype `this`

本文关键字:原型 this 获取 元素 Javascript      更新时间:2023-09-26

我致力于改进一些bezier easing函数,并且有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相关的值在_bezier.render函数中未定义。

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

所以,问题是,有没有办法从_bezier.render函数内的_bezier.processBezier中获得this ?

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

尝试使用.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);
};
// ...