javascript - JavaScript的“with”语句是否有合法用途？(Are there legitimate uses for JavaScript's “with” statement?)

Question

Alan Storm's comments in response to my answer regarding the with statement got me thinking.

(Alan Storm回应我关于with声明的回答的评论让我思考。)

I've seldom found a reason to use this particular language feature, and had never given much thought to how it might cause trouble.

(我很少找到使用这种特定语言功能的理由，并且从未考虑过如何引起麻烦。)

Now, I'm curious as to how I might make effective use of with , while avoiding its pitfalls.

(现在，我很好奇，我怎么可能有效利用with ，同时避免其陷阱。)

Where have you found the with statement useful?

(你在哪里发现with语句有用吗？)

  ask by community wiki translate from so

Answer 1

Another use occurred to me today, so I searched the web excitedly and found an existing mention of it: Defining Variables inside Block Scope .

(今天我发现了另一种用法，所以我兴奋地搜索了网络，发现现在提到它： 在Block Scope中定义变量 。)

Background(背景)

JavaScript, in spite of its superficial resemblance to C and C++, does not scope variables to the block they are defined in:

(尽管JavaScript与C和C ++有着明显的相似之处，但它并没有将变量范围限定在它们定义的块中：)

var name = "Joe";
if ( true )
{
   var name = "Jack";
}
// name now contains "Jack"

Declaring a closure in a loop is a common task where this can lead to errors:

(在循环中声明闭包是一个常见的任务，可能会导致错误：)

for (var i=0; i<3; ++i)
{
   var num = i;
   setTimeout(function() { alert(num); }, 10);
}

Because the for loop does not introduce a new scope, the same num - with a value of 2 - will be shared by all three functions.

(因为for循环不引入新范围，所以三个函数将共享相同的num - 值为2 。)

A new scope: let and with(一个新的范围： let和with)

With the introduction of the let statement in ES6 , it becomes easy to introduce a new scope when necessary to avoid these problems:

(通过在ES6中引入let语句，可以在必要时引入新范围以避免这些问题：)

// variables introduced in this statement 
// are scoped to each iteration of the loop
for (let i=0; i<3; ++i)
{
   setTimeout(function() { alert(i); }, 10);
}

Or even:

(甚至：)

for (var i=0; i<3; ++i)
{
   // variables introduced in this statement 
   // are scoped to the block containing it.
   let num = i;
   setTimeout(function() { alert(num); }, 10);
}

Until ES6 is universally available, this use remains limited to the newest browsers and developers willing to use transpilers.

(在ES6普遍可用之前，这种用途仅限于最新的浏览器和愿意使用转换器的开发人员。)

However, we can easily simulate this behavior using with :

(不过，我们可以使用易于模仿这种行为with ：)

for (var i=0; i<3; ++i)
{
   // object members introduced in this statement 
   // are scoped to the block following it.
   with ({num: i})
   {
      setTimeout(function() { alert(num); }, 10);
   }
}

The loop now works as intended, creating three separate variables with values from 0 to 2. Note that variables declared within the block are not scoped to it, unlike the behavior of blocks in C++ (in C, variables must be declared at the start of a block, so in a way it is similar).

(循环现在按预期工作，创建与价值观三个独立的变量，从0到2。注意，块内声明的变量没有作用域它不像块在C行为++（在C，变量必须在开始申报一个块，所以在某种程度上它是相似的）。)

This behavior is actually quite similar to a let block syntax introduced in earlier versions of Mozilla browsers, but not widely adopted elsewhere.

(这种行为实际上与早期版本的Mozilla浏览器中引入的let块语法非常相似，但在其他地方并未广泛采用。)