JS function knowledge

Source: Internet
Author: User

1. Basic knowledge of functions

Through the function can encapsulate any of the statements, call anywhere, JS in the function keyword to declare,

        //basic format, function name, pass parameter, code block        functionfunctionname (arg0,arg1,arg2,......, ArgN) {statements}//Example        functionSayhi (name,message) {Console.log ("Hello" +name+ "," +message)} Sayhi ("Double", "How is You")//normal function name call function        functionsum (NUMB1,NUMB2) {returnnumb1+NUMB2; Console.log ("Find me?")//because there was a return before, so no more execution.        }        var(Result=sum);//declaring a variable to invoke a function        functionSumm (NUMB1,NUMB2) {return;//Return can be returned without any return value, undefinedConsole.log ("Hello")        }        functiondiff (NUMB1,NUMB2) {//a simple comparison function             if(numb1<NUMB2) {                  returnnumb2-NUMB1; }             Else{                  returnNumb1-NUMB2; }        }

1.1 Understanding Parameters

The parameters in JS are represented internally using an array, so no matter the data type of the parameter, the number does not matter, and the parameter is not necessarily used.

The body of the function can access an array of parameters through a arguments object , thus obtaining each parameter. Arguments objects and arrays are similar, can be expressed in brackets, with length;

Parameter names are not required and can be accessed via arguments[0] for convenience.

functionChange () {Console.log (arguments.length)}varZero=change ()//0 can be displayed by length        varOne=change ("one")//1        varTwo=change ("Both", 2)//2                //no parameter name        functionDoadd () {if(arguments.length==1) {Console.log (arguments[0]+10); }Else if(arguments.length==2) {Console.log (arguments[0]+arguments[1])}} doadd (1)// OneDoadd (ON)//3        //with the name of the parameter        functionAnotheradd (num1,num2) {if(arguments.length==1) {Console.log (Num1+10); }Else if(arguments.length==2) {Console.log (Num1+num2)} } anotheradd (1)// OneAnotheradd (ON)//3        functionAgain (num1,num2) {arguments[1]=10; //here the value of num2 becomes 10,arguments and the value of the corresponding named parameter is kept in sync, the memory space is still independent; it is not passed the name parameter is undefinedConsole.log (arguments[0]+num2)}

1.2 No Overloads

The so-called no overload means that the function two is not defined, because the parameters of JS is an array, no signature, do not get the real overload. Two the same function will be the next one, whichever is the other.

function type

are also reference types, each of which is an instance of a function type with the same properties and methods as other reference types. function is an object, so the function name is just a pointer to the function object .

There are two ways of declaring a variable. Let's see an example.

      functionSUM (num1,num2) {//function declarations to define functions            returnnum1+num2}varsum=function(NUM1,NUM2) {//function expression definition function            returnnum1+num2}//The function name is just a pointer, so you can understand that the function described above is not overloaded      functionOne (num1,num2) {returnnum1+num2}vartwo= OnevarOne=NULLConsole.log ())//3 Even if one is null

The love between function declaration and function expression is killed

The parser has a different attitude to both of them.

For a function declaration, the parser takes precedence over it and has a function to declare the promotion procedure (function declaration hoisting)

For a function expression, the parser will not take precedence and only read to it to be interpreted.

      Console.log (sum)        //3      function  sum (num1,num2)                 {return num1+num2      }      Console.log (another)    //Another is not a function       var another=function(num1,num2) {            return num1+  Num2      }

Of course, there is a constructor method, not recommended, resulting in two of code parsing, one is regular JS, one is the constructor

That is, the function can be used as a value parameter

      function sum (somefunction,value) {        // nested             return in basic function SomeFunction (value)     }     function Multiplys (num) {                 // internal functions            return num*num     }     console.log (sum (Multiplys,2))            // call function, A pointer to an intrinsic function that does not need () to be called

Use as a merit function to sort by an array of attributes

     functionCompare (value) {//to compare the properties of obj, the value here is simply an argument, not instantiated, and is instantiated in a simple array .           return function(obj1,obj2) {varvalue1=Obj1[value]varValue2=Obj2[value]returnValue1-value2}} varData=[{name: "Double", Age:24},{name: "Zom", Age:23},{name: "Mike", age:32}] Data.sort (compare ("Age") ) Console.log (data)//23,,24,32 to sort
2. Properties inside the function

Within a function, there are typically two objects

This object : This refers to the environment object that the function executes, which is the this value (in the global Environment, this represents window)

arguments Object : Class array object, saving function arguments; There is a callee property, this property is a pointer to a function that has a arguments object

ES5 Specifies the property caller of another function object, holds the function reference that invokes the current function , or null if the current function is called in the global scope

     //Recursive Functions     functionsum (num) {if(num<=1){              return1          }          Else{              returnNum*arguments.callee (num-1)//eliminate tight coupling and ensure that recursive functions are completed, so use the callee property          }     }     varsumm=sum; Sum=NULLConsole.log (Summ (10))    // ThisWindow.color= "Red"functionSaycolor () {Console.log ( This. Color)} Saycolor ()//Red    varAnother={color: "Blue"} another.putcolor=saycolor//The function name is just a pointerAnother.putcolor ()//Blue  //function Object Properties Caller  functionouter () {inner ()} /*function inner () {Console.log (Inner.caller)}*/  functioninner () {Console.log (Arguments.callee.caller)//reduced Coupling} outer ()//outer () function
3. Properties and methods of functions

Each function has two properties

Length Property: Indicates the number of parameter names for the function

Prototype property: Save reference type All instance methods, non-enumerable, cannot be implemented with for-in

Each function contains two non-inherited methods, all of which call the function in a specific scope, and actually equal the value of the this object in the body of the function.

Apply () Method: accepts two parameters, one is the scope in which the function is run, one is a parameter array (an instance of array or a arguments object)

Call () method: The first parameter accepted is the this value does not change, the second is not an array, directly passed to the parameters, see example Bar

   functionsum (num1,num2) {returnnum1+num2}functionOnesum (num1,num2) {returnSum.apply ( This, arguments)//arguments Object   }   functionTwosum (num1,num2) {returnSum.apply ( This, [num1,num2])//Array} console.log (Onesum (The)) Console.log (Twosum (The))   functionThree (num1,num2) {returnSum.call ( This, num1,num2)//parameter Direct delivery} console.log (Three (The))       //the Apply () and call () methods can extend the scope of the functionWindow.color= "Red"varOne={color: "Red"}  functionSaycolor () {Console.log ( This. Color)} Saycolor ()//RedSaycolor.call ( This)//RedSaycolor.call (window)//RedSaycolor.call (one)//The scope of blue here is one, no need to put the function into one medium operation

The ES5 rule also specifies a method for bind (), which creates a function instance whose this value is bound to the value passed to the bind () function.

  Window.color= "Red"  var one={color: "Blue"}  function  saycolor () {      Console.log (this. color)  }  var another=saycolor.bind (one)       ES5 A function method that creates an instance of a function, and the This value of the binding is passed to the function  another ()                          //Blue

JS function knowledge

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.