Javascript调用方法困惑

Question

为什么这有效:

this.example = element => {
  console.log(element, element, element);
};

this.example.call({}, 'yo');
//prints yo yo yo

与此相反:

this.example = element => {
  console.log(element, element, element);
};

this.example.call('yo');
/// prints undefined

我似乎不明白为什么第二个示例打印未定义。为什么需要使用参数(在本例中:一个空对象)，以便调用打印回我们想要的解决方案？

编辑:

对于那些评论:在 ES6 语法中似乎“this”被忽略了

example = element => {
  console.log(element, element, element); // yo yo yo
  console.log(this); // {}
};

function example(element) {
  console.log(element, element, element); // yo yo yo
  console.log(this); // {newObjKey: 'value'}
}

example.call({ newObjKey: 'value' }, 'yo');

Answer 1

call 方法的第一个参数是函数绑定(bind)到的 this 引用。但由于它是一个箭头函数，the first parameter of call is ignored (然而，它仍然被评估!)。 call 函数中紧随 this 引用的所有其他参数都作为函数参数传递。

在第一个示例中，{} 被忽略，"yo" 作为参数传递给 example 函数。在第二个示例中，“yo” 被忽略，并且您没有提供第二个参数，因此默认情况下它是未定义。