解決JavaScript中名稱衝突的最佳方法是什麼？

Question

我最近寫了一些JavaScript代碼，基於一些XML填充下拉列表，非常簡單的東西。問題是我不得不編寫類似的代碼來在不同的頁面上做幾乎相同的事情。

由於代碼幾乎相同，我將大部分函數命名爲相同，認爲它們永遠不會包含在同一頁中。但是，命名衝突產生的原因是兩個JavaScript文件最終都包含在同一個HTML頁面中。

當我不得不返回並更改名稱時，我只是將first_或second_添加到方法的名稱中。這是一種痛苦，對我來說看起來並不高雅。我想知道是否有更好的方法來解決JavaScript中的名稱衝突？

Answer 1

嘗試在各種庫中使用的JavaScript module pattern（或名稱空間）。

試着幹掉（不要重複自己），這樣可以避免名稱衝突。如果代碼幾乎相同，則最好通過創建可處理這兩種情況的函數來避免代碼重複。該函數可以採用兩個參數：哪個下拉列表填充以及哪些數據。這也有助於可維護性。

更新：我假設你從AJAX請求中獲取XML。在這種情況下，您可以使用循環內的適當回調參數創建動態匿名函數。

Answer 2

我想看看如何將兩段代碼（函數？）合併到一個函數中。如果你需要填充一個列表框，然後將列表框ID傳遞給函數，所以你不是硬編碼，只能在一個單一的控件上操作...

我在我的火箭業務的網站上做過我以不同的延遲值銷售火箭發動機，但本質上它們是同一產品，只是不同的延遲值。

也許這可能會試圖解釋我想說的是什麼......如果圖像文件碰巧缺失，它會顯示一個「無圖像」圖像來代替真實圖像。

function goBlank(image) 
{ 
    if(image) { 
    var imgobj = document[image]; 
    imgobj.src="/images/blank.png"; 
    } 
} 

在這種情況下，你把它叫做：

<img src="/images/aerotech.png" name="header" onError="goBlank('header');"> 

如果您需要的是，象，讓我知道列表框更多的例子。也許甚至會發布你的一些示例代碼。

Answer 3

另一種選擇（如果可能的話）是仔細將代碼綁定到元素本身。

例如

<input type="text" name="foo" id="foo" value="World" onchange="this.stuff('Hello ' + this.value);"/> 
<script> 
    document.getElementById('foo').stuff = function(msg){ 
    //do whatever you want here... 
    alert('You passed me: ' + msg); 
    }; 
</script>