Analysis of the most correct method to determine whether a JavaScript object is available_javascript skills

原文：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，而且这段脚本肯定不会被执行。

There is also a commonly used detection for window.focus. This is a method (a command you tell JavaScript what to do). If we want to use this method, we must first check whether the browser supports this method.

The correct way to detect whether a function exists is as follows. Remember not to add parentheses after the function:

if (window.focus)

The meaning of the above code is: "Whether the browser supports the window.focus function", while the meaning of the following code is different:

if (window.focus())

This code is to judge the result of focus, and it has been assumed that the browser supports the focus method. If it does not support it, an exception will be reported at this time. After adding the parentheses, the function is actually executed, which is not what we want. Therefore, do not add parentheses when testing, but only add parentheses to execute this function after the test passes. For example, the following example:

if (window.focus) window.focus()

Key points

The whole point of the above discussion is: in JavaScript, if you want to use document.images, first determine whether document.images is supported. If you want to use the window.focus method, first determine whether the browser supports this method.

If you always check objects before using them, your scripts will not generate exceptions similar to the problem, and the code you pay is just some functions that are blocked in some browsers.

Translator’s Note:

Any war will bring many side effects. The situation introduced in this article mainly occurred during the browser war. Just like the Cold War, it caused many remaining problems. However, the subsequent implementation of the ecma-262 standard alleviated this situation somewhat. However, it is clearly stipulated in the third edition of ecma-262 that each company is allowed to extend it. The result of the extension is naturally incompatibility. Naturally, this article must be used method to judge. Simply put, we just don't have to judge all objects now. If a browser announces support for the ecma-262 standard, at least we know which objects don't need to be judged, which can be considered a comfort.