js实现 $.each

$.each 的实现方法

在 JavaScript 中，$.each 是 jQuery 中的一个常用方法，用于遍历数组或对象。以下是几种实现方式：

原生 JavaScript 实现

使用原生 JavaScript 可以实现类似 $.each 的功能。以下是一个简单的实现：

function each(collection, callback) {
  if (Array.isArray(collection)) {
    for (let i = 0; i < collection.length; i++) {
      callback.call(collection[i], i, collection[i]);
    }
  } else {
    for (let key in collection) {
      if (collection.hasOwnProperty(key)) {
        callback.call(collection[key], key, collection[key]);
      }
    }
  }
}

使用 Array.prototype.forEach

对于数组，可以直接使用 Array.prototype.forEach 方法：

[1, 2, 3].forEach(function(item, index) {
  console.log(index, item);
});

使用 Object.keys 和 forEach

对于对象，可以结合 Object.keys 和 forEach 实现遍历：

const obj = { a: 1, b: 2 };
Object.keys(obj).forEach(function(key) {
  console.log(key, obj[key]);
});

使用 ES6 的 for...of 和 for...in

ES6 提供了更简洁的语法来遍历数组和对象：

// 数组
const arr = [1, 2, 3];
for (const item of arr) {
  console.log(item);
}

// 对象
const obj = { a: 1, b: 2 };
for (const key in obj) {
  if (obj.hasOwnProperty(key)) {
    console.log(key, obj[key]);
  }
}

注意事项

• 如果是数组，确保使用 Array.isArray 检查类型。
• 如果是对象，使用 hasOwnProperty 避免遍历原型链上的属性。
• 回调函数的参数顺序通常是 (index, value) 或 (key, value)。

以上方法可以根据实际需求选择使用。