原型方法在提取时不绑定是什么意思？答案

【问题标题】：What does prototype methods don't bind on extraction mean?原型方法在提取时不绑定是什么意思？
【发布时间】：2018-04-22 20:22:23
【问题描述】：

在阅读为什么 ES6 类方法不会自动将“this”绑定到方法时，我看到答案说“原型方法不会在提取时绑定”，但这对我来说毫无意义。 “提取时绑定”是什么意思？

当函数被调用时

obj.func()

“提取时绑定”是什么意思？

我发现的相关文章是：

https://esdiscuss.org/topic/why-are-es6-class-methods-not-automatically-bound-to-the-instance - 这是产生我问题的文章。搜索“我们仍然可以在提取时绑定方法”
Why aren't methods of an object created with class bound to it in ES6? - 这是引用相关文章的 Stack Overflow 问答。
Mozilla MDN web docs on Classes - 奇怪的是，作为示例 Javascript 类给出的 Rectangle 示例不使用 bind()。我猜是因为它不需要这么简单的绑定，但如果有的话，它将帮助那些从 Java 背景来到 Javascript 的人（比如我自己）
ES6 In Depth: Classes - 关于原型对象以及 class 关键字如何成为语法糖的非常好的文章。

【问题讨论】：

标签： javascript

【解决方案1】：

提取基本上意味着将方法与对象断开连接。每当您调用该方法而不将其“链接”到类实例时，您都可以这样做。

class Test {
  constructor(r) {
    this.r = r;
  }
  sample() {
    console.log(this);
  }
}

let t = new Test(1);
t.sample();
let q = t.sample;
q();

所以在这个例子中，当我调用t.sample() 时，它会返回我所期望的：{ r:1 }。但是当我设置q = t.sample 然后调用q() 时，我得到了未定义。我已经“提取”了我的函数并将其分配给不同的变量。

如果您将该函数用作事件处理程序，也会发生同样的情况。

【讨论】：

【解决方案2】：

想象一下你有什么课：

class C {
  foo() {
    console.log(this);
  }
}

有人这样做：

const c = new C();
const o = {
  callback: c.foo // "extract the function"
}
o.callback();

应该将哪个对象记录到控制台？ c，因为它最初声明了方法，或者o，因为这是我们在调用站点指定的？

JavaScript 默认使用后者，但您可以通过调用Function.prototype.bind 来实现前者。

也就是说，他们讨论的问题是类方法在从对象中检索时是否应该自动绑定到this，确保this 始终引用方法最初来自的对象，而不是对象来电者用来拨打电话。

【讨论】：