CODEWITHSUNDEEP
javascriptjquery
totalitarian
totalitarian

Reputation: 3676

Trying to call a method within a function

I get test is not defined when calling the stop() method

http://jsfiddle.net/n4mKw/1766/

<span id="rotator"></span>

var rotate = {
    quoteIndex: -1,
    duration: 500,
    delay: 3000,
    play: true,
    quotes: [],
    init: function (quotes) {
        this.quotes = quotes;
        this.showNextQuote();
    },
    showNextQuote: function () {
        this.quoteIndex = (this.quoteIndex + 1) % this.quotes.length;
        if (this.play) {
            $("#rotator").html(this.quotes[this.quoteIndex])
                .fadeIn(this.duration)
                .delay(this.delay)
            .fadeOut(this.duration, this.showNextQuote.bind(this));
        }
    },
    stop: function () {
        this.play = false;
    }



};

var test = rotate.init(["example1", "example2", "example3"]);
test.stop();

Upvotes: 0

Views: 67

Answers (3)

shanks
shanks

Reputation: 922

Every JavaScript function returns something, if you dont specify a return value, it would return undefined by default. What you are doing currently is assigning that undefined value to test and calling stop() which is invalid. If you are trying to chain objects just return this from the init function.

var rotate = {
  quoteIndex: -1,
  duration: 500,
  delay: 3000,
  play: true,
  quotes: [],
  init:function()
  {
     this.quotes = quotes;
     this.showNextQuote();
     return this;
  },
  showNextQuote: function () {
    //showNextQuote stuff.....
  },
  stop:function(){
     this.play = false;
  }

}

Be careful of how you use the "this" keyword though..it would mean something else in a different context.

Upvotes: 1

idream1nC0de
idream1nC0de

Reputation: 1179

Your functions aren't returning the instance of the rotate object as the previous answer specified. However, the way that you can fix this is by returning the instance of the object to the test variable. 

var rotate = {
    quoteIndex: -1,
    duration: 500,
    delay: 3000,
    play: true,
    quotes: [],
    init: function (quotes) {
        this.quotes = quotes;
        this.showNextQuote();
        return this;
    },
    showNextQuote: function () {
        this.quoteIndex = (this.quoteIndex + 1) % this.quotes.length;
        if (this.play) {
            $("#rotator").html(this.quotes[this.quoteIndex])
                .fadeIn(this.duration)
                .delay(this.delay)
            .fadeOut(this.duration, this.showNextQuote.bind(this));
        }
        return this;
    },
    stop: function () {
        this.play = false;
        return this;
    }



};

var test = rotate.init(["example1", "example2", "example3"]);
test.stop();

I have updated the code to return the object in the function. Please test it in the fiddle.

Upvotes: 1

Sterling Archer
Sterling Archer

Reputation: 22435

You may want rotate.stop() instead. test is not an instance of rotate because init does not return the object, or anything for that matter.

Upvotes: 1

Related Questions