Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

第四天:call vs apply #6

Open
sofish opened this issue Apr 18, 2016 · 1 comment
Open

第四天:call vs apply #6

sofish opened this issue Apr 18, 2016 · 1 comment
Milestone

Comments

@sofish
Copy link
Owner

sofish commented Apr 18, 2016

对于函数体内,this 总是指向调用它的上下文,有时候我们希望调用的上下文是某个指定的对象,这里最简单的方法是使用用 callapply。每次面试,问到它俩有什么区别,这个非常简单的一个点,面试的时候屡试不爽,大部分人都不知道。

在此之前,我们先来看一段代码。

class Cat {
  constructor(name) {
    this.name = name;
  }
  meow() {
    console.log(`meow, i'm ${this.name}`);
  }
}

var fakeCat = { name: 'sofish' };

var ciao = new Cat('ciao');
ciao.meow();  // meow, i'm ciao
ciao.meow.call(fakeCat); // meow, i'm sofish
ciao.meow.apply(fakeCat); // meow, i'm sofish

同样是 Cat 的实例 —— ciao 在叫(meow),为什么结果不一样?因为第二和三个调用使用 callciao.meow 的执行上下文改变成 fakeCat,所以 this.name 相当于 fakeCat.name,结果很明显。

上面简单演示了它俩的作用,它俩的使用一样,只是参数不同。

  • call(context, arg1, arg2...) 第一个参数是上下文,之后所有参数为调用函数的参数列表
  • apply(context, [arg1, arg2...]) 第一个参数与 call 一样,之后传入一个数组作为函数的参数列表
  • 记忆方法:applyarray 第一个字母都是 a(如果这样就不会搞混参数了)

来个代码片段看看:

function sum(a, b, c) {
  console.log(a + b + c);
} 

sum.call(null, 1, 2, 3); // 6
sum.apply(null, [1, 2, 3]); // 6

好困,看会电视就睡觉去~

@wenzhixin
Copy link

有错别字。
大不分人:大部分人
在些之前:在写之前

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants