我认为对象文字的使用很有趣，就像使用闭包的一个插入式替换

for(var i = nodes.length; i--;)
{
       // info is namespaced in a closure the click handler can access!
       (function(info)
       {           
            nodes[i].onclick = function(){ showStuff(info) };
       })(data[i]);
}

或者与闭包等价的with语句

for(var i = nodes.length; i--;)
{
       // info is namespaced in a closure the click handler can access!
       with({info: data[i]})
       {           
            nodes[i].onclick = function(){ showStuff(info) };
       }        
}

我认为真正的风险是不小心操纵不属于with语句的变量，这就是为什么我喜欢将对象文字传递给with，你可以确切地看到它将在代码中添加的上下文中。

对代理对象使用“with”语句

我最近想为babel写一个支持宏的插件。我想有一个单独的变量名称空间来保存我的宏变量，我可以在这个空间中运行我的宏代码。此外，我想检测宏代码中定义的新变量(因为它们是新的宏)。

首先，我选择了vm模块，但我发现vm模块中的全局变量，如Array, Object等与主程序不同，我无法实现模块并要求与该全局对象完全兼容(因为我无法重构核心模块)。最后，我找到了“with”语句。

const runInContext = function(code, context) {
    context.global = context;
    const proxyOfContext = new Proxy(context, { has: () => true });
    let run = new Function(
        "proxyOfContext",
        `
            with(proxyOfContext){
                with(global){
                        ${code}
                }
            }
        `
    );
    return run(proxyOfContext);
};

这个代理对象捕获所有变量的搜索，并说:“yes, I have that variable.”如果代理对象实际上没有该变量，则将其值显示为undefined。

这样，如果在宏代码中使用var语句定义了任何变量，我可以在上下文对象中找到它(如vm模块)。但是用let或const定义的变量只在该时间内可用，不会保存在context对象中(vm模块保存它们，但不公开它们)。

性能:该方法性能优于vm.runInContext。

安全:如果你想在沙箱中运行代码，这在任何方面都不安全，你必须使用vm模块。它只提供一个新的名称空间。

我一直使用with语句作为范围导入的简单形式。假设您有某种标记构建器。而不是写:

markupbuilder.div(
  markupbuilder.p('Hi! I am a paragraph!',
    markupbuilder.span('I am a span inside a paragraph')
  )
)

你可以这样写:

with(markupbuilder){
  div(
    p('Hi! I am a paragraph!',
      span('I am a span inside a paragraph')
    )
  )
}

对于这个用例，我没有做任何赋值，所以我没有与之相关的歧义问题。

今天我想到了另一个用法，所以我兴奋地在网上搜索了一下，发现了一个已有的提及:在块作用域内定义变量。

背景

尽管JavaScript表面上与C和c++相似，但它并不将变量作用于定义变量的块:

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

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

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

因为for循环没有引入新的作用域，所以相同的num(值为2)将由所有三个函数共享。

一个新的范围:let and with

随着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);
}

甚至:

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);
}

在ES6普及之前，这种使用仍然局限于最新的浏览器和愿意使用编译器的开发人员。然而，我们可以很容易地模拟这种行为使用:

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);
   }
}

循环现在按预期工作，创建了三个值从0到2的独立变量。注意，在块内声明的变量不局限于它，这与c++中块的行为不同(在C中，变量必须在块的开始声明，所以在某种程度上是类似的)。这种行为实际上非常类似于早期版本的Mozilla浏览器中引入的let块语法，但在其他地方没有被广泛采用。

它很适合将在相对复杂的环境中运行的代码放入容器中:我使用它来为“窗口”创建本地绑定，从而运行用于web浏览器的代码。

我认为在将模板语言转换为JavaScript时，with语句可以派上用场。例如base2中的JST，但我更经常看到它。

我同意不使用with语句就可以编程。但因为它不会带来任何问题，所以它是一种合法的使用。