功能块中的JavaScript“ this”

Question

this refers to the object it belongs to, for example:

var someObj = {
  logObj : function() { return this }
}

obj.logObj() => someObj

and a function is an object. But then why does this in a function refer to the window, not the function? For example,

function someFunc() { return this }

won't return someFunc() , but window .

Answer 1

It's true, a function is an object. However, the statements inside the function are not called with this set to the function itself. That would keep this from referencing the object that it was called on, and therefore eliminate much of the usefulness of this . There are ways to accomplish what you seek though.

"When a function is called as a method of an object, the object is passed to the function as its this value." ECMAScript Specification 4.3.31

Functions are not called as methods of themselves. Functions not executed as methods of an object are called as methods of the global object (or undefined if in "strict" mode).

 function test() { console.log(this == window); } var obj = {'test': test}; test(); window.test(); obj.test(); 

If you really want for the this in a function to refer to itself, then you will have to add the function as a property of itself, or use a function such as apply , call , or bind which have a thisArg .

 function test() { console.log(this) }; test.test = test; test.test(); test.call(test); test.apply(test); test.bind(test)(); 

Answer 2

Context is most often determined by how a function is invoked. When a function is called as a method of an object, this is set to the object the method is called on:

var obj = {
    foo: function(){
        alert(this === obj);    
    }
};

obj.foo(); // true

The same principle applies when invoking a function with the new operator to create an instance of an object. When invoked in this manner, the value of this within the scope of the function will be set to the newly created instance:

function foo(){
   alert(this);
}

foo() // window
new foo() // foo

When called as an unbound function, this will default to the global context or window object in the browser. However, if the function is executed in strict mode, the context will default to undefined.

Answer 3

There are at least two ways to create an object - with an object literal, or with an object constructor.

Only when you use the latter technique will this refer to the object it occurs within.

This is how to create an object with an object constructor (in your example, a literal was used) :

var objConstructor = function () {
   this.logObj = function () {return this}
}

var obj1 = new objConstructor()