* apply和call方法的作用:用来改变this的指向
* apply和call方法中如果没有传入参数,或者传入的是null,那么调用该方法的函数对象中this的指向为window(默认)
* apply和call都可以让函数或者方法来调用,传入的参数和函数调用的写法不同,但是效果是一样的
* 如果传入的不是null,而是其他对象,那么就将this指向了该传入的非null对象
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
function f1(x, y) {
console.log("结果是:" + (x + y) + this);
return "10000";
}
f1(10, 20);//函数的调用
console.log("========");
// 此时的f1实际上是当成对象来使用的,对象可以调用方法
// apply和call方法也是函数的调用的方式
f1.apply();
f1.call();
console.log("==========");
f1.apply(null);
f1.call(null);
f1.apply(null, [100, 200]);
f1.call(null, 100, 200);
// 函数调用改变this的指向
function f1(x, y) {
console.log("这个函数是window对象的一个方法:" + (x + y) + this.sex);
}
window.f1(10, 20);
//obj是一个对象
var obj = {
age: 10,
sex: "男"
};
window.f1.apply(obj, [10, 20]);
window.f1.call(obj, 10, 20);
console.dir(obj);
//对象的方法调用改变this的指向
function Person(age, sex) {
this.age = age;
this.sex = sex;
}
//通过原型添加方法
Person.prototype.sayHi = function (x, y) {
console.log("您好啊:" + this.sex);
return 1000;
};
console.log(Person.prototype);
var per = new Person(10, "男");
per.sayHi();
console.log("==============");
function Student(name, sex) {
this.name = name;
this.sex = sex;
}
var stu = new Student("小明", "人妖");
var r1 = per.sayHi.apply(stu, [10, 20]);
var r2 = per.sayHi.call(stu, 10, 20);
console.log(r1);
console.log(r2);
</script>
</body>
</html>
apply和call方法的总结
* apply和call的使用方法
* apply的使用方法:
* 函数名字.apply(对象,[参数1,参数2...]);
* 对象.方法名字.apply(对象,[参数1,参数2...]);
* call的使用方法:
* 函数名字.call(对象,参数1,参数2...);
* 对象.方法名字.call(对象,参数1,参数2...);
* 作用:改变this的指向
* 使用场景:
* 只要是想用别的对象的方法,并且希望这个方法是当前对象的,那么就可以使用apply或者call方法改变this的指向
apply和call方法到底是谁的
* 所有的函数但是Function构造函数的实例对象
* 所以call和apply方法是Functionn中的prototype中的方法
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
function f1() {
console.log(this+":====>调用了");
}
//f1是函数,f1也是对象
console.dir(f1);
//对象调用方法,说明,该对象中有这个方法
f1.apply();
f1.call();
//说明所有的函数但是Function的实例对象
console.log(f1.__proto__==Function.prototype);
console.log(Function.prototype);//ƒ () { [native code] }
console.dir(Function);//该构造函数的原型方法中有apply和call方法
//apply和call方法实际上并不在函数这个实例对象中,而是在Function的prototype中
//实例对象调用方法,要么是在实例对象中,要么是在构造函数的原型对象中
</script>
</body>
</html>