在纯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的源代码中使用了部分。
谢谢。
答案 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
始终是一个变量,它永远不会从外部作用域引用该函数。修复很简单:为函数或变量使用另一个名称。