0

I have a JavaScript object those properties are static, mostly. They can be determined at construction time. However, I've also added a method "morph" that changes the object's state. So these properties should change along with it.

I've coded it successfully below, as a method (longNameMethod, no problems) and as a property (longNameProperty, problematic). The problem with longNameProperty is that there is code in the constructor and in the morph method that looks very similar. Is there a way to eliminate this duplication?

var Fruit = function (name) {
    this.name = name;

    this.longNameMethod = function () {
        return this.name + this.name;
    }

    this.longNameProperty = this.name + this.name;

    this.morph = function(name) {
        this.name = name;

        // starting to feel redundant
        this.longNameProperty = this.name + this.name;
    }

    // update(); // hypothetical solution
};

var item = new Fruit('apple');

console.log(item.longNameMethod()); // apple apple
console.log(item.longNameProperty); // apple apple

item.morph('orange');

console.log(item.longNameMethod()); // orange orange
console.log(item.longNameProperty); // orange orange

I tried including an "update" method that would handle updating all of these properties but for some reason I can't use it during construction. It says that this.name is undefined. What's up with the order of operations during construction?

Edit: So yes, the method approach and the property approach are functionally identical to the outside, but the goal is to use the property approach.

Edit^2: So I think there are multiple issues at play... One of which is explained here: How does "this" keyword work within a function?

Community
  • 1
  • 1
Mark Canlas
  • 9,385
  • 5
  • 41
  • 63

1 Answers1

1

You need to add the method before using it, when you assign it into this: 

var Fruit = function (name) {
    this.morph = function(name) {
        this.name = name;

        this.longNameProperty = this.name + this.name;
    }

    this.morph(name);
};

var item = new Fruit('apple');

console.log(item.longNameProperty); // apple apple

item.morph('orange');

console.log(item.longNameProperty); // orange orange
mplungjan
  • 169,008
  • 28
  • 173
  • 236
Mathias Schwarz
  • 7,099
  • 23
  • 28
  • Yeah, I was thinking of that - singleton-like – mplungjan Jul 05 '11 at 06:20
  • Your solution doesn't map directly to the code I have in front of me, although implemented as you suggested, it works. If the state updating portion and the morph method were two different methods, why do you have to pass an argument into the state updating method? – Mark Canlas Jul 05 '11 at 06:25
  • I might have to reformulate the question... There are multiple things going on that I don't really understand =( – Mark Canlas Jul 05 '11 at 06:35
  • Turns out my implementation discrepancies are addressed here: http://stackoverflow.com/questions/133973/how-does-this-keyword-work-within-a-javascript-object-literal – Mark Canlas Jul 05 '11 at 06:45