A daily summary of javascript Learning (Function objects)

This site has not updated the article for two days, are you waiting to worry, today we start to continue to "a daily javascript learning summary" series of articles, I hope you continue to pay attention to.

1. Function function call (similar to call method)

  function callSomeFunction(someFunction, someArgument){
      return someFunction(someArgument);
    }

    function add10(num){
      return num + 10;
    }
    
    var result1 = callSomeFunction(add10, 10);// call add10  The parameter 10 To pass to add10
    alert(result1);  //20
    
    function getGreeting(name){
      return "Hello, " + name;
    }
    
    var result2 = callSomeFunction(getGreeting, "Nicholas");
    alert(result2);  //Hello, Nicholas

2, function return function

function createComparisonFunction(propertyName) {
    
      return function(object1, object2){
        var value1 = object1[propertyName];
        var value2 = object2[propertyName];
    
        if (value1 < value2){
          return -1;
        } else if (value1 > value2){
          return 1;
        } else {
          return 0;
        }
      };
    }

    var data = [{name: "Zachary", age: 28}, {name: "Nicholas", age: 29}];
    
    data.sort(createComparisonFunction("name"));//sort The function to receive 1 A function as a sort of reference, a function createComparisonFuntion Returned to the 1 Anonymous sorting functions 
    alert(data[0].name); //Nicholas
    
    data.sort(createComparisonFunction("age"));
    alert(data[0].name); //Zachary    

3. apply() method

 function sum(num1, num2){
      return num1 + num2;
    }
    
    function callSum1(num1, num2){
      return sum.apply(this, arguments);//sum Function requests the callSum1 The pointer passes to yourself and computes at this point this Point to the callSum1
    }
    
    function callSum2(num1, num2){
      return sum.apply(this, [num1, num2]);
    }
    
    alert(callSum1(10,10));  //20
    alert(callSum2(10,10));  //20

4. Arguments Caller

function outer(){
      inner();
    }
    
    function inner(){
      alert(inner.caller);
    }
    
    outer();
caller

// return 1 Three references to a function that calls the current function. 

5, arguments. callee. caller

function outer(){
      inner();
    }
    function inner(){
      alert(arguments.callee.caller);
      //argments.callee It's the body itself, arguments.callee.caller It's the body of the calling function 
    }
    outer();


function factorial(num){
      if (num <= 1) {
        return 1;
      } else {
        return num * arguments.callee(num-1)//callee The reference to the current function is factorial The body of the function itself 
      }
    }

    var trueFactorial = factorial;
    
    factorial = function(){
      return 0;
    };
    
    alert(trueFactorial(5));  //120
    alert(factorial(5));    //0

6. Funtion bind() method

 window.color = "red";
    var o = { color: "blue" };
              
    function sayColor(){
      alert(this.color);
    }
    var objectSayColor = sayColor.bind(o);
    objectSayColor();  //blue
    /*
      bind Basically to change the inside of the function this Point to, this is in ECMA5 In the future, so IE81 The browser below does not support it 
      bind The method will create 1 A new function , It's called a binding function . When this binding function is called , The binding function is passed in when it is created bind Methods the first 1 2 parameters as this,
       The incoming bind Methods the first 2 The number of arguments and subsequent arguments plus the arguments of the bind function runtime itself are called in order as arguments to the original function .
    */

7. Function call() method

window.color = "red";
    var o = { color: "blue" };
    
    function sayColor(){
      alert(this.color);
    }
    
    sayColor();      //red
    
    sayColor.call(this);  //red  At this time this Point to the window
    sayColor.call(window); //red  Same as above 
    sayColor.call(o);   //blue  At this time sayColor Pointer to o

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

8. Function length length

function sayName(name){
      alert(name);
    }   
    
    function sum(num1, num2){
      return num1 + num2;
    }
    
    function sayHi(){
      alert("hi");
    }
    
    alert(sayName.length); //1
    alert(sum.length);   //2
    alert(sayHi.length);  //0
    // What is actually returned is the length of the function's argument 

The above is the summary of today's javascript study, and we will continue to update it every day. I hope you will continue to pay attention to it.