js 循环数组取值

简介: js 循环数组取值

需要循环的数据
image.png

js将数组转换成树形结构
实验代码:

toTree(data) {
   
      let result = []
      if (!Array.isArray(data)) {
   
        return result
      }
      data.forEach(item => {
   
        delete item.children;
      });
      let map = {
   };
      data.forEach(item => {
   
        map[item.itemId] = item;
      });
      for (item in map) {
   
        // let parent = map[item.pid];
        // if (map[item.pid] && item.id !== item.pid) {
   
        //   if (!item.children) {
   
        //     item.children = []
        //   }
        //   if (!item.pid._level) {
   
        //     item.pid._level = 1
        //   }
        //   item._level = temp[item.pid]._level + 1
        //   item.pid.children.push(item)
        // } else {
   
        //   res.push(item)
        // }

        console.log(item);
        // if (parent) {
   
        //   (parent.children || (parent.children = [])).push(item);
        // } else {
   
        //   result.push(item);
        // }
      }
      return result;
    },

已验证代码:

/**
 * 树形数据转换
 * @param {*} data
 * @param {*} id
 * @param {*} pid
 */
export function treeDataTranslate(data, id = 'itemId', pid = 'parentId') {
   
  var res = []
  var temp = {
   }
  for (var i = 0; i < data.length; i++) {
   
    temp[data[i][id]] = data[i]
  }
  for (var k = 0; k < data.length; k++) {
   
    if (temp[data[k].pid] && data[k][id] !== data[k].pid) {
   
      if (!temp[data[k].pid]['children']) {
   
        temp[data[k].pid]['children'] = []
      }
      if (!temp[data[k].pid]['_level']) {
   
        temp[data[k].pid]['_level'] = 1
      }
      data[k]['_level'] = temp[data[k].pid]._level + 1
      temp[data[k].pid]['children'].push(data[k])
    } else {
   
      res.push(data[k])
    }
  }
  return res
}

/**
 * 按指定字段分类,树形数据转换
 * @param {*} data
 * @param {*} id
 * @param {*} pid
 */
export function treeDataTranslateByType(oldData, id = 'funID', pid = 'pid', key = 'funID', Type = 'projectId', hasChildren = true) {
   
  var res = []
  var temp = {
   }
  var data = []
  oldData.map(function(item) {
   
    data.push(item)
  })
  for (var i = 0; i < data.length; i++) {
   
    var type = data[i][Type] ? data[i][Type] : ''
    temp[type + '' + data[i][key] + '' + data[i][id]] = data[i]
  }
  for (var k = 0; k < data.length; k++) {
   
    var tempKey = ''
    oldData.map(function(item) {
   
      if (item[id] === data[k][pid] && item[Type] === data[k][Type] && item[key] < data[k][key]) {
   
        var type = item[Type] ? item[Type] : ''
        tempKey = type + '' + item[key] + '' + item[id]
      }
    })
    if (temp[tempKey] && data[k][id] !== data[k][pid]) {
   
      if (!temp[tempKey]['children']) {
   
        temp[tempKey]['children'] = []
      }
      if (!temp[tempKey]['_level']) {
   
        temp[tempKey]['_level'] = 1
      }
      if (hasChildren) {
   
        data[k]['_level'] = temp[tempKey]._level + 1
        temp[tempKey]['children'].push(data[k])
      } else {
   
        data[k]['children']
      }
    } else {
   
      res.push(data[k])
    }
  }
  return res
}
相关文章
|
16天前
|
JavaScript 前端开发
JavaScript基础知识-流程控制之while循环
这篇文章介绍了JavaScript中的while循环和do...while循环的基础知识,并通过一个实际案例演示了如何使用while循环计算投资增长到特定金额所需的年数。
31 2
JavaScript基础知识-流程控制之while循环
|
6天前
|
JavaScript
js 解析 byte数组 成字符串
js 解析 byte数组 成字符串
|
15天前
|
JavaScript 前端开发
JavaScript基础知识-数组的遍历
关于JavaScript数组遍历基础知识的文章。
27 2
JavaScript基础知识-数组的遍历
|
15天前
|
JavaScript 前端开发
JavaScript基础知识-forEach循环
关于JavaScript基础知识中forEach循环的介绍。
23 1
JavaScript基础知识-forEach循环
|
15天前
|
JavaScript 前端开发
JavaScript基础知识-数组的练习
关于JavaScript基础知识中数组操作的练习,主要介绍了如何从一个包含Person对象的数组中过滤出成年人(年龄达到18岁及以上)并将他们放入一个新的数组中。
25 1
JavaScript基础知识-数组的练习
|
15天前
|
JavaScript 前端开发
JavaScript基础知识-数组的常用方法
关于JavaScript基础知识-数组的常用方法。
14 1
JavaScript基础知识-数组的常用方法
|
15天前
|
JavaScript 前端开发 索引
JavaScript基础知识-数组基于索引访问
关于JavaScript数组基于索引访问的基础知识介绍。
13 1
JavaScript基础知识-数组基于索引访问
|
15天前
|
JavaScript 前端开发
JavaScript基础知识-数组的定义方式
本文介绍了JavaScript中数组的多种定义方式。
11 1
JavaScript基础知识-数组的定义方式
|
6天前
|
JavaScript 前端开发
JavaScript while 循环
JavaScript while 循环
11 3
|
11天前
|
存储 JavaScript 前端开发
JS中的数组有哪些常用操作函数和属性
【9月更文挑战第7天】JS中的数组有哪些常用操作函数和属性
9 1