别人写的终于搞明白
上下文调用综述:
<script>
//上下文模式:根据用户传递的参数,指定了函数内部不同的this的值
//核心:以call/apply方法来调用某个函数
//call/apply方法定义在哪里?Function.prototype对象中--->所有的函数都能访问到call/apply方法
//fn--->fn.__proto__(Function.prototype)-->fn.__proto__.__proto__(Object.prototype)
function fn(){}
</script>
call的第一个参数:
<script>
function fn(){
console.log(this);
}
//call方法的第一个参数决定了函数内部的this的值
//第一种情况:传递null/undefined--->函数内部的this指向window
fn.call(null);
fn.call(undefined);
//第二种情况:传递数字、字符串、布尔值--->函数内部的this指向对应的基本包装类型的对象
fn.call(100); //Number的实例
fn.call("hello");//String的实例
fn.call(true); //Boolean的实例
//第三种情况:传递对象--->函数内部的this指向该对象
fn.call(/abc/);
fn.call([1,3,5]);
fn.call(function(){});
</script>
apple的第一个参数:
<script>
function fn(){
console.log(this);
}
//call方法的第一个参数决定了函数内部的this的值
//第一种情况:传递null/undefined--->函数内部的this指向window
fn.apply(null);
fn.apply(undefined);
//第二种情况:传递数字、字符串、布尔值--->函数内部的this指向对应的基本包装类型的对象
fn.apply(100); //Number的实例
fn.apply("hello");//String的实例
fn.apply(true); //Boolean的实例
//第三种情况:传递对象--->函数内部的this指向该对象
fn.apply(/abc/);
fn.apply([1,3,5]);
fn.apply(function(){});
</script>
call方法的参数
<script>
function foo(a,b,c){
for (var i = 0; i < arguments.length; i++) {
console.log(arguments[i]);
}
}
//call方法第一个参数指定函数内部的this的值
// 第二个参数表示函数的第一个实参
// 第三个参数表示函数的第二个实参
//以此类推
foo.call(null,1,3,5);
</script>
apply方法的参数列表
<script>
function foo(a,b,c){
for (var i = 0; i < arguments.length; i++) {
console.log(arguments[i]);
}
}
//apply方法第一个参数指定函数内部的this的值
// 第二个参数必须是一个数组 or 伪数组
// 这个数组(伪数组)的第一个元素表示第一个实参,第二个元素表示第二个实参,以此类推
foo.apply(null,[1,3,5]);
</script>