JavaScript中call()、apply()、bind()方法特点讲解

开发 前端
在javascript中,每个对象中都会有一个apply()方法和一个call()方法,两者作用是都可以替代另一个对象调用一个方法,将一个函数的上下文改变成由thisObj指向的新对象。

[[406250]]

在javascript中,每个对象中都会有一个apply()方法和一个call()方法

两者的相同之处:

两者作用是都可以替代另一个对象调用一个方法,将一个函数的上下文改变成由thisObj指向的新对象

当我们通过call和apply来this的指向时,不传任何参数,则默认为将this指向修改为windows,有参数时会指向第一个参数

两者不同之处:

apply最多只能有两个参数——新this对象和一个数组argArray。如果给该方法传递多个参数,则把参数都写进这个数组里面,当然,即使只有一个参数,也要写进数组里。如果argArray不是一个有效的数组或arguments对象,那么将导致一个TypeError。如果没有提供argArray和thisObj任何一个参数,那么Global对象将被用作thisObj,并且无法被传递任何参数。

call它可以接受多个参数,第一个参数与apply一样,后面则是一串参数列表。这个方法主要用在js对象各方法相互调用的时候,使当前this实例指针保持一致,或者在特殊情况下需要改变this指针。如果没有提供thisObj参数,那么 Global 对象被用作thisObj。

案例:

  1. // apply()方法 
  2. obj.apply(thisObj,['arg1''arg2']) 
  3.  
  4. // call()方法 
  5. obj.call(thisObj,'arg1','arg2','arg3'

 以上thisObj继承了obj的属性和方法

  1. // 例1: 
  2. function add(j, k){ 
  3.   return j+k; 
  4.  
  5. function sub(j, k){ 
  6.   return j-k; 
  7.  
  8. // sub继承了add方法 
  9. console.log(add(5,3)); //8 
  10. console.log(add.call(sub, 5, 3)); //8 
  11. console.log(add.apply(sub, [5, 3])); //8 
  12.  
  13. // add继承了sub方法 
  14. console.log(sub(5, 3)); //2 
  15. console.log(sub.call(add, 5, 3)); //2 
  16. console.log(sub.apply(add, [5, 3])); //2 
  17.  
  18. // 例2: 
  19. var person = function(){ 
  20.   this.name = "Tom"
  21.   this.age = 22; 
  22. var other = {}; 
  23.  
  24. console.log(other); // {} 
  25. // other继承了person的属性 
  26. person.call(other); 
  27. console.log(other); // {name"Tom", age: 22} 

 bind绑定:

call()方法和apply()方法在绑定后会立即执行,而bind则不会立即执行

  1. add.bind(sub, 5, 3); // 返回的是add方法函数本体 
  2. add.bind(sub, 5, 3)(); // 8 

 【编辑推荐】

 

责任编辑:姜华 来源: 今日头条
相关推荐

2024-08-26 14:35:19

JavaScript关键字对象

2017-10-10 14:36:07

前端Javascriptapply、call、

2021-12-05 08:27:56

Javascript 高阶函数前端

2015-03-02 09:22:09

Javascript函数用法apply

2024-08-20 16:04:27

JavaScript开发

2024-08-26 08:36:26

2024-03-15 08:21:17

bindJavaScrip函数

2011-03-22 09:49:15

JavaScript

2021-06-09 07:01:30

前端CallApply

2021-11-30 06:56:58

CallApply函数

2023-06-28 08:34:02

Bind()函数JavaScript

2010-04-30 16:08:20

Unix内核

2009-03-10 11:18:13

2009-06-24 11:12:17

callerJavascript

2010-03-03 14:16:48

Python ZipF

2015-12-24 09:48:40

JavaScriptthis指针深

2010-04-30 14:51:23

Unix系统

2010-05-11 20:17:23

NTLM认证协议

2010-01-06 19:18:22

.NET Framew

2010-06-17 14:34:18

Rsync 使用
点赞
收藏

51CTO技术栈公众号