zoukankan      html  css  js  c++  java
  • 《JavaScript总结》apply、call和bind方法

    在JavaScript中,apply、call、bind这个三个方法,它们的作用都是为了改变某个函数运行时的上下文,

    也就是改变函数体内的this指向。

    在一个函数里,存在“定义时上下文”、“运行时上下文”,而且上下文是可以改变的。

    apply方法

    apply方法接收两个参数,第一个参数是:“上下文对象” ,第二个参数是:“传入当前执行函数的参数”(第二个参数是数组)。

            function test(){
                console.log(this.name);
            }
            
            let one = {
                name:'测试1'
            }
    
            let two = {
                name:'测试2'
            }
    
            test.apply(one);//将one对象传入函数 这时test函数的上下文是one ,one的name等于'测试1' 所以输出 '测试1'
            test.apply(two);//将two对象传入函数 这时test函数的上下文是two ,two的name等于'测试2' 所以输出 '测试2'    

    我们自己封装一个log函数,将传入的参数打印在控制台。

            function log(){
                var arr = Array.prototype.slice.apply(arguments);
                console.log.apply(console,arr);
            }
    
            log(1,2,4);    

    call方法

    call和apply作用都是一样的,唯一的不同点是第二个参数,apply的第二个参数是数组,而call的第二个参数的话,看下面例子:

            var arr = [1,2,3];
            Array.prototype.push.call(arr,6,7,8); //参数是一个一个传的
            console.log(arr);//[1, 2, 3, 6, 7, 8]

    bind方法

     bind方法和apply、call的作用也是差不多的,不同的是 apply、call 这两个方法是立即执行函数,而bind不是,来看下面例子:

            let one = {
                name:'测试1'
            }
            let two = {
                name:'测试2'
            }
    
            function sayName(){
                console.log(this.name);
            }
    
            let play = sayName.bind(one); //这里并不会立即执行
            play(); //所以 可以将这个方法 放到需要的地方 在执行

    apply、call、bind这三者的区别

    相同点:这个三个方法的作用都是改变函数执行上下文。

    不同点:bind是返回对应的函数,便于稍后调用,apply、call方法则是立即执行(立即调用)

    参考教程:https://www.cnblogs.com/moqiutao/p/7371988.html

  • 相关阅读:
    Eclipse 快捷键大全
    js字符串变量赋值的时候,一行写不下,想在下一行继续写
    java.lang.ClassNotFoundException: com.opensymphony.xwork2.util.TextUtils
    JS调用iframe父窗口元素和子窗口元素的方法
    no JMagick in java.library.path
    数据库建立索引的原则
    Batch update returned unexpected row count from update [0]; actual row count: 0; expected: 1
    软件项目管理心得
    Errors running builder JavaScript Validator的问题
    21. Session Management
  • 原文地址:https://www.cnblogs.com/Mrrabbit/p/10472312.html
Copyright © 2011-2022 走看看