Question

我试图创建一个简单的选框，只是间隔更改。我只是想在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的新手，我只是想了解。谢谢！

Answer 1

通过将changeHeading的函数引用传递给setInterval，您将失去每次调用的上下文。您可以通过添加其他功能（例如

）来阻止这种情况

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

或像

一样调用Function.prototype.bind

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

Answer 2

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

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

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

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

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

Answer 3

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

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

面向对象的Javascript错误对象不是一个函数

3 个答案: