是否值得優化用常量替換字符串的Javascript代碼？

Question

我經常使用jquery，有時候我的代碼包含很多重復的css類名，比如：

$('#div1').addClass('funny-class');
...
$('#div2').addClass('funny-class');
...
$('#div1').removeClass('funny-class');

等...我問自己是否值得使用偽常量清理代碼，如：

var constants = {
    FUNNY: 'funny-class'
}
...
$('#div1').addClass(cnst.FUNNY);
$('#div2').addClass(cnst.FUNNY);
$('#div1').removeClass(cnst.FUNNY);

第一：最小化。 如果“常量”是局部變量（隱藏在范圍內），則最小化器可能會將“constants.FUNNY”的出現替換為像“aB”這樣最小化的東西。

第二：速度。 帶有“常量”的代碼比第一個快嗎？

你怎么看？

Answer 1

您可以使用Google的閉包編譯器和高級優化來識別通常重復的字符串，並用常量變量引用替換它們。 但這種優化是微不足道的; 如果你想改進你的代碼，你可以通過緩存jQuery對象獲得更好的改進（這是許多程序員經常忽略的事情）：

var $div1 = $('#div1');
var $div2 = $('#div2');
$div1.addClass('funny-class');
$div2.addClass('funny-class');
$div1.removeClass('funny-class');

Answer 2

它可能不像性能那樣明顯，但使用常量而不是字符串總是一個好習慣，因為您可以通過更改常量的值來輕松修改值。

Answer 3

1. 是的，minifier可能會減少constants.FUNNY變量，因為它可能無法檢測到'funny-class'的重復使用並將其分配給變量。

2. 速度差異很小，你不應該在意。 一方面，你必須解決范圍鏈中的變量（非常快），但另一方面你必須創建一個String原語（也很快）。

擁有constants對象的好處是，如果您決定更改所分配的類的名稱，則只需在一個地方執行，而不是3; 這是你應該考慮的唯一好處......不是0.0000000000000001秒速差。

Answer 4

將它放在變量中可以為您提供一定量的“中央控制”而不是性能。

但是，將它們深深地放在一個物體中會導致性能下降。 盡可能將它們靠近表面，以避免范圍分辨率的開銷。 （這是最小的，但仍然是開銷）

//this one is so deep:
constants.foo.bar.baz.bam

//this is just 1 level deep:
constants.bam

另外，我更擔心你正在制作的jQuery調用

//two calls to #div1!
$('#div1').addClass(cnst.FUNNY);       //$() for div1
$('#div2').addClass(cnst.FUNNY);
$('#div1').removeClass(cnst.FUNNY);    //another $() for div1

//do this instead
var div1 = $('#div1')             //reference div1 once in a local variable

div1.addClass(cnst.FUNNY);        //use the reference to the object
$('#div2').addClass(cnst.FUNNY);
div1.removeClass(cnst.FUNNY);     //use the same reference to the object