我試圖new Map()從一個物件陣列中推送到一個減少的陣列，但由于某種原因，它只推送每個陣列的兩個專案。
const data = [
{
keyword: 'engines',
url: 'google.com',
},
{
keyword: 'engines',
url: 'duckduckgo.com',
},
{
keyword: 'pc',
url: 'mac.com',
},
{
keyword: 'pc',
url: 'linux.com',
},
{
keyword: 'pc',
url: 'windows.com',
}
]
let urls = []
const mapper = data.reduce((acc, obj) => {
urls.push(obj.url)
if (!acc.has(obj.keyword)) {
acc.set(obj.keyword, urls )
} else {
urls = []
}
return acc
}, new Map())
console.log(mapper).as-console-wrapper { max-height: 100% !important; top: 0; }預期產出
Map(2) {
'engines' => [ 'google.com', 'duckduckgo.com'],
'pc' => [ 'mac.com', 'linux.com', 'windows.com']
}
我什至不知道為什么該片段在 stackoverflow 上不起作用，它在編輯器上運行良好。
uj5u.com熱心網友回復：
我用這個修復了它，但感覺不對
const data = [ { keyword: 'engines', url: 'google.com', }, { keyword: 'engines', url: 'duckduckgo.com', }, { keyword: 'pc', url: 'mac.com', }, { keyword: 'pc', url: 'linux.com', }, { keyword: 'pc', url: 'windows.com', } ]
let urls = []
const mapper = data.reduce((acc, obj) => {
if (!acc.has(obj.keyword)) {
urls = []
}
urls.push(obj.url)
acc.set(obj.keyword, urls )
return acc
}, new Map())
console.log(mapper)uj5u.com熱心網友回復：
這會給你正確的輸出。
您需要為每個關鍵字使用一個新陣列；否則，您將共享一個物件并在進行時破壞它。
StackOverflow 的 REPL 在使用時不會Map像瀏覽器那樣輸出內容console.log，所以我使用了一種變通方法來顯示資料。
const data = [
{
keyword: 'engines',
url: 'google.com',
},
{
keyword: 'engines',
url: 'duckduckgo.com',
},
{
keyword: 'pc',
url: 'mac.com',
},
{
keyword: 'pc',
url: 'linux.com',
},
{
keyword: 'pc',
url: 'windows.com',
}
]
const mapper = data.reduce((acc, obj) => {
if (!acc.has(obj.keyword)) {
acc.set(obj.keyword, [] )
}
let urls = acc.get(obj.keyword)
urls.push(obj.url);
return acc;
}, new Map())
/**
Expected output per OP:
Map(2) {
'engines' => [ 'google.com', 'duckduckgo.com'],
'pc' => [ 'mac.com', 'linux.com', 'windows.com']
}
*/
console.log([...mapper.entries()]).as-console-wrapper { max-height: 100% !important; top: 0; }uj5u.com熱心網友回復：
試試這個代碼
const data = [
{
keyword: 'engines',
url: 'google.com',
},
{
keyword: 'engines',
url: 'duckduckgo.com',
},
{
keyword: 'pc',
url: 'mac.com',
},
{
keyword: 'pc',
url: 'linux.com',
},
{
keyword: 'pc',
url: 'windows.com',
}
]
const mapper = data.reduce((acc, obj) => {
if (acc.has(obj.keyword)) {
acc.set(obj.keyword,[...acc.get(obj.keyword), obj.url] )
} else {
acc.set(obj.keyword, [obj.url])
}
return acc
}, new Map())
/**
Expected output per OP:
Map(2) {
'engines' => [ 'google.com', 'duckduckgo.com'],
'pc' => [ 'mac.com', 'linux.com', 'windows.com']
}
*/
console.log(mapper)
uj5u.com熱心網友回復：
這是一個緊湊的實作，將產生您的輸出
data.reduce(
(a, o) => a.set(o.keyword, [...a.get(o.keyword) || [], o.url]),
new Map()
)
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/480971.html
標籤：javascript 数组