在JavaScript中,有一个十分常用且不空忽视的关键字——this。虽然它仅仅由四个字母组成,但是却不简单。随着函数使用场合的不同,this的指向也会跟着发生相应的变化,正是因为这一特性让很多初学者拿不下JS中的这块“硬骨头”。
在JavaScript中,有一个十分常用且不空忽视的关键字——this。虽然它仅仅由四个字母组成,但是却不简单。随着函数使用场合的不同,this的指向也会跟着发生相应的变化,正是因为这一特性让很多初学者拿不下JS中的这块“硬骨头”。
在JS中,this一般指向的是当前被调用者,但也可以通过其它方式来改变this指向。常见的函数调用有如下几种:函数名加括号调用、事件驱动式调用、new的方式调用。
今天,笔者就来详谈一下可以改变this指向的三种方式:call、apply、bind。
call(thisObj[, arg1[, arg2[, ...]]])
定义:使用一个指定的thisObj和若干个指定的参数值的前提下调用某个函数或方法;通过call方法,你可以在一个对象上借用另一个对象上的方法。
语法:fn.call(thisObj[, arg1[, arg2[, ...]]])
注意:
1、使用call的时候,thisObj不传或者为null、undefined时,函数中的this会指向window对象。
2、传递一个别的函数名时,函数中的this将指向这个函数的引用。
3、传递的值为数字、布尔值、字符串,this会指向这些基本类型的包装对象Number、Boolean、String。
4、传递一个对象,函数中的this则被“修正”为传递的这个对象。
apply(thisObj[,argArray])
定义:使用一个指定的thisObj和一个包含多个参数的数组或类数组对象的前提下调用某个函数或方法
比较apply和call的定义,我们发现这两者貌似没有多大差别。事实上它们的区别主要体现在第二个参数上。
注意:如果argArray不是一个有效的数组或者不是arguments对象,那么将导致一个TypeError。如果在调用的时候不提供任何参数,那么window对象将自动做为默认值。
bind()
定义:创建一个函数的实例,其this值会被绑定到传给bind()函数的值
在ES5中还提供了一个叫bind的函数,这个相对简单一些。bind方法允许手动传入一个this作为当前方法的上下文,然后返回持有上下文的方法。
当我们需要修正this时,只需要在花括号外面在调用一下bind并将要修正的对象传进去即可。
注意:bind与call和apply的不同点在于:bind不会执行对应的函数,call或apply会自动执行对应的函数。