本文探讨JavaScript中with语句在跨Frame场景下的变量引用问题。通过实际案例揭示当目标Frame存在同名变量时，with内部变量解析优先匹配默认对象，导致外部局部变量被遮蔽的Bug。文章解析了JScript的变量搜索规则，并提供了避免此类作用域冲突的调试建议。
with语句的语法糖与跨Frame应用
在脚本编程中使用with语句，可以显著缩短多级对象引用的代码长度，这是JScript提供的一种语法糖。虽然不使用with语句而通过临时变量也能达到相同效果，但为临时变量命名往往令人头疼。就连MASM高版本也提供了@@（以及@F和@B）来处理临时标号问题，可见开发者普遍倾向于简化命名工作。
我也倾向于使用with语句，因为它能简化代码并提高清晰度，尤其在处理跨Frame的变量引用时更为便捷。然而，今天我就因贪图方便而遇到了一个棘手的Bug，在with块中获取跨Frame变量时，花费了大量时间排查一个看似莫名其妙的错误。
跨Frame变量引用导致的Bug案例
代码逻辑并不复杂：在一个with块中，对另一个Frame中的变量进行引用和计算，并将结果赋值给当前页面函数的局部变量。示例代码大致如下：
var hierarchies = [];
with(parent.frames['xxxFrame'])
{
// 引用xxxFrame里的变量和值产生我要的东西
hierarchies.push(xxx);
}
// 开始使用hierarchies
此时，hierarchies数组的表现出乎意料，无论怎样调整，其内部值始终与预期存在差异，但并非完全错误（后续将解释原因，这也是导致Debug过程极其困惑的关键点）。
变量遮蔽与JScript搜索规则解析
问题根源在于：xxxFrame中也存在一个名为hierarchies的变量，且同样为数组，其内容与我在外部定义的数组内容相似。这解释了为何Debug过程如此令人困惑。此外，由于之前曾成功使用类似的with语句跨页面获取数据，潜意识里误认为with块内的hierarchies就是with外部的局部变量。尽管不记得xxxFrame中的变量是否由自己定义，但Debug过程确实令人沮丧。
JScript手册指出，with(objects) statements的作用是为语句设定默认对象。然而，在with内部对变量的作用范围遵循特定的搜索规则：优先在默认对象（objects）中进行匹配。尽管默认对象的作用域看似“更远”（如跨Frame情况），但当默认对象引用中无法匹配变量时，才会匹配with之前声明过的变量。若两者均无法匹配，则变量值为undefined。
本文仅作为“Debug中的滑铁卢”案例收录，旨在提醒开发者注意with语句在复杂作用域下的潜在风险。