任务33-this

2016-12-19  本文已影响0人  小木子2016

问答

apply、call 有什么作用,什么区别?

在介绍apply和call之前,我们先来看看this,
this的指向:this的指向只有函数调用的时候才能确定。

作用:两者都是在指定this值和参数(参数以数组或类数组对象的形式存在)的情况下调用某个函数。实际上就是说用它可以绑定一个函数然后在另一个环境中(比如另一个函数中)使用新环境给的参数(指定this值、参数)进行运算;
区别:两者的区别在于接受的参数不同,apply接受的是数组(或者是类数组对象),call接受的是多个参数。
如:
<pre>function sum(a,b){ console.log(a+b) } function applySum(a,b){ return sum.apply(this,[a,b]) //使用apply方法,必须传入数组 } function callSum(a,b){ return sum.call(this,a,b)//使用call方法,逐条列举参数 } applySum(3,4)//7 //虽然apply接受的是数组,但是传递给函数的参数还是数组中的元素,而不是整个数组 callSum(3,4)//7</pre>
由于apply接受数组类型的参数,所以就有这么个特别的用法。如:
<pre>var arr =[100,20,300,50] Math.min.apply(null, arr);20//就可以获得数组中的最小值 Math.max.apply(null,arr);300//就可以获得数组中的最大值</pre>

代码

1. 以下代码输出什么?

<pre>var john = { firstName: "John" } function func() { alert(this.firstName + ": hi!") } john.sayHi = func john.sayHi()</pre>

2. 下面代码输出什么,为什么?

<pre>`
func()

function func() {
alert(this)
}
`</pre>

3. 下面代码输出什么?

<pre>`
function fn0(){
function fn(){
console.log(this);
}
fn();
}
fn0();

document.addEventListener('click', function(e){
console.log(this);
setTimeout(function(){
console.log(this);
}, 200);
}, false);
`</pre>

4. 下面代码输出什么,why?

<pre>var john = { firstName: "John" } function func() { alert( this.firstName ) } func.call(john)</pre>

5. 代码输出?

<pre>var john = { firstName: "John", surname: "Smith" } function func(a, b) { alert( this[a] + ' ' + this[b] ) } func.call(john, 'firstName', 'surname')</pre>

6. 以下代码有什么问题,如何修改?

<pre>var module= { bind: function(){ $btn.on('click', function(){ console.log(this) //this指什么 this.showMsg(); }) }, showMsg: function(){ console.log('饥人谷'); } }</pre>

修改方法:
<pre>var module= { bind: function(){ $btn.on('click', function(){ console.log(this) module.showMsg(); }) }, showMsg: function(){ console.log('饥人谷'); } }</pre>

7. 下面代码输出什么?

<pre>var length = 3; function fa() { console.log(this.length); } var obj = { length: 2, doSome: function (fn) { fn(); arguments[0](); } } obj.doSome(fa);</pre>

版权归本人及饥人谷所有,转载请注明出处。

上一篇下一篇

猜你喜欢

热点阅读