纯JavaScript每个功能都不起作用

时间:2014-02-03 02:53:07

标签: javascript jquery each

在纯JavaScript中,我正在尝试创建jQuery.each函数。到目前为止,我刚刚从查询源代码中复制了部分。

这是我到目前为止所做的:

var class2type = {
    "[object Boolean]": "boolean",
    "[object Number]": "number",
    "[object String]": "string",
    "[object Function]": "function",
    "[object Array]": "array",
    "[object Date]": "date",
    "[object RegExp]": "regexp",
    "[object Object]": "object",
    "[object Error]": "error"
},
core_toString = class2type.toString;
function type(obj) {
    if (obj == null) {
        return String(obj);
    }
    return typeof obj === "object" || typeof obj === "function" ? class2type[core_toString.call(obj)] || "object" : typeof obj;
}
function isWindow(obj) {
    return obj != null && obj == obj.window;
}
function isArraylike(obj) {
    var length = obj.length,
        type = type(obj);

    if (isWindow(obj)) {
        return false;
    }

    if (obj.nodeType === 1 && length) {
        return true;
    }

    return type === "array" || type !== "function" && (length === 0 || typeof length === "number" && length > 0 && (length - 1) in obj);
}

function each( obj, callback, args ) {
    var value,
        i = 0,
        length = obj.length,
        isArray = isArraylike( obj );
    if ( args ) {
        if ( isArray ) {
            for ( ; i < length; i++ ) {
                value = callback.apply( obj[ i ], args );

                if ( value === false ) {
                    break;
                }
            }
        } else {
            for ( i in obj ) {
                value = callback.apply( obj[ i ], args );

                if ( value === false ) {
                    break;
                }
            }
        }
    } else {
        if ( isArray ) {
            for ( ; i < length; i++ ) {
                value = callback.call( obj[ i ], i, obj[ i ] );

                if ( value === false ) {
                    break;
                }
            }
        } else {
            for ( i in obj ) {
                value = callback.call( obj[ i ], i, obj[ i ] );

                if ( value === false ) {
                    break;
                }
            }
        }
    }
    return obj;
}

它应该可以正常工作,但是当我尝试运行以下代码时:

each([1, 2], function( index, value ) {
  alert( index + ": " + value );
});

我收到以下错误: TypeError:'undefined'不是函数(评估'type(obj)')这里指的是:

23| function isArraylike(obj) {
24|     var length = obj.length,
25|     type = type(obj);

为什么这段代码不起作用?我只是直接从jQuery的源代码中使用了部分。

谢谢。

1 个答案:

答案 0 :(得分:3)

问题在于变量提升和阴影。你有一个type函数在当前范围之外,你希望在第25行的语句中它是一个用作函数的函数,然后将结果传递给具有相同名称的局部变量:

function type () {};

function isArraylike(){
  var type = type(1);
};

事实上,由于变量提升,代码看起来像是:

function type() {};

function isArraylike(){
  var type; // type is undefined here
  type = type(1);
};

因此,您可以看到在整个isArraylike函数中,type始终是一个变量,它永远不会从外部作用域引用该函数。修复很简单:为函数或变量使用另一个名称。