zoukankan      html  css  js  c++  java
  • call和apply和bind的区别

    在 javascript 中,call 和 apply 都是为了改变某个函数运行时的上下文(context)而存在的,换句话说,就是为了改变函数体内部 this 的指向。

    JavaScript 的一大特点是,函数存在「定义时上下文」和「运行时上下文」以及「上下文是可以改变的」。

     
    apply(): 将函数作为指定对象的方法来调用,传递给它的是指定的参数数组
    function.apply(thisobj, args) 或者 function.apply(thisobj, args)

    1、thisobj是调用function的对象,函数体内thisobj为this,如果参数为null则使用全局对象
    2、返回调用函数function的返回值

    bind(): 主要作用:将函数绑定到一个对象,返回一个新函数,通过可选的指定参数,作为指定对象的方法调用该方法
    语法 fun.bind(thisArg[, arg1[, arg2[, ...]]])

    function.bind(A) 或者是function.bind(A, args...);

    1、A要绑定在函数上的对象
    2、args...要绑定在函数上的零个或者是多个函数值
    3、返回一个新函数,该函数会当做A的方法调用,并向它传入args参数

    bind是ES5新增的一个方法
    传参和call或apply类似
    不会执行对应的函数,call或apply会自动执行对应的函数
    返回对函数的引用

    call(): 类似apply,将函数作为指定对象的方法来调用,传递给它的是指定参数
    function.call(thisobj, args.....)

    1、thisobj是调用function的对象,函数体内thisobj为this,如果参数为null则使用全局对象
    2、返回调用函数function的返回值

    apply与call的区别:

        <script>
                function print(a,b,c,d){
                    alert(a + b + c + d);
                }        
                function example(a,b,c,d){
                    //当参数很明确,一般使用call
                    print.call(this,a,b,c,d);            
                    //封装成数组
                    print.apply(this,[a,b,c,d])            
                    //javascript方法本身有的arguments数组,当参数不明确的时候可以用apply结合arguments
                    print.apply(this,arguments)
                }        
                example("心","想","事","成")     
            </script>
    var func = function(arg1, arg2) {
         
    };
    就可以通过如下方式来调用:
    func.call(this, arg1, arg2);
    func.apply(this, [arg1, arg2])

    三者区别demo:

    <script type="text/javascript">
                var obj = {
                    num: 888,
                };
                var foo = {
                    getNum: function() {
                        return this.num;
                    }
                }
                console.log(foo.getNum.bind(obj)()); //888
                console.log(foo.getNum.call(obj)); //888
                console.log(foo.getNum.apply(obj)); //888
                //apply 、 call 、bind 三者都是用来改变函数的this对象的指向的;
                //apply 、 call 、bind 三者第一个参数都是this要指向的对象,也就是想指定的上下文;
                //apply 、 call 、bind 三者都可以利用后续参数传参;
                //bind 是返回对应函数,便于稍后调用;apply 、call 则是立即调用 。
            </script>
  • 相关阅读:
    架构设计中的方法学——迭代设计
    架构重构改善既有代码的设计
    架构如何为业务和技术“服务”(2)
    架构如何为业务和技术“服务”(1)
    选用面向领域的多层分布式架构(DDD风格架构)的理由
    传话游戏(2013编程之美全国挑战赛资格赛)
    2012年蓝桥杯软件设计大赛河南省初赛试题和答案
    最大值最下化
    NYOJ120 校园网络(强连通缩点targan算法)
    NYOJ176整数划分(二)
  • 原文地址:https://www.cnblogs.com/lhl66/p/7502794.html
Copyright © 2011-2022 走看看