CODEWITHSUNDEEP
javascriptnode.js
Sathish
Sathish

Reputation: 2180

JavaScript OOP. Trying to study OOP in JavaScript

Below is a simple JavaScript OOP that I am trying to understand. I want to know why getA() and getC() return undefined, but the same getB() returns 2 when I change the variable B in the constructor and assign it to the b.

When I run getD() it returns, what I am assigning? How is this working here?

var a,b,c,d;

var encap = function(a,B,c,d){
    a = a;
    b = B;
    this.c = c;
    this.d = d;
}

encap.prototype.getA = function() {
    return a; // returns undefined
};

encap.prototype.getB = function() {
    return b; // returns 2
};

encap.prototype.getC = function() {
    return c; // undefined
};

encap.prototype.getD = function() {
    return this.d;
};


encap.prototype.setA = function(A) {
    a = A;
};

encap.prototype.setB = function(B) {
    b = B;
};


var encapObj = new encap(1,2,4,6);

console.log(encapObj.getA());  // undefined
console.log(encapObj.getB());  // 2
console.log(encapObj.getC());  // undefined
console.log(encapObj.getD());  // 6

Upvotes: 1

Views: 154

Answers (4)

igorzg
igorzg

Reputation: 1506

One thing you should know: Javascript is fully object oriented language there is no OOP "way" in javascript. Everything execpt primitive types ( undefined, number, string, boolean, null ) is an object.

Upvotes: 0

Jeremy J Starcher
Jeremy J Starcher

Reputation: 23863

Here you go, I commented every assignment of what variable is being assigned where.

This should help explain things.

// Create four global variables.
var a,b,c,d;

var encap = function(a,B,c,d){
    // Assign local argument a, to local argument a.  Does nothing
    a = a;

    // Assign local argument "B" to global variable "b"
    b = B;

    // assign local argument 'c' to property 'c'
    this.c = c;

    // assign local argument 'd' to property 'd'
    this.d = d;
}

encap.prototype.getA = function() {
    // Returns global variable a
    return a; // returns undefined
};

encap.prototype.getB = function() {
    // Return global variable B, which was assigned in the constructor
    return b; // returns 2
};

encap.prototype.getC = function() {
    // Return global variable 'c'
    return c; // undefined
};

encap.prototype.getD = function() {
    // return object property 'd', which was assigned.
    return this.d;
};


encap.prototype.setA = function(A) {
    // assign global variable 'a' from argument 'A'
    a = A;
};

encap.prototype.setB = function(B) {
    // assign global variable 'b' from argument 'B'
    b = B;
};


var encapObj = new encap(1,2,4,6);

Upvotes: 2

Ryan Kinal
Ryan Kinal

Reputation: 17732

Okay, so here's the deal. You have four global variables:

var a, b, c, d;

You also have four variables that are local to the constructor

var encap = function(a,B,c,d);

Then you also have two "instance" variables - variables that are attached to the new object when it's created.

this.c = c;
this.d = d;

In the constructor, you set a = a - this is really just setting the local variable (parameter) a to itself. You're accessing the local variable from the constructor on both sides of the =. In your accessor getA, you return the global variable a - which is undefined.

Also in the constructor you set the value of global variable b equal to the value of local variable B - remember that they're different because JavaScript is case-sensitive. So, your global variable b now has a value of 2. Since, again, you return the global variable in your accessor getB, you get the value 2.

In your accessor getC, you still return the global variable c - which was never set. Hence undefined. However, this time you set this.c in the constructor, so if you were to return this.c in your accessor, you should get the correct value.

In summary, you should probably be using this on all your variable assignments and returns. so, your constructor should look like the following:

var encap = function(a,B,c,d){
    this.a = a;
    this.b = B;
    this.c = c;
    this.d = d;
}

And your accessors should look like this:

encap.prototype.getD = function() {
    return this.d;
};

From there, I think it's pretty obvious what your setters should look like. Good luck in your exploration of OOP in JavaScript. It's my favorite language, and I love its OOP, despite what anybody says about it. If you have trouble, the StackOverflow JS chat room is often helpful, so come on in some time.

Upvotes: 3

Ry-
Ry-

Reputation: 224913

a = a;

This assigns to the local variable a from the local variable a, effectively (ineffectively?) doing nothing. The global variable is still set to its default of undefined, and that’s why you get undefined from getA().

In getC(), you return the value of the global variable c, but only assigned to the property c of the instance: this.c. this isn’t implicit in JavaScript.

Upvotes: 5

Related Questions