夺命雷公狗---javascript NO:32 Call/Apply方法

行内绑定中this指向:全局window对象

动态绑定中this指向:当前要操作的dom对象

构造器中的this指向:谁实例化构造器那么其内部的this就指向谁

1、为什么需要Call与Apply方法

问题:我们可以不可以手工改变函数内部的this指向?答:可以,使用Call或Apply方法

 

2、如何定义Call与Apply方法

call([thisObj[,arg1[,arg2[,argN]]]])

参数说明:

函数.call(thisObj,arg1,arg2,arg3…)

thisObj :要指向的Obj对象

arg1,arg2,arg3 :要传递的参数

 

apply([thisObj[,argArray]])

参数说明:

thisObj :要指向的Obj对象

argArray :要传递的参数,要求格式为数组

 

Call与Apply方法区别?

在功能上,两者效果完全一致,都是用于改变函数内部的this指向

在语法上,两者语法略有不同

 

3、为对象添加一个speak成员方法

 

 

<!DOCTYPE html>
<html>
<head>
<meta charset=’utf-8′>
<title></title>
</head>
<body>
<script>
//定义一个公用的说话方法
function speak(){
alert(this.name+this.age);
}
function person(){}
//通过person构造器创建对象
var p1 = new person();
p1.name = ‘zhangsan';
p1.age = ’22′;
//通过call方法调用speak方法
speak.call(p1);
var p2 = new person();
p2.name = ‘lisi';
p2.age =55′;
//通过apply方法调用speak说话方法
speak.apply(p2);
</script>
</body>
</html>

 

 

4、call与apply方法执行流程

1)改变函数内部的this指向

2)调用函数

 

5、实现为speak方法传参

 

 

<!DOCTYPE html>
<html>
<head>
<meta charset=’utf-8′>
<title></title>
</head>
<body>
<script>
//定义一个公用的说话方法
function speak(email,address){
alert(this.name+this.age+email+address);
}
function person(){}
//通过person构造器创建对象
var p1 = new person();
p1.name = ‘zhangsan';
p1.age = ’22′;
//通过call方法调用speak方法
speak.call(p1,’123.@.163.com’,’广东省广州市’);
var p2 = new person();
p2.name = ‘lisi';
p2.age =55′;
//通过apply方法调用speak说话方法
speak.apply(p2,[‘5566@qq.com’,’广东省深圳市’]);
</script>
</body>
</html>

 

 

 

6、案例:同时改变文字大小与颜色特效

 

<!DOCTYPE html>
<html>
<head>
<meta charset=’utf-8′>
<title></title>
<script>
function fn1(){
this.style.color = ‘red';
}
function fn2(){
this.style.fontSize = ’30px';
}
window.onload = function(){
document.getElementById(‘result’).onclick = function(){
fn1.call(this);
fn2.apply(this);
}
}
</script>
</head>
<body>
<div id=’result’>call与apply方法主要功能是改变函数内部的this指向</div>
</body>
</html>

 

posted @ 2015-12-09 10:26  夺命雷公狗  阅读(149)  评论(0编辑  收藏  举报