嗨，伙計們，我很困惑試圖解決這個問題，所以任何幫助都會很棒！
我有兩個陣列，我需要一個特定的物件。源陣列：
1-Types (1D): ['dev', 'env', 'othr']
2-Services (2D): (3) [Array(3), Array(4), Array(6)]
Array(3)
0: "'1':'Option 11'"
1: "'2':'Option 12'"
2: "'3':'Option 13'"
Array(4)
0: "'5':'Option 21'"
1: "'6':'Option 22'"
2: "'7':'Option 23'"
3: "'4':'Option 24'"
Array(6)
0: "'8':'Option 31'"
1: "'9':'Option 32'"
2: "'10':'Option 33'"
3: "'11':'Option 34'"
4: "'12':'Option 35'"
5: "'13':'Option 36'"
期望的結果是這種結構：
servData = {
"dev": {
"1": "Option 11",
"2": "Option 12",
"3": "Option 13"
},
"env": {
"4": "Option 21",
"5": "Option 22",
"6": "Option 23",
"7": "Option 24"
},
"othr": {
"8": "Option 31",
"9": "Option 32",
"10": "Option 33",
"11": "Option 34",
"12": "Option 35",
"13": "Option 36"
}
};
uj5u.com熱心網友回復：
OP 提供的字串化條目陣列似乎格式錯誤……例如"1':'Option 11'"，該部分缺少或可有可無的單引號key，而不是"'1':'Option 11'"（帶單引號）或"1:'Option 11'"（關鍵部分不帶單引號）。
因此，下面介紹的方法使用捕獲正則運算式，/^'?(?<key>.*?)'?\s*:\s*'?(?<value>.*?)'?$/以便清理（或更確切地說是不可知）每個提供的基于字串的key配置value。
該方法本身使用了Array.prototype.reduce兩次。
外部reduce確實將屬性或專案名稱串列propertyName與傳遞的條目一起處理 -config它具有每個屬性名稱相關的字串鍵值對陣列。
內部reduce確實處理了這樣一個陣列，從字串中檢索key和檢索，value并基于此資料為該值分配一個新條目，在外部reduce，該值被分配給新創建的propertyName相關條目。
function createEntryFromKeyAndEntriesConfig(
{ config = [], result = {} },
propertyName,
idx,
) {
// see ... [https://regex101.com/r/DQbrRM/3]
const regXKeyValue =
/^'?(?<key>.*?)'?\s*:\s*'?(?<value>.*?)'?$/;
result[propertyName] = config[idx]
.reduce((obj, entryString) => {
const { key = '', value = '' } = regXKeyValue
.exec(entryString)
?.groups;
obj[key] = value;
return obj;
}, {});
return { config, result };
}
const entriesConfig = [[
"1':'Option 11'",
"2':'Option 12'",
"3':'Option 13'",
], [
"5':'Option 21'",
"6':'Option 22'",
"7':'Option 23'",
"4':'Option 24'",
], [
"8':'Option 31'",
"9':'Option 32'",
"10':'Option 33'",
"11':'Option 34'",
"12':'Option 35'",
"13':'Option 36'",
]];
const propertyNames = ['dev', 'env', 'othr'];
const { result: servData } = propertyNames
.reduce(createEntryFromKeyAndEntriesConfig, {
config: entriesConfig,
result: {},
});
console.log({ servData });.as-console-wrapper { min-height: 100%!important; top: 0; }uj5u.com熱心網友回復：
您的資料確實需要一些清理。注意：資料已更新并.map(a => a.replace(/'/g,''))已添加以洗掉所有內容'。
使用Array#map和Array#reduce如下：
const keys = ['dev', 'env', 'othr'],
input = [ [ "'1':'Option 11'", "'2':'Option 12'", "'3':'Option 13'" ], [ "'5':'Option 21'", "'6':'Option 22'", "'7':'Option 23'", "'4':'Option 24'" ], [ "'8':'Option 31'", "'9':'Option 32'", "'10':'Option 33'", "'11':'Option 34'", "'12':'Option 35'", "13:'Option 36'" ] ],
output = keys.reduce(
(o, key,i) =>
({
...o,
[key]: input[i].map(a => a.replace(/'/g,'')).reduce(
(acc,cur) =>
({...acc,[cur.split(':')[0]]:cur.split(':')[1]}),{})
}),{}
);
console.log( output );為了以'編程方式清除，尤其是:使用以下代碼之后的代碼：
const keys = ['dev', 'env', 'othr'],
input = [ [ "'1':'Option 11'", "'2':'Option 12'", "'3':'Option 13'" ], [ "'5':'Option 21'", "'6':'Option 22'", "'7':'Option 23'", "'4':'Option 24'" ], [ "'8':'Option 31'", "'9':'Option 32'", "'10':'Option 33'", "'11':'Option 34'", "'12':'Option 35'", "'13':'Option 36'" ] ],
output = input.map(s => s.map(e => e.replace(/'/g,'').split(':')))
.reduce(
(o, arr,i) =>
({...o, [keys[i]]: arr.reduce((acc,[k,v]) => ({...acc,[k]:v}), {})}),{}
);
console.log( output );請注意，正如@PeterSeliger 所指出的，'全域替換可能會產生意想不到的后果。例如，如果您有一個值，例如"'14':'Option's Best'"will become "14:Options Best"。所以考慮一種更有針對性的方法。也許使用 ofFunction(...)()可以避免替換所有''s 的需要。請看下面的演示：
const keys = ['dev', 'env', 'othr'],
input = [ [ "'1':'Option 11'", "'2':'Option 12'", "'3':'Option 13'" ], [ "'5':'Option 21'", "'6':'Option 22'", "'7':'Option 23'", "'4':'Option 24'" ], [ "'8':'Option 31'", "'9':'Option 32'", "'10':'Option 33'", "'11':'Option 34'", "'12':'Option 35'", "'13':'Option 36'" ] ],
output = input
.reduce(
(o, arr,i) =>
({
...o,
[keys[i]]: arr.reduce(
(acc,cur) =>
({...acc,...Function(`return {${cur}}`)()}), {})
}),{}
);
console.log( output );uj5u.com熱心網友回復：
用這個：
const itemNames = ["dev", "env", "othr"];
const items = [
["'1':'Option 11'", "'2':'Option 12'", "'3':'Option 13'"],
["'5':'Option 21'", "'6':'Option 22'", "'7':'Option 23'", "'4':'Option 24'"],
[
"'8':'Option 31'",
"'9':'Option 32'",
"'10':'Option 33'",
"'11':'Option 34'",
"'12':'Option 35'",
"'13':'Option 36'"
]
];
const value = itemNames
.map((value, index) => ({ index, value }))
.reduce((p, el) => {
p[el.value] = {};
items[el.index].forEach((e) => {
let [op, ...va] = e.split(":");
op = op.substring(1, op.length - 1);
va = va.join(":");
va = va.substring(1, va.length - 1);
const ar = va;
p[el.value][parseInt(op)] = ar;
});
return p;
}, {});
console.log(value);.as-console-wrapper { min-height: 100%!important; top: 0; }轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/466264.html
標籤：javascript 数组 数据结构 映射 减少