行业资讯

javascript函数式编程要掌握的知识点讲解

一:理解call和apply 及arguments.callee

ECMAScript3给Function的原型定义了两个方法,他们是Function.prototype.call 和 Function.prototype.apply. 其实他们的作用是一样的,只是传递的参数不一样而已;

1. apply; 接受2个参数,第一个参数指定了函数体内this对象的指向,第二个参数为一个类似数组的集合,比如如下代码:

1

2

3

4

5

6

7

8

9

 

var yunxi = function(a,b){

   console.log([a,b]); // [1,2]

   console.log(this === window); // true

};

yunxi.apply(null,[1,2]);

 

如上代码,我们第一个参数传入null,函数体内默认会指向与宿主对象,即window对象;因此我们可以在yunxi函数内打印下值为true即可看到:

下面我们来看看使用call方法的实例如下:

1

2

3

4

5

6

7

8

9

 

var yunxi = function(a,b){

   console.log([a,b]); // [1,2]

   console.log(this === window); // true

};

yunxi.call(null,1,2);

 

可以看到 call方法的第二个参数是以逗号隔开的参数;

   那么call和apply用在什么地方呢?

1. call和apply 最常见的用途是改变函数体内的this指向,如下代码:

1

2

3

4

5

6

7

8

9

10

11

12

13

 

var longen = {

    name:‘yunxi’

};

var longen2 = {

    name: ‘我叫涂根华’

};

var name = “我是来测试的”;

var getName = function(){

    return this.name;

};

console.log(getName()); // 打印 “我是来测试的”;

console.log(getName.call(longen)); // 打印 yunxi

console.log(getName.call(longen2)); // 打印 “我叫涂根华”

 

第一次调用 getName()方法,因为它是普通函数调用,所以它的this指向与window,因此打印出全局对象的name的值;

第二次调用getName.call(longen); 执行这句代码后,getName这个方法的内部指针this指向于longen这个对象了,因此打印this.name实际上是longen.name,因此返回的是name=”yunxi”;

但是this指针也有列外的情况,比如一个点击元素,当我们点击一个元素的时候,this指针就指向与那个点击元素,但是当我们在内部再包含一个函数后,在函数内再继续调用this的话,那么现在的this指针就指向了window了;比如如下代码:

1

2

3

4

5

6

7

 



TAGs标签: JavaScript 技术文章 程序分享 JavaSc

X关闭

欢迎咨询 400-856-0317 在线交谈 在线交谈