How to Access to another Prototype Object's variable

Question

A class that has an array and getter/setter.

var MyObject = (function MyObject() {
    this.arr = [];

    MyObject.prototype.addArr =  function(i) {
        this.arr.push(i);
    };
    MyObject.prototype.getArr =  function() {
        return this.arr;
    };
});

And another object try to access to array of MyObject.

var AnotherObject = (function AnotherObject() {
    AnotherObject.prototype.addToMyObject =  function(i, MyObject) {
        MyObject.addArr(i); // here's the problem!
    };
    AnotherObject.prototype.getArr =  function(MyObject) {
        return MyObject.getArr();
    };
});

Now test.

var a = new MyObject();    
a.addArr(1);
a.addArr(2);
a.addArr(3);

// works good.
console.log(a.getArr().pop()); // 3
console.log(a.getArr()); // [1,2]

var b = new AnotherObject();
b.addToMyObject(4);
b.addToMyObject(5);
b.addToMyObject(6);

console.log(b.getArr().shift()); // error!
console.log(b.getArr());

It says AnotherObject.addToMyObject() is wrong. 'addArr' is not defined or null inside of addToMyObject().

Correct me how to access another Object's variable

http://jsfiddle.net/amhk9o2a/2/

@PHPglue Please give me more explanations. I'm just testing and this is copied from prototype sample codes. And if you mean this is homework or something it's not. just my curiousity — Deckard
– Deckard, Commented Oct 29, 2015 at 2:26
You've not passed a MyObject instance into addToMyObject when invoking it, it's expecting this as the second argument — Paul S.
– Paul S., Commented Oct 29, 2015 at 2:27
why do you instantiate the new object b but not pass 'a' into the addToMyObject and getArr methods? — codemax
– codemax, Commented Oct 29, 2015 at 2:27
I also just notice that you're setting prototype values inside it's own constructor. You shouldn't be doing this. I think you've confused using an IIFE to keep a namespace clean with how to define a constructor — Paul S.
– Paul S., Commented Oct 29, 2015 at 2:29

Barmar · Accepted Answer · 2015-10-29 02:36:39Z

2

The methods of AnotherObject expect a MyObject to be passed as an argument. So it should be:

b.addToMyObject(4, a);
b.addToMyObject(5, a);
b.addToMyObject(6, a);
console.log(b.getArr(a).shift());
console.log(b.getArr(a));

Since you weren't passing this argument, the MyObject parameter variable was being set to undefined, so you were calling undefined.addArr(i) and undefined.getArr().

answered Oct 29, 2015 at 2:36

Barmar

789k57 gold badges554 silver badges669 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Paul S. · Accepted Answer · 2015-10-29 02:51:45Z

I've made several changes through the code. To make it easier to follow I've labelled sections A, B and C.

A, fixed the constructor definition for MyObject so the prototype is not destroyed and re-created every time we create an instance of it
B, fixed the constructor definition for AnotherObject so the prototype is not destroyed and re-created every time we create an instance of it
B, taught it a new method where we pick a target object to work on
C, constructed instances, with the AnotherObject instance I used the new method to target the MyObject instance

// --- A ---
function MyObject() {
    this.arr = [];
}
MyObject.prototype.addArr = function (i) {
    this.arr.push(i);
};
MyObject.prototype.getArr = function () {
    return this.arr;
};

// --- B ---
function AnotherObject() {
}
AnotherObject.prototype.setTarget = function (myObject) { // extra bit
    this.target = myObject;
};
AnotherObject.prototype.addToMyObject = function (i) {
    this.target.addArr(i); // this now points to a new place
};
AnotherObject.prototype.getArr = function(MyObject) {
    return this.target.getArr(); // this now points to a new place
};

// --- C ---
var a = new MyObject(),
    b = new AnotherObject();
b.setTarget(a); // Enemy sighted, assigning it as the target!!!!
b.addToMyObject('foo');
b.getArr(); // ["foo"]
// notice this also means
a.getArr(); // ["foo"]

The previous style of writing the constructor you were attempted looked as if it was intended to be the following, using an IIFE

var MyObject = (function () {
    function MyObject() {
        this.arr = [];
    }
    MyObject.prototype.addArr = function (i) {
        this.arr.push(i);
    };
    MyObject.prototype.getArr = function () {
        return this.arr;
    };
    return MyObject;
}());

This is a perfectly valid way to do it to keep the namespace clean, but it more complicated to read. If you're new to constructors or IIFEs, I'd suggest learning them independently from each other first.

StackSlave · Accepted Answer · 2015-10-29 02:41:00Z

1

Here is a better example of a Constructor:

function MyObject(){
  this.arr = [];
  this.addArr = function(i){
    this.arr.push(i);
  }
  this.getArr = function(){
    return this.arr;
  }
}
function AnotherObject(){
}
AnotherObject.prototype = MyObject.prototype;
// now AnotherObject has MyObject prototype

answered Oct 29, 2015 at 2:41

StackSlave

10.6k2 gold badges20 silver badges35 bronze badges

2 Comments

Barmar Over a year ago

How does AnotherObject.addToMyObject make use of this prototype?

Paul S. Over a year ago

Please note that (new AnotherObject) instanceof MyObject; // true is probably unexpected behaviour in this case

Collectives™ on Stack Overflow

How to Access to another Prototype Object's variable

3 Answers 3

Comments

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related