Question

当我检查Vue.js的源代码时，我看到两个大括号之间有代码行，并且在此构造之前没有任何定义（如function，()=>或其他事情）。我将它粘贴在控制台中并运行。但是，如果我不将它分配给变量，我怎么能使用它呢？

这是什么？我们为什么要在编写代码时使用这种方式？

....
 var formatComponentName = (null); 

    {
      var hasConsole = typeof console !== 'undefined';
      var classifyRE = /(?:^|[-_])(\w)/g;
      var classify = function (str) { return str
        .replace(classifyRE, function (c) { return c.toUpperCase(); })
        .replace(/[-_]/g, ''); };

      warn = function (msg, vm) {
        var trace = vm ? generateComponentTrace(vm) : '';

        if (config.warnHandler) {
          config.warnHandler.call(null, msg, vm, trace);
        } else if (hasConsole && (!config.silent)) {
          console.error(("[Vue warn]: " + msg + trace));
        }
      };

      tip = function (msg, vm) {
        if (hasConsole && (!config.silent)) {
          console.warn("[Vue tip]: " + msg + (
            vm ? generateComponentTrace(vm) : ''
          ));
        }
      };
    }
    ...

Answer 1

您所说明的内容称为块。您提供的代码示例是一种非常罕见的方法，可以将一组指令分组以用于样式目的，作为没有if，while，do...while，for或with不会改变代码的执行方式。

要演示，

document.body.innerHTML = "Testing...";

{
  document.body.innerHTML += "1";
  document.body.innerHTML += "2";
  document.body.innerHTML += "3";
}

document.body.innerHTML += "<br/>...and there you have it!"

https://jsfiddle.net/5crb1ezf/

在实践中完全相同：

document.body.innerHTML = "Testing...";
document.body.innerHTML += "1";
document.body.innerHTML += "2";
document.body.innerHTML += "3";
document.body.innerHTML += "<br/>...and there you have it!"

两个示例都会将相同的文本输出到浏览器：

测试... 123 ......你有它！

另一方面，如果您将块与控件结构结合使用，例如if，while，do...while，for和{{ 1}}，它将改变代码执行的方式。

with

正如上面指出的marty，可以在这里找到块的引用： https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/block

当花括号只包装代码时，这意味着什么？

1 个答案: