Follow me to learn JavaScript function calls and constructor calls _javascript tips

One, function call
function is definitely the most important in JavaScript. In JavaScript, function assumes the functions of procedures, methods, constructors, and even classes and modules.

In object-oriented programming, Functions,methods and class constructor are often three different things that are implemented by different grammars. But in JavaScript, these three concepts are implemented by function, in three different modes.

The simplest usage pattern is function invocation:

function Hello (username) {return 
  "Hello," + username; 
} 
Hello ("Keyser Söze"); "Hello, Keyser Söze" 

Second, the method of the call

The concept of methods, in JavaScript, is that an object's properties are a function: The same is true for functions that are assigned to a member of an object. After assigning a function to a member of an object, this is not called a function, but rather a method.

var obj = { 
  hello:function () {return 
    "Hello," + this.username; 
  }, 
  username: "Hans Gruber" 
};
   obj.hello (); "Hello, Hans Gruber" 

The real behavior is that the call itself determines which object the this is bound to, namely:
Obj1.hello () binds this to Obj1,obj2.hello (), which binds this to obj2. Remember the word, who calls, this is the point to whom

Because of this rule of this binding, it is also possible to use the following:

function Hello () {return 
  "Hello," + this.username; 
} 

var obj1 = { 
  Hello:hello, 
  username: "Gordon Gekko" 
}; 
Obj1.hello (); "Hello, Gordon Gekko" 

var obj2 = { 
  Hello:hello, 
  username: "Biff Tannen"};_ Obj2.hello 
();//" Hello, Biff Tannen " 

However, in a normal function, such as the Hello function above, using the This keyword is not a good way, when it is called directly, this point is a problem. In this case, this is often directed to the global object (Globalobject), which is generally the window object in the browser.
And this behavior is uncertain and meaningless.

So in the ES5 standard, if strict mode is used, this will be set to undefined:

function Hello () { 
  "use strict"; 
  Return "Hello," + this.username; 
} 
Hello (); Error:cannot Read Property "username" of undefined 

This is done in order to expose potential bugs more quickly, avoiding misoperation and bugs that are hard to find.
To distinguish between ordinary function calls and method calls, it is clear to see this example directly.

var func = function () {
  alert (this);
var o = {};
O.fn = func;
Compare
alert (O.fn = = func);//true
//Call
func ();//[object Window]
O.fn ();//[object Object]

The result here is that two functions are the same, so the print result is true. But since two function calls are not the same, Func calls, which print [object Window], and O.FN print results [object].

Here is the difference between a function call and a method call, which refers to the Global object window, and in the method this refers to the current object, that is, the object o in the O.fn.

Iii. calls to constructors

The third mode of use of a function is to speak of it as a constructor:

This in the constructor

We need to analyze the process of creating objects before we know what this means. Like the following code:

 var person = function () {
  this.name = "Xiao Guo";
 };
 var p = new person ();

Here we first define the function person, and the following is an analysis of the entire execution:

• The program does not execute the function body when executing to this sentence, so the JavaScript interpreter does not know the contents of the function.
• Next executes the new keyword, creates the object, the interpreter opens up memory, gets a reference to the object, and gives the new object a reference to the function.
• Immediately after the function is executed, the passed object reference is given to this. That is, in the constructor method, this is the object that was just created by new.
• Then add a member for this, which is to add a member to the object.
• The last function ends, returns this, to the variable on the left.

After parsing the execution of the constructor, you can get that this is the current object in the constructor.

Return in the constructor

The meaning of return is changed in the constructor, first, if you are returning an object in the constructor, then leave the original. If a non object, such as a number, Boolean, or string, is returned, this is returned, and this is returned if there is no return statement. Look at the following code:

 Returns the return
 var ctr = function () {
  this.name = ' Chaohu ' of an object;
  return {
  name: ' Neu Liangliang '
  };
 Create Object
 var p = new Ctr ();
 Access to the name attribute
 alert (p.name);

 Executes the code, and the result printed here is "Neu Liangliang". Because the constructor returns an object, the meaning of return is preserved, and the object returned is the one after return. Then look at the following code:

 //define constructor
 var ctr = function () {
  this.name = "Chaohu"
  that returns non-object data; Return "Neu Liangliang";
 Create Object
 var p = new Ctr ();
 Use
 alert (p);
 alert (p.name);

The result of the code run is that the first window is printed [object], and then the "Chaohu" is printed. Because the return here is a string, which is of the basic type, then this returns statement is invalid and the This object is returned. So the first print is [object] and the second does not print undefined.

function User (name, PasswordHash) { 
  this.name = name; 
  This.passwordhash = PasswordHash; 
} 
var u = new User ("Sfalken", " 
  0ef33ae791068ec64b502d6cb0191387"); 
U.name; "Sfalken" 

Use the new key to invoke the function as a constructor. Unlike function and method invocations, constructor passes in a new object and binds it to this, and returns the object as the return value of the constructor. The function of the constructor function itself is to initialize the object.

A common error in constructor calls

The following constructor is defined with gusto:

var coder = function (Nick) { 
this.nick = nick; 
}; 

What happens after the constructor is defined? Yes, hastened to instantiate:

What's the name of this coder brother? Quickly print down:

Console.log (Coder.nick); Undefined 
= =b unexpectedly is undefined!! Looking back at the instantiation of the statement, it is not difficult to find out where the problem is: less a new 
var coder = coder (' Casper ');//call as a normal function, so the internal this pointer actually points to the window object 
Console.log (Window.nick); Output: Casper 
var coder = new Coder (' Casper ');//Add new, everything is different, this correctly points to the currently created instance 

Such a mistake seems very low-level, but the probability of a very high, swollen to avoid or reduce the occurrence of this situation?
You can move your hands and feet inside the inner implementation:

var coder = function (Nick) { 
  if (!) ( This is instanceof coder)) {return 
    new coder (Nick); 
  } 
    This.nick = Nick; 
 

In fact very simple, when instantiated, internal judgments, the current this point to the type of object, if not the type of the current constructor, force the callback constructor again.
Suddenly feel coder this name is not brim? Want to use hacker, OK, I change ... Count, a total of three to change, this is not scientific, there is no way to only change the name of the constructor on the line?
Of course:

var coder = function (Nick) { 
  if (!) ( This is instanceof Arguments.callee)) {return 
    new Arguments.callee (Nick); 
  } 
  This.nick = Nick; 
 

Tips: It is said that under the strict mode of ES 5 Arguments.callee will be disabled, but only when the ES 5 is universal and you specify to use strict mode, otherwise you can still use the divergent thinking.

The above is the entire contents of this article, I hope to learn about function calls, method calls and constructor calls to help.