2012-11-22 52 views
1
(function() { 

    var content = [ 
     { 
      title: 'My awesome blog post', 
      thumbnail: 'images/bane.jpg', 
     }, 
     { 
      title: 'My second awesome blog post', 
      thumbnail: 'images/joker.jpg', 
     }, 
    ], 
     template = $.trim($('#blogTemplate').html()), 
     frag = ''; 

    $.each(content, function(index, obj) { 
     frag += 
      template.replace(/{{title}}/ig, obj.title) 
        .replace(/{{thumbnail}}/ig, obj.thumbnail);  
    }); 

    $('body').append(frag); 

})(); 

你好的理解,增加變量的作用域和聲明

我只是想知道爲什麼它是被裝在自調用匿名函數內的代碼塊不能使用var前綴以下變量聲明關鍵字像這樣:

var template = $.trim($('#blogTemplate').html()), 
    var frag = ''; 

添加var關鍵字的局部變量在這個函數 - templatefrag似乎打破我的代碼,我真的不明白爲什麼,但是如果我宣佈templatefrag在全局作用域之外,如下所示,那麼我的代碼就可以工作。

var template; 
var frag; 

如果這涉及範圍和任何人有時間來解釋它將不勝感激。理想情況下,我想用var關鍵字的前綴templatefrag來提高可讀性。

+1

您是否在匿名函數之外使用template/frag? – sroes

+1

只需要學習語法檢查你的代碼。在對象和數組中有拖尾逗號(將在IE中斷開)並且不能用逗號分隔2'var' – charlietfl

+0

否我不在匿名函數之外使用template/frag – user1554264

回答

3

我懷疑這是代碼中斷的變量聲明之間的逗號,而不是本身使用var關鍵字。試試這個:

var template = $.trim($('#blogTemplate').html()), 
frag = ''; 

var關鍵字已經被應用在您提供的第一個片段,以模板和片段,因爲他們是在局部變量聲明逗號分隔列表中的第二項和第三項。

function(){ 
    var x = 1, 
     y = 2, 
     z = 3; 
    window.x; //undefined 
    x; //1 
    window.y;//undefined 
    y; //2 
} 

做到這一點,最徹底的方法是完全避免的語法糖,和每個變量聲明分離成單獨的語句:

var content = [ 
    { 
     title: 'My awesome blog post', 
     thumbnail: 'images/bane.jpg', 
    }, 
    { 
     title: 'My second awesome blog post', 
     thumbnail: 'images/joker.jpg', 
    } 
]; 
var template = $.trim($('#blogTemplate').html()); 
var frag = ''; 
+0

是的,您應該替換變量之間的所有逗號帶分號的聲明 – devnull69

0

你並不需要var它們添加前綴:

var a, b, c; 

已經是等同於:

var a; 
var b; 
var c; 
0

它們已經是本地的,並且在它們前面有var - 注意使所有變量成爲單個聲明和定義列表的逗號,您似乎沒有注意到這一點,因爲它們沿着幾行分開:

var content = [ /* multi-line array */ ], template = $.trim($('#blogTemplate').html()), frag = ''; 

自然地,在列表內部添加更多var是不好的語法。