JavaScript Array、Object、数组树结构转换、对象等的数据转换和处理总结
JS对象传递给数组Object.entries ()方法，该方法返回特定对象本身的可枚举属性的键值对数组。 该数组与使用for…in循环遍历对象时返回的顺序匹配。 不同之处在于，for-in循环还枚举了原型链中的属性。
Array.prototype.map方法创建新数组。 因此，数组中的每个元素都是调用一次提供的函数后的返回值。
如果我们有城市的数据，这个数据记录了城市的某个值。 后端通常返回简单的数据格式。 例如：
let cityObj={ shenzhen: 31，光州： 29 }如果需要在饼图中使用，则必须更改为数组格式cityArr，如下所示
如果letcityarr=[ { city name : ' shenzer '，value: 31}，{cityName: 'guangzhou '，value: 29}]属性很少，请使用.
letcityarr=[ city name : ' shenzen '，value: cityObj.shenzhen}，{cityName: 'guangzhou '，value3360cityoou} 或者，也可以封装它，放入自己的工具函数。
下面例举两种方式去完成这个对象转数组。
使用object.entries array.prototype.map对象转换数组
let cityObj={ //对象数据shenzhen: 31、光洲：29 }//functionobjtoarr (data，typeName，valueName )//object . valueName] )=(typename，valuename ) ) )，解[key，value] )并返回/的valueName: valueName}格式
let cityObj={ //对象数据shenzhen: 31、光洲：29 }//functionobjtoarr (data，typeName，valueName )//object . ]//.map(key=(typename:key， value name : data [ key ] )遍历keys以取出key和value data[key]，然后返回//的valueName: valueName} )格式返回对象
Array.prototype.map方法创建新数组。 因此，数组中的每个元素都是调用一次提供的函数后的返回值。
如果需要将饼图上的数据cityArr传递到后端，请将数据简化为cityObj，如下所示：
letcityarr=[ city name : ' Shenzhen '，value: 31}，{cityName: 'guangzhou '， value :29 } ] letcityobj={ city name 3360 }光州：29 }因为有object.entries和Object.fromEntries，所以object.fromenes
使用 Object.fromEntries + Array.prototype.map 数组转对象
let cityArr=[ //数组数据{ cityName: 'shenzhen '
, value: 31 }, { cityName: 'guangzhou', value: 29 }]// 封装function arrToObj(data, typeName, valueName) { // data.map(item => ([item.typeName, item.valueName])) 先把数据转成 [[key, value], ...] // Object.fromEntries() 相当于 Object.entries() 逆方法 // 然后返回 {typeName: valueName} 格式 return Object.fromEntries(data.map(item => ([item[typeName], item[valueName]])))}arrToObj(cityArr, 'cityName', 'value') JS 一维数组转、树形结构数组相互转换如果有用到权限树或者文件模块，一般都少不了从后端拿回来的数据做一维数组转树形结构，或者传输给后端时需要树形结构转一位数组扁平化，除非你和后端有亲密关系，不然的话这些都是需要前端自己来做处理。
例如，我们需要将 dataArr 转成 dataTree
let dataArr = [ { id: 1, pid: 0 }, { id: 2, pid: 1 }]let dataTree = [ { id: 1, pid: 0, children: [ { id: 2, pid: 1 children: [] } ] }] 递归方法转树形结构数据 计算量大不会改变原有数据 let data = [ // 如果后端跟你没有亲密关系，你拿到的数据就是列表 { id: 1, pid: 0 }, { id: 2, pid: 0 }, { id: 3, pid: 1 }, { id: 4, pid: 2 }, { id: 5, pid: 3 }, { id: 6, pid: 4 }, { id: 7, pid: 5 }, { id: 8, pid: 6 },]function arrToTreeData(data, pidVal = 0, pidName = 'pid', childName = 'children') { // 一般 pid 就是 parentId，指的是父级 id，这里默认是 pid // 一般 pidVal 的值为 0 时，默认是根节点 // childName 在大多数表格，多级嵌套等组件里通常都是用 children 命名，这里默认是 children let result = [] // 初始化 // 递归匹配，计算量较大 data.forEach(item => { if (item[pidName] === pidVal) { result.push({ ...item, [childName]: arrToTreeData(data, item.id) }) } }) return result}arrToTreeData(data) 对象引用法转树形结构数据 计算量小不使用深拷贝则会改变原始数据 let data = [ // 如果后端跟你没有亲密关系，你拿到的数据就是列表 { id: 1, pid: 0 }, { id: 2, pid: 0 }, { id: 3, pid: 1 }, { id: 4, pid: 2 }, { id: 5, pid: 3 }, { id: 6, pid: 4 }, { id: 7, pid: 5 }, { id: 8, pid: 6 },]function arrToTreeData(data, pidName = 'pid', childName = 'children') { // 一般 pid 就是 parentId，指的是父级 id，这里默认是 pid // childName 在大多数表格，多级嵌套等组件里通常都是用 children 命名，这里默认是 children let obj = {} // 初始化 let result = [] // 初始化 // 将数据以对象的格式先存起来 data.forEach(item => { obj[item.id] = item }) for (let i = 0; i < data.length; i++) { let item = data[i] // 这里去 obj 里找，如果没有找到那就是 undefined，说明这个当前 item 是根节点 let parent = obj[item[pidName]] if (parent) { (parent[childName] || (parent[childName] = [])).push(item) } else { result.push(item) } } return result}arrToTreeData(data) 广度法树形结构数据扁平化 不使用深拷贝则会改变原始数据 function cutTree(data, childName = 'children') { let result = []; while (data.length != 0) { let shift = data.shift(); let children = shift[childName] delete shift[childName] result.push(shift) if (children) { children.forEach(item => { data.push(item) }) } } return result} 欢迎指导交流