前端开发工程师:解读call方法的使用及输出结果

12 min read
function foo() {
  console.log(this.bar);
}

var bar = "global";

var obj1 = {
  bar: "obj1",
  foo: foo
};

var obj2 = {
  bar: "obj2"
};

foo(); // global
foo.call(obj1); // obj1
foo.call(obj2); // obj2

这个代码片段定义了一个函数foo,和三个对象:全局对象、obj1obj2。其中obj1obj2都有一个名为bar的属性,分别被赋为"obj1""obj2"

首先调用foo时,没有指定上下文,所以this指向全局对象,即变量bar的值为"global",所以输出global

然后使用call方法,并将obj1作为参数传入,可以强制将this指向obj1,所以this.barobj1.bar,即输出obj1

最后使用call方法,并将obj2作为参数传入,同样可以强制将this指向obj2,所以this.barobj2.bar,即输出obj2