从数组中提取数据到它自己的数组中

Question

我在数组中有以下数据。

tempAttachments:Array[2]
  0:Object
    _id:"12345-678910"
    bytes:412051
    file:File
    size:411532
    title:"someFile.csv"
    headers: Array[3]
        0: optionOne
        1: undefined
        2: optionTwo
        3: undefined
        4: undefined
        5: optionThree
    type:"file"
    fileType:"typeOne"
  1:Object
    _id:"9999-2222"
    bytes:12345
    file:File
    size:23456
    title:"anotherFile.csv"
    headers: Array[3]
        0: optionOne
    type:"file"
    fileType:"typeTwo"

有两个元素我感兴趣，那就是 _id 和 headers 数组。我试图以这样的方式结束

Array
(
  [0] => Array
  (
     [id] => 12345-678910
     [optionOne] => 0
     [optionTwo] => 2
     [optionThree] => 5
  )
  [1] => Array
  (
     [id] => 9999-2222
     [optionOne] => 0
  )
)

因此，本质上，三个选项的 ID 和索引与它们在文件中的列相关。问题是，一个文件最多可以有三个选项（使用上面的名称）但是，它们可能只有一个或两个。

所以我就这样开始了

const payload = {}

this.tempAttachments.forEach(function (attachment, index) {
  payload[index] = {
    id: attachment._id
  }
})

我不确定的是如何映射选项的索引，如果它们存在，将键设置为它们的名称。实现此目标的最佳方法是什么？

谢谢

Answer 1

像这样：

const tempAttachments = [{
    _id: "12345-678910",
    bytes: 412051,
    file: 'File',
    size: 411532,
    title: "someFile.csv",
    headers: [
        'optionOne',
        undefined,
        'optionTwo',
        undefined,
        undefined,
        'optionThree'
    ],
    type: "file",
    fileType: "typeOne"
}, {
    _id: "9999-2222",
    bytes: 12345,
    file: 'File',
    size: 23456,
    title: "anotherFile.csv",
    headers: [
        'optionOne',
        'optionTwo',
        'optionThree'
    ],
    type: "file",
    fileType: "typeTwo",
}];

const output = tempAttachments.reduce((akku, item) => {
    let akkuItem = {
        id: item._id,
    };
    item.headers.forEach((value, index) => {
        if(typeof value !== 'undefined') {
            akkuItem[value] = index;
        }
    });
    akku.push(akkuItem);
    return akku;
}, []);
console.log(output);

Answer 2

这是 environment/setting map (here: create a new type from each attachment type) and reduce 的经典组合方法（此处：create/collect 新选项数据仅适用于有效的 header/option 项) ...

const tempAttachments = [{
  _id: "12345-678910",
  bytes: 412051,
  file: "File",
  size: 411532,
  title: "someFile.csv",
  headers: [
    "optionOne",
    undefined,
    "optionTwo",
    undefined,
    undefined,
    "optionThree"
  ],
  type:"file",
  fileType:"typeOne"
}, {
  _id: "9999-2222",
  bytes: 12345,
  file: "File",
  size: 23456,
  title: "anotherFile.csv",
  headers: [
    "optionOne"
  ],
  type: "file",
  fileType: "typeTwo"
}];


function collectValidOptionData(collector, optionItem, idx) {
  // if (optionItem != null) {
  //  collector[String(optionItem)] = idx
  // }
  if (typeof optionItem === 'string') {
    collector[optionItem] = idx;
  }
  return collector;
}

function createOptionTypeFromAttachment(attachmentType) {
  return attachmentType.headers.reduce(collectValidOptionData, {
    id: attachmentType._id
  });
}


console.log(
  'tempAttachments.map(createOptionTypeFromAttachment) : ',
  tempAttachments.map(createOptionTypeFromAttachment)
);

.as-console-wrapper { min-height: 100%!important; top: 0; }

Answer 3

一种简洁的方法是使用 Array.map 方法，它从另一个数组创建一个新数组。

（更多信息：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map）

下面的代码会将 tempAttachments 转换为新格式，其中基于此结构：

[
  {
    id: AttachmentID
    optionName: optionIndex
    optionName: optionIndex
    ...
  }
]

它只会添加有值的选项，忽略 undefined 个选项。

解决方案：

const payload = tempAttachments.map(attachment => {
  const newAttachment = {
    id: attachment._id,
  }

  attachment.headers.forEach((option, index) => {
    if (option) {
      newAttachment[option] = index;
    }
  })

  return newAttachment;
})

从数组中提取数据到它自己的数组中

Extract data from Array into it's own array

javascript

arrays

mapping

reduce

data-structures