ค้นหาเว็บไซต์

javascript - แปลงอ็อบเจ็กต์เป็นอาเรย์ด้วย lodash


ฉันจะเปลี่ยน object ขนาดใหญ่เป็น array ด้วย lodash ได้อย่างไร?

var obj = {
  22: {name:"John", id:22, friends:[5,31,55], works:{books:[], films:[],}
  12: {name:"Ivan", id:12, friends:[2,44,12], works:{books:[], films:[],}
}

// transform to 
var arr = [{name:"John", id:22...},{name:"Ivan", id:12...}]

คำตอบ #1

คุณทำได้

var arr = _.values(obj);

สำหรับเอกสารดูได้ที่นี่

คำตอบ #2

โซลูชันพื้นบ้านสมัยใหม่หากมีใครสนใจ:

const arr = Object.keys(obj).map(key => ({ key, value: obj[key] }));

หรือ (ไม่ใช่ IE):

const arr = Object.entries(obj).map(([key, value]) => ({ key, value }));

คำตอบ #3

_.toArray(obj);

ผลลัพธ์เป็น:

[
  {
    "name": "Ivan",
    "id": 12,
    "friends": [
      2,
      44,
      12
    ],
    "works": {
      "books": [],
      "films": []
    }
  },
  {
    "name": "John",
    "id": 22,
    "friends": [
      5,
      31,
      55
    ],
    "works": {
      "books": [],
      "films": []
    }
  }
]"

คำตอบ #4

สำหรับฉัน วิธีนี้ใช้ได้ผล:

_.map(_.toPairs(data), d => _.fromPairs([d]));

มันหมุน

{"a":"b", "c":"d", "e":"f"} 

เข้าไปใน

[{"a":"b"}, {"c":"d"}, {"e":"f"}]

คำตอบ #5

มีหลายวิธีทีเดียวที่จะได้ผลลัพธ์ที่คุณต้องการ มาลองแบ่งพวกมันออกเป็นหมวดหมู่กัน:

เฉพาะค่า ES6:

วิธีหลักสำหรับเรื่องนี้คือ Object.values แต่การใช้ Object.keys และ Array.map ก็สามารถได้ผลลัพธ์ตามที่คาดไว้เช่นกัน:

Object.values(obj)
Object.keys(obj).map(k => obj[k])

var obj = {
  A: {
    name: "John"
  },
  B: {
    name: "Ivan"
  }
}

console.log('Object.values:', Object.values(obj))
console.log('Object.keys:', Object.keys(obj).map(k => obj[k]))

คีย์ & ค่าของ ES6:

การใช้ map และคุณสมบัติ dynamic/computed ของ ES6 และ destructuring คุณสามารถเก็บคีย์และส่งคืนวัตถุจาก map ได้

Object.keys(obj).map(k => ({[k]: obj[k]}))
Object.entries(obj).map(([k,v]) => ({[k]:v}))

var obj = {
  A: {
    name: "John"
  },
  B: {
    name: "Ivan"
  }
}

console.log('Object.keys:', Object.keys(obj).map(k => ({
  [k]: obj[k]
})))
console.log('Object.entries:', Object.entries(obj).map(([k, v]) => ({
  [k]: v
})))

เฉพาะค่าของ Lodash:

วิธีที่ออกแบบมาสำหรับเรื่องนี้คือ _.values อย่างไรก็ตามก็มี "ทางลัด" เช่น _.map และเมธอดยูทิลิตี้ _.toArray ซึ่งก็จะคืนค่าเป็นอาร์เรย์ที่มี เฉพาะค่าจากอ็อบเจกต์ ด้วยเช่นกัน คุณยังสามารถใช้ _.map ผ่าน _.keys และดึงค่าจากอ็อบเจกต์โดยใช้โน้ตชัน obj[key]

หมายเหตุ: _.map เมื่อส่งผ่านอ็อบเจ็กต์จะใช้ตัวจัดการ baseMap ซึ่งโดยพื้นฐานแล้วคือ forEach บนคุณสมบัติของอ็อบเจ็กต์

_.values(obj)
_.map(obj)
_.toArray(obj)
_.map(_.keys(obj), k => obj[k])

var obj = {
  A: {
    name: "John"
  },
  B: {
    name: "Ivan"
  }
}

console.log('values:', _.values(obj))
console.log('map:', _.map(obj))
console.log('toArray:', _.toArray(obj))
console.log('keys:', _.map(_.keys(obj), k => obj[k]))
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.10/lodash.min.js"></script>

คีย์ & ค่าของ Lodash:

// Outputs an array with [[KEY, VALUE]]
_.entries(obj)
_.toPairs(obj)

// Outputs array with objects containing the keys and values
_.map(_.entries(obj), ([k,v]) => ({[k]:v}))
_.map(_.keys(obj), k => ({[k]: obj[k]}))
_.transform(obj, (r,c,k) => r.push({[k]:c}), [])
_.reduce(obj, (r,c,k) => (r.push({[k]:c}), r), [])

var obj = {
  A: {
    name: "John"
  },
  B: {
    name: "Ivan"
  }
}

// Outputs an array with [KEY, VALUE]
console.log('entries:', _.entries(obj))
console.log('toPairs:', _.toPairs(obj))

// Outputs array with objects containing the keys and values
console.log('entries:', _.map(_.entries(obj), ([k, v]) => ({
  [k]: v
})))
console.log('keys:', _.map(_.keys(obj), k => ({
  [k]: obj[k]
})))
console.log('transform:', _.transform(obj, (r, c, k) => r.push({
  [k]: c
}), []))
console.log('reduce:', _.reduce(obj, (r, c, k) => (r.push({
  [k]: c
}), r), []))
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.10/lodash.min.js"></script>

โปรดสังเกตว่าในตัวอย่างข้างต้นใช้ ES6 (ฟังก์ชันลูกศรและคุณสมบัติไดนามิก) คุณสามารถใช้ lodash _.fromPairs และวิธีอื่น ๆ เพื่อสร้างอ็อบเจ็กต์หาก ES6 เป็นปัญหาได้

คำตอบ #6

ถ้าคุณต้องการให้คีย์ (ในกรณีนี้คือ id) ถูกเก็บไว้เป็นคุณสมบัติของแต่ละรายการในอาร์เรย์ คุณสามารถทำได้

const arr = _(obj) //wrap object so that you can chain lodash methods
            .mapValues((value, id)=>_.merge({}, value, {id})) //attach id to object
            .values() //get the values of the result
            .value() //unwrap array of objects

คำตอบ #7

อ็อบเจ็กต์เป็นอาเรย์

จากคำตอบทั้งหมด ฉันคิดว่าคำตอบนี้ดีที่สุด:

let arr = Object.entries(obj).map(([key, val]) => ({ key, ...val }))

ที่เปลี่ยนแปลง:

{
  a: { p: 1, q: 2},
  b: { p: 3, q: 4}
}

ถึง :

[
  { key: 'a', p: 1, q: 2 }, 
  { key: 'b', p: 3, q: 4 }
]

อาร์เรย์เป็นวัตถุ

เพื่อแปลงกลับ:

let obj = arr.reduce((obj, { key, ...val }) => { obj[key] = { ...val }; return obj; }, {})

เพื่อแปลงกลับโดยเก็บคีย์ไว้ในค่า:

let obj = arr.reduce((obj, { key, ...val }) => { obj[key] = { key, ...val }; return obj; }, {})

จะให้:

{
  a: { key: 'a', p: 1, q: 2 },
  b: { key: 'b', p: 3, q: 4 }
}

สำหรับตัวอย่างสุดท้าย คุณยังสามารถใช้ lodash _.keyBy(arr, 'key') หรือ _.keyBy(arr, i => i.key) ได้เช่นกัน

บทความที่เกี่ยวข้อง