JS中改变this指向的方法(call和apply、bind)

导读:

在这里插入图片描述

this

this是javascript的一个关键字,随着函数使用场合不同,this的值会发生变化。但是总有一个原则,那就是this指的是调用函数的那个对象。

this一般指向的是当前被调用者,但也可以通过其它方式来改变它的指向,下面将介绍三种方式

call,apply,bind

call、apply、bind的作用是改变函数运行时this的指向。

call,apply,bind 这三个函数是 Function原型上的方法 Function.prototype.call() Function.prototype.apply Function.prototype.bind(),所有的函数都是 Funciton 的实例,因此所有的函数可以调用call,apply,bind 这三个方法。

call,apply,bind 在用法上的异同

相同点:
call,apply,bind 这三个方法的第一个参数,都是this。如果你使用的时候不关心 this是谁的话,可以直接设置为 null

不同点:

  • 函数调用 call,apply方法时,返回的是调用函数的返回值。
  • 而bind是返回一个新的函数,你需要再加一个小括号来调用。
  • call和apply的区别就是,call接受的是一系列参数,而apply接受的是一个数组。

但是有了 ES6引入的 ...展开运算符,其实很多情况下使用 call和apply没有什么太大的区别。

call(call用作继承时可以改变this指向)

call 方法第一个参数是要绑定给this的值,后面传入的是一个参数列表。当第一个参数为null、undefined的时候,默认指向window。

apply

apply接受两个参数,第一个参数是要绑定给this的值,第二个参数是一个参数数组。当第一个参数为null、undefined的时候,默认指向window。

bind

ES5还定义了一个方法:bind(),它会创建一个函数的实例,其this值会被绑定到传给bind()函数的值。
bind 方法不会立即执行,而是返回一个改变了上下文 this 后的函数。而原函数 的 this 并没有被改变,依旧指向全局对象 window。

注:

事实上apply 和 call 的用法几乎相同, 唯一的差别在于:当函数需要传递多个变量时, apply 可以接受一个数组作为参数输入, call 则是接受一系列的单独变量。

call和apply都可以改变this指向,不过apply的第二个参数是散列分布,call则可以是一个数组

猜你喜欢

转载自blog.csdn.net/zzDAYTOY/article/details/108348983