js中call()、bind()、apply()三者的区别和用法

最新推荐文章于 2022-12-05 00:14:42 发布

不爱喝水的杯子呐

最新推荐文章于 2022-12-05 00:14:42 发布

阅读量83

点赞数

文章标签： javascript

本文链接：https://blog.csdn.net/qq_45982114/article/details/120799097

版权

1.原本的this指向

var name = '张三';
    var class1 = "3班";
    var f = {
        name:'李四',
        class2:this.class1,
        Fun:function () {
            console.log("我叫" + this.name + "班级" + this.class1);
        }
    }
    console.log(f.class2); //3班
    f.Fun();//我叫李四班级undefined

call()、bind()、apply()都是用来重定义this这个对象！

 var name = '张三';
    var class1 = "3班";
    var f = {
        name:'李四',
        class2:this.class1,
        Fun:function () {
            console.log("我叫" + this.name + "班级" + this.class1);
        }
    }
    console.log(f.class2); //3班
    f.Fun();//我叫李四班级undefined

    var d={
        name:'王五',
        class1:'9班'
    }

    f.Fun.call(d);//我叫王五班级9班
    f.Fun.bind(d)();//我叫王五班级9班
    f.Fun.apply(d);//我叫王五班级9班

由上面的代码可以得知bind()函数后面多了一个()，说明bind()返回了一个新的函数，需要被调用才可以使用。

 var name = '张三';
    var class1 = "3班";
    var f = {
        name:'李四',
        class2:this.class1,
        Fun:function () {
            console.log("我叫" + this.name + "班级" + this.class1);
        }
    }
    console.log(f.class2); //3班
    f.Fun();//我叫李四班级undefined

    var d={
        name:'王五',
        class1:'9班'
    }

    f.Fun.call(d,'小明','5班');//我叫小明班级5班
    f.Fun.bind(d,'小华','3班')();//我叫小华班级3班
    f.Fun.apply(d,['小刘','4班']);//我叫小刘班级4班

由上面的代码可得：

三者的第一个参数都是this的指向对象，bind()、call()的第二个和第三个参数都是用逗号隔开的string。而apply的第二个以后的参数都被装在一个数组里面。

如有什么写的不好的地方，请告知，一起学习。