精华内容
下载资源
问答
  • ###\ ##\ ##\ ##\ ######\ ######\ #######\ ########\ ###\ ## _| ## | ## | \__| ## __##\ ## __##\ ## __##\ ## _____| \_##\ ## | ######\ #######\ ##\ #######\ ## / \__|## / ## |## | ## |## | ## | ...
  • 改变函数运行时的this 参考文档 https://www.jianshu.com/p/bc541afad6ee 转载于:https://www.cnblogs.com/tianxiaoxiao/p/9979936.html

    改变函数运行时的this

    参考文档 https://www.jianshu.com/p/bc541afad6ee

    转载于:https://www.cnblogs.com/tianxiaoxiao/p/9979936.html

    展开全文
  • bind方法并非立即执行一个函数 总结: call,apply,bind方法的联系和区别 第一个参数都是指定函数内部中this的指向(函数执行时所在的作用域),然后根据指定的作用域,调用该函数。 都可以在函数调用时传递参数。...

    call,apply,bind这三个方法其实都是继承自Function.prototype中的,属于实例方法。

    1. call()

    函数实例的call方法,可以指定该函数内部this的指向(即函数执行时所在的作用域),然后在所指定的作用域中,调用该函数。并且会立即执行该函数。

    call()方法可以传递两个参数

    • 第一个参数是指定函数内部中this的指向(也就是函数执行时所在的作用域),
    • 第二个参数是函数调用时需要传递的参数。

    2. apply()

    apply方法的作用与call方法类似,也是改变this指向(函数执行时所在的作用域),然后在指定的作用域中,调用该函数。同时也会立即执行该函数。唯一的区别就是,它接收一个数组作为函数执行时的参数。

    3. bind()

    bind方法用于指定函数内部的this指向(执行时所在的作用域),然后返回一个新函数。bind方法并非立即执行一个函数

    总结:
    call,apply,bind方法的联系和区别

    • 第一个参数都是指定函数内部中this的指向(函数执行时所在的作用域),然后根据指定的作用域,调用该函数。

    • 都可以在函数调用时传递参数。call,bind方法需要直接传入,而apply方法需要以数组的形式传入。

    • call,apply方法是在调用之后立即执行函数,而bind方法没有立即执行,需要将函数再执行一遍。有点闭包的味道。

    • 改变this对象的指向问题不仅有call,apply,bind方法,也可以使用that变量来固定this的指向。

    展开全文
  • 作用都是一样的,简单来说就是改变当前使用该方法的对象中的this指向,指向调用方法中的thisObj对象二者的区别(第一个参数是相同的)就是call方法中传入的参数是是一个个列举出来的,而apply方法中的参数二是一个...
  • bind、call、apply的区别与实现原理

    万次阅读 多人点赞 2018-10-17 12:27:31
    1、简单说一下bind、call、apply的区别 三者都是用于改变函数体内this的指向,但是bind与apply和call的最大的区别是:bind不会立即调用,而是返回一个新函数,称为绑定函数,其内的this指向为创建它时传入bind的第一...

    1、简单说一下bind、call、apply的区别

    三者都是用于改变函数体内this的指向,但是bind与apply和call的最大的区别是:bind不会立即调用,而是返回一个新函数,称为绑定函数,其内的this指向为创建它时传入bind的第一个参数,而传入bind的第二个及以后的参数作为原函数的参数来调用原函数。

    var obj = {};
    
    function test() {
        console.log(this === obj);
    }
    
    test(); //false
    
    var testObj = test.bind(obj);
    testObj();  //true
    

    apply和call都是为了改变某个函数运行时的上下文而存在的(就是为了改变函数内部this的指向);apply和call的调用返回函数执行结果;

    如果使用apply或call方法,那么this指向他们的第一个参数,apply的第二个参数是一个参数数组,call的第二个及其以后的参数都是数组里面的元素,就是说要全部列举出来;

    以下是MDN文档:

    bind语法:
    
    func.bind(thisArg[, arg1[, arg2[, ...]]])
    thisArg 当绑定函数被调用时,该参数会作为原函数运行时的this指向。当使用new 操作符调用绑定函数时,该参数无效。
    arg1, arg2, ... 当绑定函数被调用时,这些参数将置于实参之前传递给被绑定的方法。
    
    call语法:
    
    fun.call(thisArg, arg1, arg2, ...)
    thisArg::在fun函数运行时指定的this值。需要注意的是,指定的this值并不一定是该函数执行时真正的this值,如果这个函数处于非严格模式下,则指定为null和undefined的this值会自动指向全局对象(浏览器中就是window对象),同时值为原始值(数字,字符串,布尔值)this会指向该原始值的自动包装对象。
    arg1, arg2, ... 指定的参数列表。
    
    apply语法:
    
    fun.apply(thisArg, [argsArray])
    thisArg: 在 fun 函数运行时指定的 this 值。需要注意的是,指定的 this 值并不一定是该函数执行时真正的 this 值,如果这个函数处于非严格模式下,则指定为 null 或 undefined 时会自动指向全局对象(浏览器中就是window对象),同时值为原始值(数字,字符串,布尔值)的 this 会指向该原始值的自动包装对象。
    argsArray: 一个数组或者类数组对象,其中的数组元素将作为单独的参数传给 fun 函数。如果该参数的值为null 或 undefined,则表示不需要传入任何参数。从ECMAScript 5 开始可以使用类数组对象。
    

    区别总结:

    当我们使用一个函数需要改变this指向的时候才会用到call,apply,bind
    如果你要传递的参数不多,则可以使用fn.call(thisObj, arg1, arg2 ...)
    如果你要传递的参数很多,则可以用数组将参数整理好调用fn.apply(thisObj, [arg1, arg2 ...])
    如果你想生成一个新的函数长期绑定某个函数给某个对象使用,则可以使用

    const newFn = fn.bind(thisObj);
    newFn(arg1, arg2...)
    

    2、bind、call、apply的实现

    myBind:

    Function.prototype.myBind = function() {
        var _this = this;
        var context = [].shift.call(arguments);// 保存需要绑定的this上下文
        var args = [].slice.call(arguments); //剩下参数转为数组
        console.log(_this, context, args);
        return function() {
            return _this.apply(context, [].concat.call(args, [].slice.call(arguments)));
        }
    };
    

    myCall:

    /**
     * 每个函数都可以调用call方法,来改变当前这个函数执行的this关键字,并且支持传入参数
     */
    Function.prototype.myCall = function(context) {
        //第一个参数为调用call方法的函数中的this指向
        var context = context || global;
        //将this赋给context的fn属性
        context.fn = this;//此处this是指调用myCall的function
    
        var arr = [];
        for (var i=0,len=arguments.length;i<len;i++) {
            arr.push("arguments[" + i + "]");
        }
        //执行这个函数,并返回结果
        var result = eval("context.fn(" + arr.toString() + ")");
        //将this指向销毁
        delete context.fn;
        return result;
    }
    

    myApply:

    /**
     * apply函数传入的是this指向和参数数组
     */
    Function.prototype.myApply = function(context, arr) {
        var context = context || global;
        context.fn = this;
        var result;
        if (!arr) {
            result = context.fn(); //直接执行
        } else {
            var args = [];
            for (var i=0,len=arr.length;i<len;i++) {
                args.push("arr[" + i + "]");
            }
            result = eval("context.fn([" + args.toString() + "])");
        }
        //将this指向销毁
        delete context.fn;
        return result;
    }
    

    以上是bind、apply、和call的模拟实现

    注意:绑定函数(bind函数返回的新函数)不可以再通过apply和call改变其this指向,即当绑定函数调用apply和call改变其this指向时,并不能达到预期效果。

    var obj = {};
    
    function test() {
        console.log(this === obj);
    }
    
    var testObj = test.bind(obj);
    testObj();  //true
    
    var objTest = {
        "作者": "chengbo"
    };
    /**
     * 预期返回false, 但是testObj是个绑定函数,所以不能改变其this指向
     */
    testObj.apply(objTest); //true
    testObj.call(objTest); //true
    

    了解更多的内容,可以参考这个文章我的github博客,欢迎您的star

    展开全文
  • call apply bind的区别

    2020-02-26 11:32:00
    相同点: 都可以改变函数调用的this指向 不同点: call和apply的用法几乎相同,唯一不同就是参数不同。call只能一个一个参数传入,apply参数是一个数组。 bind的传参方式和call相同,但是改变调用函数的指向并返回...
    • 相同点: 都可以改变函数调用的this指向
    • 不同点:
    1. call和apply的用法几乎相同,唯一不同就是参数不同。call只能一个一个参数传入,apply参数是一个数组。
    2. bind的传参方式和call相同,但是改变调用函数的指向并返回一个新的函数,之后再调用这个函数时候this就指向bind绑定的第一个参数

    (1)call语法

    1. fun.call(thisArg,arg1,arg2,…)
    2. thisArg是fun函数运行时指定的this值(在非严格模式下,指定为null或undefined时会自动指向全局对象)
    3. arg1,arg2,…是指定的参数列表

    (2) apply语法

    • fun.apply(thisArg, [argsArray])

    • thisArg是fun函数运行时指定的this值(在非严格模式下,指定为null或undefined时会自动指向全局对象)

    • argsArray是一个数组或类数组对象,数组中的元素将作为单独的参数传给fun函数,如果argsArray为null或undefined时表示不需要传入任何参数。

      示例:
      数组没有max方法,可以使用Math对象上的max方法
      const arr = [1,2,3,4,5,6];
      const max = Math.max.apply(null,arr); // 6

    (3)bind语法

    • fun.bind(thisArg,arg1,arg2,…)

    • thisArg当绑定函数被调用时,该参数会作为原函数运行时的this指向。当使用new 操作符调用绑定函数时,该参数无效。

    • arg1, arg2, …当绑定函数被调用时,这些参数将置于实参之前传递给被绑定的方法。

      // 如果你某个函数绑定新的this指向并且固定先传入几个变量可以在绑定的时候就传入,之后调用新函数传入的参数都会排在之后
      const obj = {}
      function test(…args) {
      console.log(args);
      }
      const newFn = test.bind(obj, 1,2);
      newFn(3,4); // [1,2,3,4]
      使用场景

    • 当一个函数需要改变this指向时

    • 且参数较少时可以使用call

    • 如果参数较多,可以将参数整理到一个数组,使用apply

    • 如果想生成一个新函数长期绑定某个对象时,可以使用bind

    展开全文
  • // this:undefined a:undefined b:undefined apply apply:和call基本上一致,唯一区别在于传参方式 apply把需要传递给fn的参数放到一个数组(或者类数组)中传递进去,虽然写的是一个数组,但是也相当于给fn一个个...
  • call和apply都可以用来改变函数里的this指向,区别是 call(obj,1,2,3,)从第二个参数开始有多个参数,用来代表函数的实参 apply(obj,[1,2,3])第二个参数是一个数组,数组中的每一个元素对应一个实参 bind(obj,1,2,3,)...
  • call,apply和bind的用法及区别

    千次阅读 2019-04-09 18:16:44
    它和 call、apply 最大的区别是:bind 不会调用 bind 支持传递参数,它的传参方式比较特殊,一共有两个位置可以传递 在 bind 的同时,以参数列表的形式进行传递 在调用的时候,以参数列表的形式...
  • 今天重温了下js的基础知识,看到对象这块又有点迷糊,借此来记录一下自己的总结。 一、首先看看apply()以及call()的用法: var numbers = [1,5,9]; //output:9 var max_apply = Math.max.apply(Math,numbe...
  • 第二个参数差别就来了: call 的参数是直接放进去的,第二第三第 n 个参数全都用逗号分隔; apply 的所有参数都必须放在一个数组里面传进去; bind 除了返回是函数以外,它 的参数和 call 一样。 当然,三者的...
  • 改变函数内部的this指向 call()方法 call方法第一个参数是要绑定给this的值,后面传入的是参数列表。当第一个参数为null、undefined时,默认指向window。 var obj = { name: 'andy' } function fn(a, b) { ...
  • 复制代码 乍一看,三者的用法几乎一致,需要注意的是bind函数,调用之后并没有执行fn1 先看call和apply, 它们仅有的区别是传参的不同,call接收的是参数逐一传入,apply接收的是一个参数组成的数组 接下来,来实现...
  • call、apply和bind方法的用法以及区别   call、apply、bind的作用是改变函数运行时this的指向,所以先说清楚this 1、方法调用模式:   当一个函数被保存为对象的一个方法时,如果调用表达式包含一个提取属性的...
  • 二、三者分别是如何定义的及区别(摘自MDN) 三、在程序中收获 四、三者的具体应用 四、手写bind,apply,call 今天在读程序题的时候,遇到call,apply,bind的使用。 const person = { name: 'Lydia' } function...
  • call、apply和bind方法的用法以及区别

    千次阅读 2020-05-06 17:19:35
    fn1() fn1.apply(null) f1(f2) f1.apply(null,f2) 是不是觉得和前面写的call用法很像,事实上apply 和 call 的用法几乎相同, 唯一的差别在于:当函数需要传递多个变量时, apply 可以接受一个数组作为参数输入, call...
  • 下面我再详细说call apply bind 的具体区别 1 call 与apply的区别: 他们接收的参数不一样  var a = 1 ; var b = 2 ; var fun = function ( a , b ){ console . log ( a + b ) }; fun . call ( this ...
  • call、apply 和 bind 之间的区别比较大,前者在改变 this 指向的同时,也会把目标函数给执行掉;后者则只负责改造 this,不作任何执行操作。 call 和 apply 之间的区别,则体现在对入参的要求上。前者只需要将目标...
  • 方法的作用相同,它们的区别仅在于接收参数的方式不同。对于 call() 方法而言,第一个参数是 this 值没有变化,变化的是其余参数都直接传递给函数。换句话说,在使用 call() 方法时,传递给函数的参数必须逐个列举...
  • 3.箭头函数不能通过callapplybind改变this指向,但是可以通过这些方法传递参数 4.箭头函数没有原型属性 5.箭头函数没有arguments属性,可以用...展开运算符来接收所有的参数集合 一、箭头函数没有自己的this对象 ...
  • call、apply的区别 call与apply存在与参数的差别,call和apply的第一个参数都是要改变上下文的对象,而call从第二个参数开始以参数列表的形式展现,apply则是把除了改变上下文对象的参数放在一个数组里面作为他的第...
  • 箭头函数和普通函数有什么区别

    千次阅读 2019-05-01 21:09:57
    函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象,用callapplybind也不能改变this指向 不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出一个错误。 不可以使用arguments对象,该...
  • call,apply和bind详解

    2018-10-23 19:00:22
    call和apply其实是同一个东西,区别只有参数不同,call是apply的语法糖,所以就放在一起说了,这两个方法都是定义在函数对象的原型上的(Function.prototype),call和apply方法的作用都是改变函数中的this指向,第...
  • 其实我接触前端时间并不长,很多都处于学习阶段。但是随着自己掌握知识越发复杂起来,我发现学习一门新技术并没有想象中的容易,甚至要比想象中难很多...我们今天就是为了彻底搞懂这三个的区别。 bind和apply 首先来...
  • 文章目录call 和 apply 的共同点共同点call 和 apply 的不同点call的写法apply 的写法类数组call 和 apply 的用途callapplybind 的使用最后 call、apply 最主要的作用,是改变 this 的指向。 在平时的工作中,除了在...
  • call、apply、bind的区别

    2019-01-21 19:14:00
    我们都知道callapplybind都可以改变函数调用的this指向。那么它们三者有什么区别,什么时候该用哪个呢?我们先直接通过代码实例来了解,后面再借助专业文档来解释。 举个? // 有只猫叫小黑,小黑会吃鱼 const cat...
  • 对于前面2个 apply,call大家应该非常熟悉了,都可以改变this指向,都可以穿参数,但是bind的话很多人可能觉得和它们没有什么区别,估计用bind也用的少,下面我来一一分析下各自的实现原理: 1.call方法 1.第一个...
  • 箭头函数与普通函数的区别 1.箭头函数是匿名函数箭头函数不能作为构造函数使用不能使用new 2.箭头函数的this,始终指向父级上下文 3.箭头函数不能通过callapplybind改变this指向,但是可以通过这些方法传递参数 4....

空空如也

空空如也

1 2 3
收藏数 58
精华内容 23
热门标签
关键字:

callapplybind的区别