关于jQuery中isNumeric 方法判断数字的深刻理解

今儿看jQuery 源码 碰到一个判断是否是数值类型的方法（网上大部分方法也是这么给的）,源码如下:

    isNumeric: function( obj ) {
        return !isNaN( parseFloat(obj) ) && isFinite( obj );
    }

现在复习一下parseFloat、isNan、isFinite,MDN定义如下:
parseFloat:
*parseFloat将它的字符串参数解析成为浮点数并返回.如果在解析过程中遇到了正负号(+或-),数字(0-9),小数点,或者科学记数法中的指数(e或E)以外的字符,则它会忽略该字符以及之后的所有字符,返回当前已经解析到的浮点数.同时参数字符串首位的空白符会被忽略.
如果参数字符串的第一个字符不能被解析成为数字,则parseFloat返回NaN.
你可以通过调用isNaN函数来判断parseFloat的返回结果是否是NaN.如果让NaN作为了任意数学运算的操作数,则运算结果必定也是NaN.
parseFloat 也可转换和返回Infinity值. 可以使用isFinite 函数来判断结果是否是一个优先的数值 (非Infinity, -Infinity, 或 NaN).*

isNaN() 函数用来判断一个值是否为 NaN。注：isNaN函数包含一些非常有意思的强制转换规则；你也可以通过 ECMAScript 6 中定义的 Number.isNaN() 或者 typeof 来判断一个值是否为非数值。

*该全局 isFinite() 函数用来判断被传入的参数值是否为一个有限数值（finite number）。在必要情况下，参数会首先转为一个数值.
你可以用这个方法来判定一个数字是否是有限数字。isFinite 方法检测它参数的数值。如果参数是 NaN，正无穷大或者负无穷大，会返回false，其他返回 true。*

当看isFinite 的定义时,我就产生了一个疑问,既然isFinite可以用来检测是否为数值,那检测完毕,在进行转换,这样岂不是更好些。然而一个忽然的灵感,有可能isFinite的效率不如parseFloat,然后就开始了进行测试。

测试的代码如下:

<div>
            <input type="text" id="testCaseCnt" />
            <input type="button" id="button1" value="测试id" onclick="test();" />
        </div>
        <script type="text/javascript">
            var jq = {
                isNumeric: function (obj) {
                    return !isNaN(parseFloat(obj)) && isFinite(obj);
                },
                isNumeric2: function (obj) {
                    return isFinite(obj) && !isNaN(parseFloat(obj));
                }
            };
            function test() {
                var cnt = parseFloat(document.getElementById("testCaseCnt").value);
                var val = "a";
                var loopCnt = 1000;
                var loopCnt2 = loopCnt;
                console.log(cnt);
                var start = startTime();
                while (loopCnt-- > 0) {
                    for (var i = 0; i < cnt; i++) {
                        jq.isNumeric(val);
                    }
                }
                var end = endTime();
                console.log(end - start);
                start = startTime();
                while (loopCnt2-- > 0) {
                    for (var i = 0; i < cnt; i++) {
                        jq.isNumeric2(val);
                    }
                }
                end = endTime();
                console.log(end - start);
            }

            function startTime() {
                return new Date().getTime(); // 开始时间
            }
            function endTime() {
                return new Date().getTime(); // 结束时间
            }
        </script>

测试的结果如下:

10000
 534
 615

 100000
 5407
 5980

1000000
 55815
 60098

 10000000
 552414
 613564

通过以上的几组测试,完全可以证明parseFloat的效率比isFinite的效率微高。我想这也是jQuery为什么采用把isFinite放到后面的原因。通过这样一个细节也告诉我很小的知识点也需要我们进行推究验证,多问问自己优秀的源码为何这样写,平时要多看,多思考。这样获得的知识才是我们自己的。记住:不要害怕问为什么？

参考文档:
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/parseFloat

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/isNaN