JavaScript has a total of 4 invocation patterns: The function invocation pattern, the method invocation pattern, the constructor invocation pattern, and the indirect invocation pattern. "1" function call Mode when a function is not a property of an object, it is called as a function. For a normal function call, the return value of the function is the value of the call expression, function add (x, y) {return x+y;} var = add (3,4); Console.log (sum)//7 when calling a function using a function call pattern, this is bound to a global object in non-strict mode, and in strict mode this is undefinedfunction add (x, y) {Console.log ( this);//window} add (); function Add (x, y) {' Use strict '; Console.log (this);//undefined} add ();//window var Strict = (function () {return!this;} ()); overrides the phenomenon that global properties are overridden because of the function call pattern in the function of this binding to global objects var a = 0; function fn () {THIS.A = 1;} fn (); Console.log (this,this.a,a);//window 1 1 When a function is saved as a property of an object, we call it a method. When a method is called, this is bound to the object. If the invocation expression contains an action that extracts a property, then it is treated as a method to call var o = {m:function () {console.log (1);}}; O.M (); The//1 method can use this to access the object to which it belongs, so it can take a value from the object or modify the object. This binding to the object occurs at the time of the call. The method through this to obtain the context of the object to which they belong is called a public method. var o = {a:1, m:function () {return this;}, N:function () {THIS.A = 2;}}; Console.log (O.M (). a);//1 O.N (); Console.log (O.M (). A);//2 any function will actually pass in an implicit argument as a method call-the argument is an object, the parent of the method callThis is the object, generally speaking, the method based on that object can perform a variety of operations, the syntax of the method call is already clear that the function will operate on an object Rect.setsize (Width,height); Setrectsize (Rect,width,height); assumes that the above two lines of code are functionally identical, and that they all work on a hypothetical object, rect. As you can see, the method invocation syntax of the first line makes it very clear that the vector that this function executes is a Rect object, and that all operations in the function will be based on the object and variable, the keyword this has no scope limit, and the nested function does not inherit this from the function that called it. If a nested function is called as a method, its this value points to the object that called it. If the nested function is called as a function, its this value is not a global object (non-strict mode) is undefined (strict mode) var o = {m:function () {function n () {return this;} return n ();}} C Onsole.log (O.M ());//windowm:function () {function n () {' Use strict '; return this;} return n ();}} Console.log (O.M ());//undefined if you want to access this value of this external function, you need to keep the value of this in a variable, which is in the same scope as the inner function. Usually the variable self or that is used to save Thisvar o = {m:function () {var = this, console.log (this = = = O),//true function n () {Console.log (t his = = = O);//false console.log (self = = = O);//true return self; } return n (); }} console.log (O.M () = = = O);//true "3" constructor call pattern if the function or method call is preceded by the keyword new, it constitutes the constructor called function fn () {THIS.A = 1;}; var obj = new fn (); Console.log (OBJ.A);//1 If the constructor call contains a set of argument lists in parentheses, the argument expressions are evaluated first and then passed inFunctions within function fn (x) {this.a = x;}; var obj = new fn (2); Console.log (OBJ.A);//2 if the constructor does not have formal parameters, the syntax of the JavaScript constructor call is to allow omitting the argument list and the parentheses. Any constructor call without formal parameters can omit the parentheses var o = new Object (); Equivalent to var o = new object; [note] Although the constructor looks like a method call, it will still use the new object as the calling context. In other words, in the expression new O.M (), the calling context is not ovar o = {m:function () {return this;}} var obj = new o.m (); Console.log (obj,obj = = = O);//{} false Console.log (Obj.constructor = = O.M);//true constructors typically do not use the return keyword, which typically initializes new objects , it is explicitly returned when the function body of the constructor finishes executing. In this case, the constructor call expression evaluates to the value of the new object, the function fn () {THIS.A = 2;} var test = new FN (); Console.log (test);//{a:2} if the constructor uses a return statement but does not specify a return value, or returns a raw value, the return value is ignored and the new object is used as the result of the Call function fn () { THIS.A = 2; Return } var test = new FN (); Console.log (test);//{a:2} if the constructor explicitly returns an object using the return statement, the value of the invocation expression is the object var obj = {a:1}; function fn () {THIS.A = 2; return obj;} var test = new FN (); Console.log (Test);//{a:1} "4" indirect call pattern JavaScript functions are also objects, and function objects can also contain methods. Both the call () and the Apply () methods can be used to invoke functions indirectly, both of which allow you to explicitly specify the this value that is required for the call, which means that any function can beCalled for the method of any object, even if the function is not a method of that object. Two methods can specify the arguments that are called. The call () method uses its own argument list as the argument for the function, and the Apply () method requires that the parameter var obj = {} be passed in as an array; function sum (x, y) {return x+y;} console.log (Sum.call (obj,1,2));//3 Console.log (Sum.apply (obj,[1,2]));//3
4 Kinds of function call modes in JS
