欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

apply,call,bind的基本使用

程序员文章站 2022-07-14 14:27:10
...

apply()、call()、bind()有什么用?

作用:都用可以用于改变函数中this的指向;

apply()、call()的区别

function Person (name,age) {
    console.log(this + "name:" + name + "age:" + age)
}


/*************************call()的使用********************************/
function Student (name,age) {
    //如果Student想使用Person的方法,需要改变Person方法this的指向;
    //用法:  方法.call(this/null, 参数1, 参数2, ...)
    Person.call(this, name, age)  
}


Student('小白', 18)
//[object Window]  name:小白age:18

//这样就成功用Student调用了Person的方法


/*************************apply()的使用********************************/
function Student (name,age) {
    //如果Student想使用Person的方法,需要改变Person方法this的指向;
    //用法:  方法.apply(this/null, [参数1, 参数2, ...])
    Person.call(this, name, age)  
}


Student('小白', 18)
//[object Window]  name:小白age:18


这样就成功用Student调用了Person的方法,实际上也算是借用构造函数。可以通过这个渠道实现继承。(Student继承Person)

但是要注意的是如果你打印函数Student,会发现里面是没有这个方法的,只是借用了这个方法。

 

总结:apply()、call()实际上完成的任务是一样的,只是习惯不同,会喜欢使用不同的函数。它们的不同点在于他们的参数设置

           call的用法是:   方法名字(或者是原型/对象的方法).call(this/null, 参数1, 参数2, ...)

           apply的用法是:   方法名字(或者是原型/对象的方法).apply(this/null, [参数1, 参数2, ...])

 

 

这时候存在一个问题我使用方法时使用的第一个参数 this/null到底有什么区别?

apply和call方法中如果没有传入参数,或者是传入的是null,那么调用该方法的函数对象中的this就是默认的window;除非有对象调用这个方法;

function Person (name,age) {
    console.log(this)
}

var obj = {};
Person.call(obj, '大白', 22) //{}

//假如我使用构造函数的实例化对象(new的对象)调用,注意构造函数的this就是实例化对象的本身。
function Student () {};
var stu = new Student();
Person.call(stu, '二白', 21) // Student(){}  ,打印出他的构造函数!
Person.call(null, '二白', 21) // windows

那么之前第一个例子中直接再构造函数中使用Person.call(this, '小白', 18),中的this是window是由于构造函数中的this就是window,所以我们在赋值的时候会把this(window)赋予给Person中的this。所以打印出window;

但是当我们把第一个值设置为null的时候系统会默认把this赋予给window。

总结:我们在apply(),call(),第一个参数中赋予的对象决定了被调用函数(Person)的this。

 

 

bind()的使用

bind()和apply()、call()的区别在于后者是直接调用,前者会把他复制为一个函数。不会直接调用

function Person (name) {
    console.log(this + 'name' + name);
}

Person.call(this,'三白') //直接执行;

var ff = Person.bind(this,'三白') //赋值到ff中,并没有调用;
ff()//此时才执行;

那么这个bind()的作用就在于有些不需要直接执行的地方,例如事件函数啊,setTimeout啊,setInterval啊这一些地方。

 

 

 

以上就是他们的使用和区别啦。对了经过测试在平常的使用forEach()会比for的效率要高的多。有毛有特色情况麻烦提一下