call、apply和bind
2020-08-28 本文已影响0人
释梦石
JavaScript 为我们专门提供了一些函数方法用来帮我们更优雅的处理函数内部 this 指向问题。即call、apply、bind 三个函数方法。
call()
call() 方法的作用
- 可以调用一个函数,与此同时,它还可以改变这个函数内部的 this 指向。
- 我们可以使用call()来可以实现继承。之所以能实现继承,其实是利用了上面的作用。
fn1.call(想要将this指向哪里, 函数实参1, 函数实参2);
this的指向不传递,则为null。
改变this的指向
3. 通过 call() 实现继承
实现继承apply()
-
apply()
方法调用一个函数, 其具有一个指定的this
值,以及作为一个数组(或类似数组的对象)提供的参数。 - 该方法的作用和
call()
方法类似,只有一个区别,就是call()
方法接受的是若干个参数的列表,而apply()
方法接受的是一个包含多个参数的数组。
bind()
- bind() 方法不会调用函数,但是可以改变函数内部的 this 指向。
- 把call()、apply()、bind()这三个方法做一下对比,如果有些函数,我们不需要立即调用,但是又想改变这个函数内部的this指向,此时用 bind() 是最为合适的。
新函数 = fn1.bind(想要将this指向哪里, 函数实参1, 函数实参2);
参数说明:
- 第一个参数:在 fn1 函数运行时,指定 fn1 函数的this 指向。如果不需要改变 this 指向,则传 null。
- 其他参数:fn1 函数的实参。
解释:它不会调用 fn1 函数,但会返回 由指定this 和指定实参的原函数拷贝
this.x = 9;
var module = {
x: 81,
getX: function() { return this.x; }
};
module.getX(); // 返回 81
var retrieveX = module.getX;
retrieveX(); // 返回 9, 在这种情况下,"this"指向全局作用域
// 创建一个新函数,将"this"绑定到module对象
var boundGetX = retrieveX.bind(module);
boundGetX(); // 返回 81