当前位置:首页 > JavaScript

js 实现each

2026-03-01 02:05:41JavaScript

实现 each 函数的方法

在 JavaScript 中,each 函数通常用于遍历数组或对象的元素。以下是几种常见的实现方式:

js 实现each

遍历数组的 each 函数

function each(array, callback) {
  for (let i = 0; i < array.length; i++) {
    callback(array[i], i, array);
  }
}

遍历对象的 each 函数

function each(object, callback) {
  for (let key in object) {
    if (object.hasOwnProperty(key)) {
      callback(object[key], key, object);
    }
  }
}

通用 each 函数(支持数组和对象)

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

使用示例

// 数组示例
each([1, 2, 3], function(item, index) {
  console.log(index + ': ' + item);
});

// 对象示例
each({a: 1, b: 2}, function(value, key) {
  console.log(key + ': ' + value);
});

注意事项

  • 回调函数的参数顺序通常为 (value, key/index, collection)
  • 对象遍历时使用 hasOwnProperty 检查以避免遍历原型链上的属性
  • 可以使用 breakreturn false 来提前终止遍历(需在实现中添加相应逻辑)

标签: jseach
分享给朋友:

相关文章

js实现轮播图

js实现轮播图

基础轮播图实现 使用HTML、CSS和JavaScript实现一个简单的自动轮播图。HTML结构包含一个容器和多个图片项。 <div class="slider"> <div…

js实现继承

js实现继承

原型链继承 通过将子类的原型指向父类的实例实现继承。子类实例可以访问父类原型上的属性和方法。 function Parent() { this.name = 'parent'; } Parent…

js 进度条的实现

js 进度条的实现

使用 HTML 和 CSS 创建基础进度条 HTML 结构可以简单使用一个 div 元素作为容器,内部嵌套另一个 div 表示进度: <div class="progress-containe…

js实现延迟

js实现延迟

实现延迟的方法 在JavaScript中,实现延迟操作有多种方式,以下是几种常见的方法: 使用setTimeout函数 setTimeout是JavaScript中最常用的延迟执行方法。它接受一个回…

js实现tab选项卡切换

js实现tab选项卡切换

实现Tab选项卡切换的JavaScript方法 使用纯JavaScript实现Tab切换功能,可以通过监听点击事件动态切换内容显示状态。以下是两种常见实现方式: 基础DOM操作实现 /…

js实现防洪

js实现防洪

防抖(Debounce)实现 防抖的核心思想是在事件触发后延迟执行回调函数,若在延迟时间内再次触发事件,则重新计时。适用于输入框搜索、窗口调整等场景。 function debounce(f…