判斷JavaScript對象是否可用的最正確方法分析

原文：http://www.quirksmode.org/js/support.html
原文作者：Peter-Paul Koch

以下為對原文的翻譯：

判斷對象存在的方法

很快你就會注意到，JavaScript的部分功能在部分瀏覽器中無效。如果你要使用一些指令碼的進階特性，你首先要檢查瀏覽器是否支援要使用的對象，本文具體說明判斷的正確方法。

通過判斷瀏覽器的版本：不！

如果你想知道瀏覽器是否支援代碼中使用的那些對象，記住，永遠都不要通過瀏覽器的版本來判斷。我確定你知道，有些瀏覽器支援你的代碼，而有些瀏覽器不支援你的代碼，可是你考慮過其他的瀏覽器嗎？那些不知名的小瀏覽器？

就算你可以檢測出90%的使用者所使用的瀏覽器及版本，還是有一些不出名的瀏覽器不能正確運行你的代碼，結果要麼是一大堆異常資訊，要麼是某些指令碼沒有被正確的執行。不管是哪種情況，你都是在使用漏洞百出的代碼欺騙最終瀏覽網站的使用者。

個案研究：mouseovers

一個古老的個案可以證實上述的說法。雖然這種情況現在已經不存在，但是同樣原理的例子還是存在的。

一個公認的事實就是IE 3不支援document.images這個數組，但這個數組對mouseover指令碼又是極為重要。所以我們就應該禁止mouseover指令碼在IE 3瀏覽器中執行。解決方案之一就是對瀏覽器進行判斷，當判斷出使用者使用的瀏覽器是IE 3的時候，就不執行這個函數。

但是，在大多數作業系統中，Netscape 2瀏覽器同樣不支援document.images數組。如果你僅僅判斷瀏覽器是不是IE 3，那麼使用Netscape 2的使用者就會看到一大堆異常資訊。

那為什麼不連同Netscape 2一起檢測呢？因為就算這樣做也是無事於補。

運行在OS/2上的Netscape 2是和Netscape 3完全相容的，而且可以很好的處理mouseover效果。儘管如此，大家為什麼還會經常看不到這個效果呢？因為web開發人員使用了瀏覽器檢測的手段，在 mouseover指令碼中屏蔽了Netscape 2瀏覽器。因此開發人員們，在沒有充足理由的情況下，剝奪了使用者擁有良好互動體驗的權利。合適的對象檢測方法可以避免這種情況的發生。

最後，越來越多的瀏覽器允許使用者把瀏覽器的認證字串修改為自己喜歡的內容，這樣就存在很大的可能性，檢測不出使用者真實使用的瀏覽器以及版本，自然就不能保證無故障的運行代碼了。由此，web開發人員再次剝奪了使用者額外互動效果的權利。更糟的是，這樣的代碼通常寫的很爛。

既然瀏覽器的版本不可靠，那麼是否JavaScript的版本更加可信一些呢？

通過判斷JavaScript的版本：不！

在最初規劃的時候，Netscape完全意識到未來的瀏覽器會支援比現在多得多的對象，而web開發人員必須能夠把新老瀏覽器區分開來。

起初的計劃是讓開發人員對瀏覽器的版本進行判斷。比如某某瀏覽器只能支援JavaScript 1.x等。在script標籤中增加version屬性，這樣如果瀏覽器不支援相應版本的JavaScript，自然就不會執行這段指令碼。

但是，當Microsoft涉足瀏覽器市場後，這個想法就無法進行下去了。儘管早在Netscape 4和IE 4的時候就都支援JavaScript 1.2，可是就算再有想象力的人也不會相信他們支援的是相同的JavaScript 1.2。因為這個版本號碼已經過時了，而且肯定和對象檢測不相干。

所以不要使用JavaScript的版本號碼來做什麼，他們沒什麼實際的作用。

正確的方法：對象判斷

相反，我們只需通過簡單的方法來判斷瀏覽器是否支援要使用的對象（或者是方法、數組或者屬性）。我們還是使用mouseover這個例子。這段指令碼依賴於document.images這個數組，所以最重要的事情當然是判斷瀏覽器是否支援他，下面是具體的做法：

if (document.images)
{
do something with the images array
}

現在你有了一個完全的保障，運行這段代碼的瀏覽器肯定支援這段指令碼。條件陳述式判斷document.image這個數組是否存在，如果返回true，那麼這段指令碼將會被執行，反之如果這個數組不存在，將會返回false，而且這段指令碼肯定不會被執行。

還有一個常用的檢測是針對window.focus的。這是一個方法（一條你告訴JavaScript要去做什麼的命令）。如果我們要使用這個方法，我們必須首先檢測瀏覽器是否支援這個方法。

檢測函數是否存在的正確方法如下，牢記千萬不要在函數後面加括弧：

if (window.focus)

上面這段代碼的含義是：“瀏覽器是否支援window.focus這個函數”，而下面這段代碼的含義不同：

if (window.focus())

這段代碼是對focus的結果進行判斷，而且已經假設瀏覽器是支援focus方法的，而如果不支援，這時候就會報異常了。加了括弧以後實際上執行了函數，而這並不是我們想要的狀況。所以檢測的時候不要加括弧，而只有在檢測通過後才加上括弧執行這個函數。比如下面這個例子：

if (window.focus) window.focus()

重點

以上討論的所有重點就是：在JavaScript中，如果你要使用document.images，首先判斷是否支援document.images。如果你要使用window.focus方法，首先判斷是否瀏覽器是否支援這個方法。

如果你總是在使用對象前進行檢測，你的指令碼將不會產生類似問題的異常，付出的代碼只是有些功能在部分瀏覽器中被屏蔽掉了而已。

譯者註：

任何戰爭都是會帶來很多副作用的，本文所介紹的情況主要是發生在瀏覽器大戰的時候的，就像冷戰一樣，造成了很多遺留的問題。但是後來ecma- 262標準的實施，讓這種情況得到些許緩和，可是在ecma-262第三版中明確規定，允許各家自己對其進行擴充，擴充的結果自然就是不相容，自然要使用 本文的方法進行判斷。索性，我們現在只是不用判斷所有的對象，如果一個瀏覽器宣布支援ecma-262標準，至少我們知道哪些對象不用判斷，也算是一種慰 藉吧。