【发布时间】: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