• call和apply,bind浅谈


    call和apply的作用是:更改函数运行时候的上下文对象,换句话说,就是更改函数运行时候的this指向

     call 和 apply 是为了动态改变 this 而出现的,当一个 object 没有某个方法,但是其他的有,我们可以借助call或apply用其它对象的方法来操作。

       function Person(name) {
                this.name = name;
                this.say = function () {
                    console.log("我叫:" + this.name)
                }
            }
    
            let p1 = new Person("benben");
            p1.say(); // 我叫:benben
    
            let p2 = {
                name: "大宝"
            }
            p1.say.call(p2)  //我叫:大宝
            p1.say.apply(p2)  //我叫:大宝
     

    call和apply的区别: 他们的作用完全一样,只是参数不一样,当函数的参数明确的时候,用call,参数不明确的时候,用apply

      function func(x,y){
                console.log(x+y);
            }
    
            func.call(this,1,2);  //3
            func.apply(this,[1,2]); //3
    

     apply可以用来数组的合并

      

            let arr1 = [1,2,3];
            let arr2 = [4,5,6];
            Array.prototype.push.apply(arr1,arr2) //会对原数组有arr1影响
            console.log(arr1);//[1,2,3,4,5,6]
            console.log(arr2);//[4,5,6]
    为什么不用js的原生push()呢,因为原生push(),参数添加的是个数组
            let arr3 = [1,2,3]; 
            let arr4 = [4,5,6];
            arr3.push(arr4);
            console.log(arr3); //[1, 2, 3, Array(3)]
            console.log(arr4); //4,5,6
    为什么不用原生的concat(),因为不会对原数组有影响,返回的是一个新数组
            let arr5 = [1,2,3];
            let arr6 = [4,5,6];
            let arr7 = arr5.concat(arr6);
            console.log(arr5); //[1, 2, 3]
            console.log(arr6); //[4, 5, 6]
            console.log(arr7); //[1, 2, 3, 4, 5, 6]
    将伪数组转换成数组:用Array.prototype.slice.call(nodeList)
            let showNode = document.getElementsByTagName("*");
            let showNodeArray = Array.prototype.slice.call(showNode);
            showNodeArray.push(22);
            console.log(showNodeArray); [html, head, meta, meta, meta, title, body, script, 22]

    MDN的解释是:bind()方法会创建一个新函数,称为绑定函数,当调用这个绑定函数时,绑定函数会以创建它时传入 bind()方法的第一个参数作为 this,传入 bind() 方法的第二个以及以后的参数加上绑定函数运行时本身的参数按照顺序作为原函数的参数来调用原函数

            var x= 10;
            function showBind() {
                return this.x;
            }
    
    
            var foo = {
                x: 22
            }
           console.log( showBind());// 10
            let funcBind = showBind.bind(foo);
            console.log(funcBind()); //22

    apply、call、bind比较

    • apply 、 call 、bind 三者都是用来改变函数的this对象的指向的;
    • apply 、 call 、bind 三者第一个参数都是this要指向的对象,也就是想指定的上下文;
    • apply 、 call 、bind 三者都可以利用后续参数传参;
    • bind 是返回对应函数,便于稍后调用;apply 、call 则是立即调用
     
     
  • 相关阅读:
    103、服务器出现大量close_wait的连接的原因是什么?有什么解决方法?
    102、常见的HTTP状态码有哪些?
    rpm包管理、yum源及创建本地仓库(同步华为源)
    文件管理之:输出与重定向echo
    高级权限--acl, mask,文件属性权限;su切换用户,sudo提权
    基本权限;权限对⽂件or⽬录的意义;特殊权限;文件权限之umask
    权限管理--用户介绍;用户与组相关文件;用户管理命令之用户创建、查看、删除、修改
    文件管理之:打包、压缩
    字符处理命令-sort排序,uniq去重,cut剪切文件,tr删除或替换结果集,wc统计
    上传与下载wget、curl、r z、s z
  • 原文地址:https://www.cnblogs.com/garyzhijiang/p/9239692.html
Copyright © 2020-2023  润新知