面向对象的Javascript错误对象不是函数答案

【问题标题】：Object Oriented Javascript Error Object Is Not A Function面向对象的Javascript错误对象不是函数
【发布时间】：2014-12-26 11:33:47
【问题描述】：

我正在尝试创建一个简单的选框，它只是在间隔中发生变化。我只是想理解 Javascript 中的对象。目前，我收到错误消息，object is not a function。

var marquee = {

            domElement: jQuery( 'span' ),
            titles: [ 'First', 'Second', 'Third', 'Fourth' ],
            current: '',
            next: 0,

            _getCurrent: function(){

                this.current = this.domElement.text();

            },

            _setNext: function(){

                this.next = this.titles.indexOf( this.current ) + 1;

            },

            changeHeading: function(){

                this._getCurrent();
                this._setNext();
                this.domElement.text( this.titles[ this.next ] );

            }

        };

var marqueeInterval = setInterval( marquee.changeHeading, 700 );

任何关于为什么我不能让它工作的帮助将不胜感激。我是面向对象 Javascript 的新手，我只是想理解。谢谢！

【问题讨论】：

标签： javascript jquery oop object javascript-objects

【解决方案1】：

通过将changeHeading 的函数引用传递给setInterval，每次调用都会丢失上下文。您可以通过添加一个额外的功能来防止这种情况，例如

setInterval(function() {
    marquee.changeHeading();
}, 700);

或调用Function.prototype.bindlike

var marqueeInterval = setInterval( marquee.changeHeading.bind( marquee ), 700 );

【讨论】：

太棒了！所以基本上，“this”在传递给 setInterval 时不再指代选框？我理解正确吗？

【解决方案2】：

由于您将 marquee.changeHeading 作为回调传递给 setInterval() 方法，因此在调用该方法时，执行上下文将不是 marquee 对象

您可以使用Function.bind()，如下所示

var marqueeInterval = setInterval( marquee.changeHeading.bind(marquee), 700 );

或自定义回调，它将调用目标方法，如

var marqueeInterval = setInterval( function(){
    marquee.changeHeading();
}, 700 );

【讨论】：

【解决方案3】：

由于您使用的是 jQuery，运行代码的最简单方法是将最后一行替换为下面的行

var marqueeInterval = window.setInterval($.proxy(marquee.changeHeading, marquee), 700);

【讨论】：