在javascript中的接口的等效

我有一个JavaScript中的函数对象，被称为BlinkyTextBox在里面我有2 Shape充当滚动按钮的对象。我需要一个非常简单的事情，它只是增加或减少一个名为scrollY的变量。在javascript中的接口的等效

我试着用一个匿名的内部函数，但函数无法识别成员变量。现在我试着用一个成员函数，但它不适用于...

这里是我所谈论的两个示例。

function BlinkyTextBox(textdata, font, w, h) 
{ 


    this.scrollY = -50; 


    this.scrollBarYTop = new Button(); 

    this.scrollBarYTop.callFunction = this.scrollUp; 

    this.scrollBarYBottom = new Button(); 
    this.scrollBarYBottom.callFunction = function() 
    { 
      this.scrollY -= 10; 
    } 

} 
BlinkyTextBox.prototype.scrollUp = function() 
{ 
    this.scrollY += 10; 
}

来源

2016-12-01 Matthew

'this'指功能'.callFunction'里面别的东西，看看在使用'.call（）'或'.apply（）'将范围传递给你调用的函数中https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/函数/调用 – haxxxton

的这里的问题是，一旦你分配一个函数的另一个对象函数内this将引用新的对象，而不是函数来自的对象。

例如：

var a = { 
    message : 'Hello!', 
    say : function() { return this.message } 
} 

var b = { 
    message : 'Goodbye' 
} 

b.say = a.say; 

console.log(a.say()); // Hello! 
console.log(b.say()); // Goodbye

请注意，我们没有做任何的功能say()。我们只是将它分配到b，现在打印的消息是b而不是a。

现在，让我们看看你的代码：

this.scrollBarYBottom.callFunction = function() 
{ 
     this.scrollY -= 10; // refers to scrollBarYBottom.scrollY 
          // not BlinkyTextBox.scrollY 
}

同样的事情发生在其他方法：

this.scrollBarYTop.callFunction = this.scrollUp; 
// the this inside scrollUp will now refer to scrollBarYTop

传统上，为了解决这个问题，你会使用一个别名this：

var myself = this; 
this.scrollBarYBottom.callFunction = function() 
{ 
     myself.scrollY -= 10; 
}

但是使用ES5，您可以使用.bind()方法：

this.scrollBarYBottom.callFunction = (function() 
{ 
     this.scrollY -= 10; 
}).bind(this);

和：

this.scrollBarYTop.callFunction = this.scrollUp.bind(this);

参考这个答案的this更详细的解释：How does the "this" keyword in Javascript act within an object literal?

来源

2016-12-01 04:15:39 slebetman

当我做'this.scrollBarYTop.callFunction = this.scrollUp.bind（this） ;'我得到一个错误，说'无法读取属性'绑定'未定义 – Matthew

与'自己'的另一种方式很好！谢谢！ – Matthew

在javascript中的接口的等效

回答

相关问题