js 实现each
JavaScript 实现 each 方法
在 JavaScript 中,可以通过多种方式实现类似 jQuery 的 each 方法,用于遍历数组或对象。
遍历数组的 each 方法
function each(array, callback) {
for (let i = 0; i < array.length; i++) {
callback(array[i], i, array);
}
}
// 使用示例
const arr = [1, 2, 3];
each(arr, function(item, index) {
console.log(`元素: ${item}, 索引: ${index}`);
});
遍历对象的 each 方法
function eachObject(obj, callback) {
for (let key in obj) {
if (obj.hasOwnProperty(key)) {
callback(obj[key], key, obj);
}
}
}
// 使用示例
const obj = { a: 1, b: 2, c: 3 };
eachObject(obj, function(value, key) {
console.log(`键: ${key}, 值: ${value}`);
});
通用的 each 方法
可以创建一个同时处理数组和对象的通用 each 方法:
function each(collection, callback) {
if (Array.isArray(collection)) {
for (let i = 0; i < collection.length; i++) {
callback(collection[i], i, collection);
}
} else if (typeof collection === 'object' && collection !== null) {
for (let key in collection) {
if (collection.hasOwnProperty(key)) {
callback(collection[key], key, collection);
}
}
}
}
// 使用示例
each([1, 2, 3], function(item) {
console.log(item);
});
each({ a: 1, b: 2 }, function(value, key) {
console.log(key, value);
});
在原型上扩展 each 方法
可以在数组和对象的原型上扩展 each 方法:

Array.prototype.each = function(callback) {
for (let i = 0; i < this.length; i++) {
callback(this[i], i, this);
}
};
Object.prototype.each = function(callback) {
for (let key in this) {
if (this.hasOwnProperty(key)) {
callback(this[key], key, this);
}
}
};
// 使用示例
[1, 2, 3].each(function(item) {
console.log(item);
});
{ a: 1, b: 2 }.each(function(value, key) {
console.log(key, value);
});
注意事项
- 使用
hasOwnProperty检查可以避免遍历到原型链上的属性 - 在原型上扩展方法可能会与其他库冲突,需谨慎使用
- 回调函数的参数顺序可以自定义,通常为
(value, index/key, collection)






