Seven ways to call functions in JavaScript and the meaning of this

Http://blog.sina.com.cn/s/blog_621f1e120100rj21.html

This is a very important part of JavaScript development, but many people feel that this is an elusive thing. To really understand the functional mechanisms of JavaScript, it is necessary to figure out what this is all about.

Functions are called in different ways, this meaning is also different. There are seven ways to call functions in the JavaScript language:

First: Call method
var obj = {
Method:function () {alert (this = = obj);}
}
Obj.method ();
The above line Obj.method () is obviously called as a method, in which case the this binding in the function body is the host object of the method, that is, obj.
From this method of invocation we derive the first law:
First Law: Call the function in a method, this binds the host object.

Second: Calling global functions
var method = function () {alert (this = = window);}
Method ();
The above function is a global function. We know that global variables or functions are equivalent to the properties of a Window object. In other words, the above sentence is actually equivalent to the following sentence:
Window.method = function () {alert (this = = window);}
Window.method ();
In this case, the this binding to the Window object is obvious and easy to understand. is equivalent to a special case of the method invocation pattern and does not violate the first law.

Third: Calling intrinsic functions within global functions

var m_ext = function () {
Alert (This = = = window);
var m_inner = function () {
Alert (This = = = window);
}
M_inner ();
}
M_ext ();
Executing the above code, you will be surprised to find that the values of the two Boolean expressions are true. In other words, the child function of the sun function, as long as the function of the call, this will iron the heart bound Window object. From this method of invocation we draw the second law:
The second law: Regardless of the child function sun function, as long as the function is called, this is the heart bound window object.

Fourth: Internal functions are called within a method

var obj = {};
Obj.method = function () {
Alert (This = = = obj);
var m_inner = function () {
Alert (This = = = window);
}
M_inner ();
}
Obj.method ();
Executing this code, the first of this binding to obj you are not surprised, the second this binding to window is not really surprising. It still adheres to the second law, that is, regardless of the child function sun function, as long as it is called in the form of a function, this will iron the heart bound Window object.

Fifth: called as a constructor function

function person (name, age) {
THIS.name = name;
This.age = age;
}
var john = new Person (' John ', 38);
Alert (Json.stringify (John));
You would say, wow, it looks familiar. Generates a new object for a class. JavaScript is a different kind of thing, and functions can really be so tuned.
This time the popup is such a string: {"name": "John", "Age": 38}. Wow, this time I didn't write the return statement in the function definition, but it volunteered to return an object to me. Yes, even if you return something in the function definition, it will not talk to you. (Note: If you return a function there will be a surprise, do not believe you try). From this method of invocation we derive the third law:
Third law: If there is no return value in the function itself, precede it with a new call, create an object connected to the function's prototype property, bind this to the object, then execute the function, and finally return the object. If the function has a return value and the return value is a simple object such as a string/number/Boolean value, the return value is discarded. But if the return value of the function is a complex object, such as an object, a function, or an array, the function returns the return value and discards the object of this binding. As far as I can test, if the return value is a function, the function returns undefined. I don't know why this is so for the time being.

Sixth: Call with the Apply method of the Function object

var my_concat = function (Stra, STRB) {
alert (this);
return stra + "+ strb;
}
var param = [' Hello ', ' world ']
Alert (my_concat.apply (' bullshit ', param));

You must have noticed that here this is bound to the first argument of the Apply method ' bullshit '. From here we derive the law of the four:
The law of the four: when invoking a method with the method's Apply/call method, this is bound to the first parameter of the Apply/call method.
Think who is who, well, Wu Ma also can. The JavaScript handlers are so happy.

Seventh: Call method with Function object
var my_concat = function (Stra, STRB) {
alert (this);
return stra + "+ strb;
}
Alert (My_concat.call (' bullshit ', ' hello ', ' world ');

Yes, you may ask more, what is the second parameter to apply? What is the difference between the call method and apply? Well, really diligent to ask, I would like to say a little bit about apply and call:

The difference between apply and call:

Apply requires that the second argument must be an array. Otherwise it will be reportedtypeerror:second argument to Function.prototype.apply must is an array. and call is not so strict, what type is the second parameter? Random, you can also have a third fifth sixth of the fourth one .... .

I think I'm clear enough. Thanks to "javascript the Good Parts" and "JavaScript Definitive guide", otherwise I can not understand it!

Seven ways to call functions in JavaScript and the meaning of this