Function prototype of js

Source: Internet
Author: User

In ECMAScript, the Function type is actually an object. Each Function is a Function-type instance and has attributes and methods like other reference types. Because the function is an object, the function name is actually a pointer to the function object. 1. Three function declaration methods 1. First: declare function 1 function box (num1, num2) {2 return num1 + num2; 3} 2. Second: variable Initialization Method: 1 var box = function (num1, num2) {2 return num1 + num2; 3}; 3, third: function constructor method 1 var box = new Function ("num1", 'num2', 'Return num1 + num2'); conclusion: the third method is not recommended: because the code needs to be parsed twice: The first time: the regular ECMAScript code is parsed, and the second time is the string passed into the constructor; this affects the performance. But we can understand from this syntax that "function is an object and function name is a pointer". 2. The function in ECMAScript as a value is a variable, therefore, functions can also be used as values. That is to say, not only can one function be passed into another function like a parameter, but also can be returned as a result of another function. Similar to the delegate in c #, the method is passed to another method like a parameter. Copy code 1 function box (sum, num) {// pass the function as a parameter to another function 2 return sum (num ); // return 3} 4 5 function sum (num) {6 return num + 10; 7} 8 alert (box (sum, 10 )); // 20 copy code 3. The attributes inside the function are inside the function, and there are two special objects: arguments and this. Arguments is a class array object that contains all the parameters in the input function. It is mainly used to save function parameters. However, this object also has a property named callee, which is a pointer, point to the function that owns the arguments object. Use of the arguments attribute: Copy code 1 function box () {2 alert (arguments. length); 3 for (var I = 0; I <arguments. length; I ++) {4 alert (arguments [I]); // obtain each input parameter 5} 6} 7 8 box (1, 2, 3, 4 ); copy the callee attribute of the Code (the attribute of arguments) and copy code 1 // use arguments. callee replaces itself 2 function sum (num) {3 if (num <= 1) {4 return 1; 5} 6 else {7 return num * arguments. callee (num-1); 8} 9} 10 alert (sum (4); // 24 copy the code this object: roughly similar to this in c. This object references the object in which the function is executed, or the scope of the function call statement. PS: When a function is called in the global scope, this object references window. Copy code 1 var color = 'red'; 2 alert (window. color); // red, as long as the object in the global scope is 3 alert (this. color) // red this is in the global scope, and this references the window object 4 alert (color); // red can be omitted to output 5 6 windows directly. color = 'Blue '; // equivalent to: var color = 'Blue'; 7 alert (this. color); // Blue 8 alert (color); // a classic example of copying the code this object: copy the Code 1 var box = {2 color: 'red ', 3 SayColor: function () {4 alert (this. color); // reference of the objects in the scope to which this object points (that is, the box reference) 5} 6}; 7 box. sayCol Or (); 8 9 window. color = 'red'; 10 function SayColor () {11 alert (this. color); // because this method is located under the window, this reference in the method points to window12} 13 14 SayColor (); // red 15 16 var box = {17 color: 'Blue '18}; 19 box. sayColor = window. sayColor; // After the value is assigned, the this object in SayColor points to the current scope, that is, the box object 20 box. sayColor (); // copy code in blue. 4. Anonymous attributes and functional objects in the method ECMAScript. Therefore, functions also have attributes and methods. Each function has two attributes: length and prototype. Length indicates the number of name parameters that the function wants to receive. The PS: prototype attribute is used to store all instance methods, that is, the prototype. This attribute. We will provide a detailed introduction in the object-oriented chapter. Prototype has two methods: apply () and call (). Each function contains these two non-inherited methods. The purpose of both methods is to call a function in a specific scope. In fact, it is equal to setting the value of this object in the function body. The length attribute is: 1 function sum (num1, num2) {2 return num1 + num2; 3} 4 alert (sum. length); apply () method: copy the Code 1 function sum (num1, num2) {2 return num1 + num2; 3} 4 5 function num (num1, num2) {6 // The first parameter: The scope of the method to be executed (that is, the scope of the method to be executed). The second parameter is the 7 return sum parameter passed to the sum function. apply (this, [num1, num2]); // parameter array [num1, num2] can replace 8} 9 10 alert (num () with arguments )); copy the Code call () method: the effect of the call () method execution and The apply method is the same. The difference is that the parameters passed between them are different. 1 function box (num1, num2) {2 return sum. call (this, num1, num2); // starting from the second parameter, you want to pass Parameters in the function, instead of passing a parameter array. 3 // you can actually directly call the function, the above practice only demonstrates the usage of apply and call 4} 5 6 alert (box (1, 2); call () and apply () the actual use of methods is not the above (because the above implementation does not make sense), but the scope of the method is changed. The caller impersonating the method calls the method to solve the "coupling" between objects ", reduced Coupling Degree replication code 1 var color = 'red'; 2 3 function SayColor () {4 alert (this. color); 5} 6 SayColor (); // Red 7 8 var box = {9 color: 'blue' 10}; 11 12 SayColor. call (box); // blue (changed the scope of the method, but the box is not used. sayColor = SayColor; (coupling is too high), reducing coupling) when running the call (box) method, the running environment of SayColor () has become a box object. 13 SayColor. call (this); // Red 14 SayColor. call (window); // red 15 16 boxes. say (); the biggest benefit of copying the call () and apply () Methods of the Code: expanding the scope, and there is no coupling between the object and the method.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.