javascript - 为什么直接声明函数时不能.bind(this)

Question

鉴于以下情况:

function x() {

    this.abc = 1;

    function f1() {
       alert(this.abc);
    }.bind(this)

    var f2 = function b() {
       alert(this.abc);
    }.bind(this);
}

我希望外部函数的“this”在 f1 和 f2 函数中可用。

为什么 VS2013 告诉我函数 f1() 上的 bind(this) 存在语法错误？

Answer 1

函数声明语句和函数实例化表达式是有区别的。两者都涉及关键字function，但声明语句不能立即用作对函数的引用。函数实例化表达式是表达式语法的一部分，因此它可以在该上下文中自由用作对函数的引用，因为这是它的计算结果。

你当然可以这样做:

(function a() {

}).bind(this);

虽然不使用 .bind() 的返回值，但它不是很有用。

如果语句中的第一个标记是function，那么您就有了一个函数声明语句。如果第一个标记不是 function，那么您要么得到另一种关键字引入的语句(for、return、 var, try, whatever), 否则你有一个表达式语句。在该表达式中(或在另一个上下文中的任何表达式中)，您的函数实例化是表达式语法的一部分，并且该值可以用作对函数的引用。

---

这是思考问题的另一种方式。假设在 JavaScript 中只有一种方法可以实例化一个函数，那就是函数表达式。也就是说，让我们假装使用 function 关键字意味着实例化一个函数并返回对该函数的引用作为它的值。

现在，一般考虑表达式和参与表达式的事物，重点是计算某种值。当您需要值 5 作为表达式的一部分时，您将 5 放在它的位置即可。 5 本身是一个有效的表达式，因此这不是语法错误:

5;

但是，那有什么用呢？它什么都不做。同样，在我们虚构的没有函数声明语句的 JavaScript 中，

function foo(a, b) {
  return a + b;
};

也什么都不做。将发生的只是函数将被实例化但被丢弃，因为值——对实例化函数的引用——没有保存为变量的值或传递给某个函数或其他任何东西。在这个虚构的 JavaScript 中，您将使用

var foo = function(a, b) {
  return a + b;
};

一直。

但是，语言设计确实有函数声明语句。作为一种简化方法，该语言仅将第一个标记是关键字 function 的语句识别为与恰好包含函数实例化的表达式语句完全不同的语句。还有其他方法可以解决问题(例如使用不同的关键字)，但我怀疑仍然会造成混淆。

请注意，有些 JavaScript 程序员非常喜欢对函数使用 var 声明。这确实是一个风格问题。