Usage of Object.values() (merging data in the same field into the children field)

1. Official definition

The Object.values() method returns an array of all enumerable property values ​​of the given object itself, in the same order as using a for...in loop (the difference is that a for-in loop enumerates the properties in the prototype chain).

2. Grammar

Object.values(obj)

Parameters: obj is an object that returns enumerable property values .

Return value: An array containing all enumerable property values ​​of the object itself .

Description: Object.values() returns an array whose elements are the enumerable property values ​​found on the object. The order of the properties is the same as that given by manually looping through the object's property values .

3. Examples

Example 1:

 let testObj = { name: '小橙', age: '18', height: '177' }
      const list = Object.values(testObj)
      console.log('测试数据', list)

Example two:

let testObj = {
        xq: { name: '小橙', age: '18', height: '177' },
        xw: { name: '小W', age: '18', height: '177' },
      }
      const list = Object.values(testObj)
      console.log('测试数据', list)
/*得到
[
    {
        "name": "小橙",
        "age": "18",
        "height": "177"
    },
    {
        "name": "小W",
        "age": "18",
        "height": "177"
    }
]

*/

Example 3: (emphasis on use)

// 可以配合循环归类出你想要的字段 比如type相同的数据合并成一个children
let testObj = [
        { type: '测试1', name: '小橙', age: '18', height: '177' },
        { type: '测试1', name: '小W', age: '11', height: '177' },
        { type: '测试2', name: '小E', age: '12', height: '177' },
        { type: '测试3', name: '小R', age: '13', height: '177' },
        { type: '测试2', name: '小T', age: '14', height: '177' },
        { type: '测试3', name: '小Y', age: '19', height: '177' },
        { type: '测试4', name: '小U', age: '20', height: '177' },
      ]
      const list = this.getSortOutList(testObj)
      console.log('测试数据', list)

   methods: {
      getSortOutList(data) {
        let newObj = {}
        data.forEach((item, index) => {
          // 解构出每一个对象里面type字段的值
          let { type } = item
          // 如果在这个新对象里面没有找到,则新增一个对象
          if (!newObj[type]) {
            // 重构对象
            newObj[type] = {
              type,
              children: [],
            }
          }
          // 如果在对象里面找到有相同的 type 字段的值,则Push进入children里面
          newObj[type].children.push(item)
        })
        let newArr = Object.values(newObj)
        return newArr
      },
   }

/*得到的数据
[
    {
        "type": "测试1",
        "children": [
            {
                "type": "测试1",
                "name": "小橙",
                "age": "18",
                "height": "177"
            },
            {
                "type": "测试1",
                "name": "小W",
                "age": "11",
                "height": "177"
            }
        ]
    },
    {
        "type": "测试2",
        "children": [
            {
                "type": "测试2",
                "name": "小E",
                "age": "12",
                "height": "177"
            },
            {
                "type": "测试2",
                "name": "小T",
                "age": "14",
                "height": "177"
            }
        ]
    },
    {
        "type": "测试3",
        "children": [
            {
                "type": "测试3",
                "name": "小R",
                "age": "13",
                "height": "177"
            },
            {
                "type": "测试3",
                "name": "小Y",
                "age": "19",
                "height": "177"
            }
        ]
    },
    {
        "type": "测试4",
        "children": [
            {
                "type": "测试4",
                "name": "小U",
                "age": "20",
                "height": "177"
            }
        ]
    }
]

*/

Guess you like

Origin blog.csdn.net/weixin_42125732/article/details/132837866