在读这篇http://www.html5rocks.com/en/tutorials/speed/v8/在运行时更改变量类型会迫使浏览器比保持它们一致时更努力地工作是有道理的。

这是否意味着这不是一个好主意:

 var x = {
   alpha:    null,
   bravo:    null,
   charlie:  null,
   delta:    null,
   echo:     null
 }

 x.alpha   = {a:1, b:true}
 x.bravo   = 13
 x.charlie = true
 x.delta   = [1,2,3]
 x.echo    = 'abc'

因为这里的类型从 null 开始，然后变成了 object、int、boolean 数组。

并且为了简单起见，之后这些类型永远不会改变。

或者这样更有效:

 var x = {
   alpha:    {},
   bravo:    0,
   charlie:  false,
   delta:    [],
   echo:     ''
 }

 x.alpha   = {a:1, b:true}
 x.bravo   = 13
 x.charlie = true
 x.delta   = [1,2,3]
 x.echo    = 'abc'

我可以理解将类型从数字更改为数组并不是一个好主意。在执行期间从 null 变为类型一次怎么样？

我读过的书籍和博客大多说，当值仅在运行时已知时，用 null(而不是未定义)定义变量。从表面上看，这似乎是错误的，因为用它们的空类型定义可以避免类型更改。

最佳答案

对这个问题很感兴趣，我设置了一个 fiddle 来查看一些不同用例的性能。

打开控制台查看这个fiddle中的数据
http://jsfiddle.net/kmiklas/MFNak/14/

• 不初始化、初始化为 null 和初始化为数字之间似乎没有什么区别。
• 除数字外，将变量初始化为预期类型会导致性能损失(原帖中的第二个示例)。
  
• 根据这些数据，按理说，初始化为空是最好的选择。

n = 100000000 的 Chrome v32 的典型结果:

number no init: 97.070ms 
number init to null: 98.023ms 
number init to number: 97.246ms 
array no init: 457.494ms 
array init to null: 458.301ms
array init to number: 455.166ms 
array init to array: 836.710ms 
object no init: 508.268ms 
object init to null: 512.312ms 
object init to object: 754.562ms 
number to object: 455.733ms 
array to object: 834.169ms 
object to array: 751.498ms 
~~~~~~~~~~~~~~~~~~~~~~~~~~~ 

代码相当冗长，但根据 SO 要求包含在下面。

n = 100000000;
console.time("number no init");
    for (var i = n; i >= 0; i--) { var x; x = 42; };
console.timeEnd("number no init");

console.time("number init to null");
    for (var i = n; i >= 0; i--) { var x = null; x = 42; };
console.timeEnd("number init to null");

console.time("number init to number");
    for (var i = n; i >= 0; i--) { var x = 1; x = 42; };
console.timeEnd("number init to number");

console.time("array no init");
    for (var i = n; i >= 0; i--) { var a; a = [42]; };
console.timeEnd("array no init");

console.time("array init to null");
    for (var i = n; i >= 0; i--) { var a = null; a = [42]; };
console.timeEnd("array init to null");

console.time("array init to number");
    for (var i = n; i >= 0; i--) { var a = 1; a = [42]; };
console.timeEnd("array init to number");

console.time("array init to array");
    for (var i = n; i >= 0; i--) { var a = []; a = [42]; };
console.timeEnd("array init to array");

console.time("object no init");
    for (var i = n; i >= 0; i--) { var a; a = {n:42}; };
console.timeEnd("object no init");

console.time("object init to null");
    for (var i = n; i >= 0; i--) { var a = null; a = {n:42}; };
console.timeEnd("object init to null");

console.time("object init to object");
for (var i = n; i >= 0; i--) { var a = {}; a = {n:42}; };
console.timeEnd("object init to object");

console.time("number to object");
    for (var i = n; i >= 0; i--) { var a = 1; a = {n:42}; };
console.timeEnd("number to object");

console.time("array to object");
    for (var i = n; i >= 0; i--) { var a = []; a = {n:42}; };
console.timeEnd("array to object");

console.time("object to array");
for (var i = n; i >= 0; i--) { var a = {}; a = [42]; };
console.timeEnd("object to array");
console.log('~~~~~~~~~~~~~~~~~~~~~~~~~~~');

编辑:

请记住，我只在 Chrome 32 中进行了测试。要准确得出这个结论，最好加载这个 fiddle 并在更流行的桌面和移动浏览器中查看结果；特别是 IE 和 Safari Mobile。

关于Javascript 声明变量 - 最佳实践，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21348218/