8

这是一些示例代码。我想知道我是否有任何理由不应该这样做。

//some code
var x = "hello";

{
    var y = "nice";

    function myfunction() {
        //do stuff . . .
    }
}

我看到这样做的好处是能够以块的形式组织代码部分，并让自动格式化程序对此进行一些工作......

在我的测试中 {} 在创建 var 或函数时不会影响范围。

4

5 回答 5

11

This answer was written in times of earlier JavaScript implementations. While the same rules for var apply, ECMAScript 2015 (aka ES6) introduce the let variable declaration statement, which follows "traditional" block-scoped rules.

Example of let scoping with a Block, which logs "1", "2", "1":

{ let x = 1; console.log(x); { let x = 2; console.log(x) }; console.log(x) }

The MDN Reference on Block summarizes the usage of blocks as:

Important: JavaScript does not have block scope. Variables introduced with a block are scoped to the containing function or script, and the effects of setting them persist beyond the block itself. In other words, block statements do not introduce a scope. Although "standalone" blocks are valid syntax, you do not want to use standalone blocks in JavaScript, because they don't do what you think they do, if you think they do anything like such blocks in C or Java.

As discussed on MDN, the syntax is perfectly valid as { StatementList } (aka Block) is a valid Statement production..

However; and because this is very important: a new block does not introduce a new scope. Only function bodies introduce new scopes. In this case, both the x and y variables have the same scope.

In addition a FunctionDeclaration should appear only as a top-level statement - that is, it must be a statement directly under a Program or Function body, not a Block. In this case the declaration of myfunction is "not reliably portable among implementations".

There is the IIFE (Immediately Invoked Function Expression) pattern which can be used and, while it addresses the technical issues above, I would not recommend it here as it complicates the code. Instead, I would simply create more named functions (named functions can be nested!), perhaps in different modules or objects, as appropriate.

var x = "hello";

;(function () {
   // New function, new scope
   // "y" is created in scope, "x" is accessible through the scope chain
   var y = "nice";

   // Now VALID because FunctionDeclaration is top-level of Function
   function myfunction() {
   }
})(); // Invoke immediately

// No "y" here - not in scope anymore
于 2013-12-06T19:14:21.457 回答
4

意识到这是旧的，但我想我会为 ES2015 更新。

在这里找到的 let + const 确实有更多含义https://babeljs.io/docs/learn-es2015/

function f() {
  {
    let x;
    {
      // okay, block scoped name
      const x = "sneaky";
      // error, const
      x = "foo";
    }
    // okay, declared with `let`
    x = "bar";
    // error, already declared in block
    let x = "inner";
  }
}

于 2015-11-30T01:18:21.710 回答
3

我不明白最外面的花括号背后的原因，但函数总是写在 javascript 的花括号内。

如果您正在与其他开发人员合作，他们可能会发现外部花括号更令人困惑而不是有用，并且可能会产生一些负面影响：https ://web.archive.org/web/20160131174505/http://encosia.com/in- javascript-curly-brace-placement-matters-an-example/

于 2013-10-24T19:10:22.120 回答
0

不以这种方式编写代码可能有很多原因……可读性是第一，因为大多数人会发现这会使代码更难阅读。但是，从技术上讲，这样的编码没有问题，如果您更容易阅读，那应该没问题。

于 2013-10-24T19:14:01.007 回答
0

我认为当您开始编写更复杂的程序时，这种约定会出现问题。除了添加额外的代码行之外，人们不这样编写代码肯定有一个很好的理由。

但是由于 Javascript 没有块作用域，所以代码仍然可以工作。

于 2013-10-24T19:14:53.167 回答