71 lines
1.8 KiB
HTML
71 lines
1.8 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Document</title>
|
||
<script>
|
||
// call,apply 用其他函数的方法
|
||
function add(a,b){
|
||
return a+b;
|
||
}
|
||
function sub(a,b){
|
||
return a-b;
|
||
}
|
||
var a1 = add.apply(sub,[4,2]); //sub调用add的方法
|
||
var a2 = sub.apply(add,[4,2]);
|
||
// alert(a1); //6
|
||
// alert(a2); //2
|
||
|
||
/*call的用法*/
|
||
var a1 = add.call(sub,4,2); //sub调用add的方法
|
||
console.log(a1)
|
||
|
||
// 实现继承 cat 继承animal
|
||
function Animal(name){
|
||
this.name = name;
|
||
this.showName = function(){
|
||
alert(this.name);
|
||
}
|
||
}
|
||
|
||
function Cat(name){
|
||
console.log(this)
|
||
Animal.apply(this,[name]); // this new以后指向的是他的实例，cat 但是cat的构造函数里面通过apply把当前的this指向了animal
|
||
//所以他实例出来的对象cat 就能用 animal里面的属性和方法
|
||
}
|
||
|
||
var cat = new Cat("咕咕");
|
||
cat.showName();
|
||
|
||
/*call的用法*/
|
||
Animal.call(this,name);
|
||
|
||
|
||
// bind
|
||
var a = {
|
||
b : function(){
|
||
var func = function(){
|
||
console.log(this.c);
|
||
}
|
||
func.bind(this)(); //等价于 this.func()
|
||
},
|
||
c : 'Hello!'
|
||
}
|
||
a.b();
|
||
//Hello!
|
||
</script>
|
||
</head>
|
||
<body>
|
||
<p> call和apply的作用都是 修改this的指向</p>
|
||
<p> call和apply 操作的都是函数 而不是对象</p>
|
||
<p>区别：
|
||
<p>call 需要的参数都写上（单独的）</p>
|
||
<p>apply 需要的参数 如果有多个的话，需要用数组的形式传过去</p>
|
||
</p>
|
||
<p>bind()方法主要就是将函数绑定到
|
||
<p>f.bind(obj)，实际上可以理解为obj.f()</p>
|
||
</p>
|
||
</body>
|
||
</html> |