在 JS 中循环循环一个对象 - util 函数 #1

目前，我正在开发一些个人项目，我认为分享一些我需要的代码以及我一路上学到的一些东西是个好主意，所以我将分享更多很快。我希望你也觉得它很有用！ ？

今天我与您分享一个实用函数来帮助您循环遍历嵌套对象，在对象的每次迭代中您可以运行回调并获取有用的数据。

用例示例：

• 过滤或排序对象的数据
• 帮助您浏览以对象表示的三个 UI 目录
• 处理 UI 中的嵌套选项
• 处理类别和子类别
• 从数据库中提取数据时循环数据

LoopObj实用函数

您只需复制并粘贴这些函数即可

/**
 * Loops an object recurrently
 * @param {Object} obj the object to be looped
 * @param {Function} callback a function that will run on each iteration
 */
function loopObj(obj, callback, path = [], nestLevel = 0){
  // validate params (`path` and `nestLevel` are added automatically)
  if(getType(obj) != "object"){
    throw TypeError("The `obj` argument is not an object")
  }
  if(getType(callback) != "function"){
    throw TypeError("The `callback` argument is not a function")
  }

  // Loop the object
  for (let key in obj){
    // Run the callback
    callback(key, obj[key], obj, path, nestLevel)
    // Loop a nested object
    if(getType(obj[key]) == "object") loopObj(obj[key], callback, [...path, key], nestLevel + 1)
  }
}

/**
 * A method to detect data types more accurately
 * Credits: Chris Ferdinandi, https://gomakethings.com/
 * @param {*} data the data to be verified
 * @returns {String} the data type
 */
function getType(data){
  return Object.prototype.toString.call(data).toLowerCase().slice(8, -1)
}

/**
 * License: MIT, https://opensource.org/license/mit
 * Copyright (c) 2024 Rodrigo Isaias Calix
 */

使用方法：

示例片段：

// example object
const products = {
  computers: {
    laptop: 20,
    desktop: 15,
    mini: 8
  },
  cameras: 20,
  externalDevices: {
    keyboard: {
      usb: 45,
      bluetooth: 25,
    }
  }
}

// calling the function
loopObj(products, (key, value, obj, path, nestLevel)=>{
  console.log(key, value, path, nestLevel)
});

这将输出如下内容：

调用loopObj函数时，您必须传递要循环的对象作为第一个参数，第二个参数是回调。在每次迭代中，回调将按以下顺序传递 5 个参数：

• key (string), 对象当前的键属性
• value（任意），该属性的值（例如嵌套对象或它具有的任何其他值）
• obj (object)，当前正在循环的对象（可以是父对象，也可以是嵌套对象）
• path (array)，当前循环item的路径
• NestLevel（数字），从0（根）开始，它告诉你当前循环的级别有多深。

如果您觉得这有用，我将在 DEV 上分享更多类似的内容！

您也可以在 X 上找到我：https://x.com/schemetastic

记得保存以供日后使用？

以上是在 JS 中循环循环一个对象 - util 函数 #1的详细内容。更多信息请关注PHP中文网其他相关文章！