Home  >  Article  >  Web Front-end  >  A brief discussion on javascript function attributes and methods_javascript skills

A brief discussion on javascript function attributes and methods_javascript skills

WBOY
WBOYOriginal
2016-05-16 16:18:46828browse

Each function contains two properties: length and prototype
​​​​Length: The number of named parameters that the current function hopes to accept
​​​​Prototype: It is the real place to save all their strength methods

Copy code The code is as follows:

function sayName(name) {
alert(name);
}
function sum(num1, num2) {
                 return num1 num2;
}
function sayHi() {
              alert("hi");
}
alert(sayName.length);//1 The number of parameters is one
​​​​ alert(sum.length);//2 Number of parameters: 2
alert(sayHi.length);//0 No parameters

Each function contains two non-inherited methods: apply() and call()
​​​​ These two methods call functions in a specific scope, which is actually equivalent to setting the value of this object in the function body
​​​​ First, apply() accepts two parameters: one is the scope in which the function runs, and the other is the parameter array (which can be an array instance or an arguments object)

Copy code The code is as follows:

function sum(num1, num2) {
                 return num1 num2;
}
function callSum1(num1, num2) {
                 return sum.apply(this, arguments);//Pass in the arguments object
}
          function callSum2(num1, num2) {
              return sum.apply(this, [num1, num2]);
}
alert(callSum1(10, 10));//20
alert(callSum2(10, 20));//30

Secondly, the first parameter of the call method has not changed. What has changed is that the remaining parameters are all passed parameters. The parameters passed to the function need to be listed one by one

Copy code The code is as follows:

function sum(num1, num2) {
                 return num1 num2;
}
         function callSum(num1, num2) {
               return sum.call(this, num1, num2);
}
alert(callSum(10, 200));

As to which method is more convenient to use, it all depends on your wishes. If there are no parameters, it will be the same regardless of which one is used.
                      However, the apply and call methods are definitely not just for how to get the hull parameters.
Their real use of martial arts is to expand the function of the function.

Copy code The code is as follows:

          window.color = "red";
      var o = {color: "blue"};
function sayColor() {
alert(this.color);
}
         sayColor();//red
          sayColor.call(this);//red
          sayColor.call(window);//red
          sayColor.call(o);//blue

The biggest advantage of using apply and call to expand the scope is that it does not require any coupling relationship with the method.

ECMAScript5 also defines a method: bind(). This method will create an instance of the function whose this value will be bound to the value passed to the bind function

Copy code The code is as follows:

window.color = "red";
      var o = {color: "blue"};
function sayColor() {
alert(this.color);
}
        var bindFun = sayColor.bind(o);
        bindFun();//blue

The above is the entire content of this article, I hope you guys will like it.

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn