zoukankan      html  css  js  c++  java
  • call apply bind

    每个函数都包含两个非继承而来的方法call() apply()

    用途:在特定的作用域中调用函数,实际等于设置函数体内this对象的值


    1. apply call

    apply方法接收两个参数:在其中运行函数的作用域 参数数组

    第二个参数可以是Array的实例,也可以是arguments对象

    第一个参数是null undefined 指向window global 
    (严格模式指向 null undefined)

    function sum(num1, num2) {
        return num1 + num2;
    }
    
    function sum1(num1, num2) {
        return sum.apply(this, arguments);
        //传入arguments对象
    }
    
    function sum2(num1, num2) {
        return sum.call(this, [num1, num2]);
        //传入数组
    }
    
    sum1(10, 10); //20
    sum2(10, 10); //20

    sum1在执行sum函数时传入this,在全局中调用那么this就指向window 
    但是在严格模式下,没有指定环境对象而调用函数,this不会指向window 而是undefined,除非把函数添加到某个对象或者调用apply call

     function sum3(num1, num2) { 
         return sum.call(this, num1, num2); 
    } //20 

    使用apply 还是call 取决于你采取哪种给函数传递参数的方式最方便

    除了传递参数,他们能够扩充函数赖以运行的作用域

    window.o = 'red';
    var o = { color: 'blue'};
    
    function sayColor() {
        alert(this.color);
    }
    
    sayColor(); //red
    sayColor.call(this);  //red
    sayColor.call(window); //red
    sayColor.call(o);  //blue
    
    
    //全局作用域下是red,而如果是指向了o,那么就是blue

    2.bind

    这个方法会创建一个函数的实例,其this值会被绑定到传给bind函数的值

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

    使用bind则会被绑定,即使使用call apply也无法修改

  • 相关阅读:
    day58
    day57
    day55
    day56
    day54
    Vue(练习二)
    Vue练习
    Vue框架
    作业
    Django(九)
  • 原文地址:https://www.cnblogs.com/Auyuer/p/8191736.html
Copyright © 2011-2022 走看看