this keyword vs obj name in javascript

Question

Wondering what the difference between the two code below. In the first case I used this to refer to the object and in the second case I used the object name. Although both works I was wondering whether there is any real difference between the two.

(function() {
var app = {
    init: function () {
        app.addLun('Hello');
    },
    addLun: function(a) {
        console.log(a);
    }
};
});
})();

and

var app = {
    init: function () {
        this.addLun('Hello');
    },
    addLun: function(a) {
        console.log(a);
    }
};
});
})();

I am not sure what that last line is in both of your examples. — Naftali aka Neal, Jul 29 '13 at 13:36
`this` is the context that's invoking the current function. `app` is the specific object you've created. — Benjamin Gruenbaum, Jul 29 '13 at 13:36
They are both equivalent in the sense that they should throw a syntax error. — Evert, Jul 29 '13 at 13:38
@Evert LOL I see you found the same issue as [I did](http://stackoverflow.com/questions/17925514/this-keyword-vs-obj-name-in-javascript/17925568#comment26189378_17925514) :-P — Naftali aka Neal, Jul 29 '13 at 13:41

score 1 · Answer 1 · answered Jul 29 '13 at 13:37

1

this refers to the context/scope of the function, so depending on how you call it, it could refer to app, window, or many other scopes...

app refers to the actual app object if it exists in that scope.

answered Jul 29 '13 at 13:37

Naftali aka Neal

138,754
36
231
295

score 0 · Accepted Answer · answered Jul 29 '13 at 13:45

Using this and app are absolutely not the same. Take this (slightly contrived) example:

var app = {
    init: { 
        foo: function () {
            // Think 'this' is app? 
            this.addLun('Hello');
        }
    },
    addLun: function(a) {
        console.log(a);
    }
};

var app2 = {
    init: { 
        foo: function () {
            app2.addLun('Hello');
        }
    },
    addLun: function(a) {
        console.log(a);
    }
};

app2.init.foo(); // prints Hello
app.init.foo();  // error - no method called addLun

this is the current context, app is the object you have just created.

score -1 · Answer 3 · answered Jul 29 '13 at 13:39

-1

Yes, there is difference. If you want to have more, that one instance of app object (for example, you can clone it with jQuery.extend()), you need to use second variant for correct work.

answered Jul 29 '13 at 13:39

Maxim Pechenin

324
1
13

No.... no I will not clone it with jQuery... – Naftali aka Neal Jul 29 '13 at 13:41

this keyword vs obj name in javascript

3 Answers3