How exactly work the this keyword declared into a function defined inside an object?

Question

I am pretty new in OO paradigm in JavaScript language (I came from Java) and I have the following doubt related to the correct meaning of this param in this specific case.

I have the following code:

var obj = {

    fn:function(a,b) {
        log(this-);
    }

}

Ok, from what I have understand (correct me if I am doing wrong assertion) the previous code define an ob object that contain a fnction named fn.

First doubt: doing in this way am I creating an instance of this object (creating in memory) or am I only declaring it (as a Java class)?

I think that I am creating in memory a specific instance of this object but I am not sure of this...

Ok, then doing:

obj.fn(3,4);

here the this value is the identification of the specific obj object (the instance) on which I am calling the fn() function.

Is it my reasoning correct or am I missing something?

And what happens if I don't declare the fn() function into an object definition? What happens if I put it dirctly into a .js file? Is this keyword refred to the global object?

If `fn` is not declared in an object, I believe `this` is related to the function that owns the code, so `fn` is this. If it was not in a function, `this` would refer to the `window` global, if it's there. — Sterling Archer, Sep 06 '16 at 13:48
It does not matter where you declare the function with the `this` keyword, it matters that you call it on `obj` in `obj.fn(…)`. — Bergi, Sep 06 '16 at 14:06
Possible duplicate of [How does the "this" keyword work?](http://stackoverflow.com/questions/3127429/how-does-the-this-keyword-work) — ssube, Sep 06 '16 at 14:26

endling · Answer 1 · 2016-09-06T15:51:34.053

2

First doubt : Yes, you are creating an object in memory

There are at least 3 rules that I know of for determining the value of the this keyword and all of them are determined based on the callsite where a function is invoked.

1) Default binding : By default, this binds to the global object.

var a = 10; // declared in global scope

function foo(){
 console.log(this.a); // 10
}

foo(); // callsite

2) Implicit binding : this binds to the object whose method is invoked

var a = 10; // global

var obj = {
  a : 20,
  foo : function(){
         console.log(this.a); // 20
        }
  }

obj.foo(); // callsite

3) Explicit binding : this binds to whatever object you specify. There are 2 ways to do this, call() and apply()

var a = 10;

var obj = {
   a : 20
};

function foo(){
   console.log(this.a); // 20
};

foo.call(obj); // bind to obj

edited Sep 06 '16 at 15:51

answered Sep 06 '16 at 14:15

endling

74
1
7

there is one more rule - using the new keyword before a function call. – naortor Sep 06 '16 at 14:17
2

There are much [more than 3 rules](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this), you are for example forgetting `new`. Also, `foo()` does *not* bind `this` to the global object, it does bind it to `undefined` - only sloppy mode functions default that to the global object. – Bergi Sep 06 '16 at 14:18
When working with Javascript functions this refers the current object, which depends on the context of the function. http://www.coding-dude.com/wp/web-design/javascript/javascript-functions-this-that-the-other/ – coding-dude.com Sep 06 '16 at 14:52
`at least` spelling – MaxZoom Sep 06 '16 at 15:27

How exactly work the this keyword declared into a function defined inside an object?

1 Answers1