比較json陣列并產生一個簡單的陣列-有解無憂

我有兩個 JSONS，我必須從中創建一個陣列

陣列1： [{ label: "HEADER" value:"header" }, { label: "FOOTER" value:"footer" }]

陣列2： [ { header: "Header 1", footer: "Footer 1" }, { header: "Header 2", footer: "Footer 2" }]

預期陣列（Array1 的標簽將是來自 Array2 Keys 的搜索條件： [["Header 1","Header 2"],["Footer 1","Footer 2"]]

uj5u.com熱心網友回復：

我理所當然地認為 array1 值只能包含 'header' | 'footer' 并且每個 array2 專案都有一個頁眉和一個頁腳屬性，因為它沒有被指定。所以它會是：

const array1 = JSON.parse(/* JSON1 file content */);
const array2 = JSON.parse(/* JSON2 file content */);

const result = array1.map(item1 => {
    const criteria = item1.label.toLowerCase();
    return array2.map(item2 => item2[criteria]);
});

uj5u.com熱心網友回復：

您可以Array.map()在 Array1 上使用，然后對于該陣列中的每個值，再次運行 .map()，回傳 Array2 中的所有匹配項。

我們會使用Array.find()和String.includes()來做到這一點。

const Array1 = [ { label: "HEADER", value:"header" }, { label: "FOOTER", value:"footer" } ]  
const Array2 = [ { header: "Header 1", footer: "Footer 1" }, { header: "Header 2", footer: "Footer 2" } ]

const result = Array1.map(({ label, value}) => { 
    return Array2.map((obj) => { 
        let key = Object.keys(obj).find(key => key.includes(value));
        if (key) return obj[key];
    })
})
console.log('Result:', result);

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

uj5u.com熱心網友回復：

let Array1=[{label:"HEADER",value:"header",},{label:"FOOTER",value:"footer",}] ,Array2=[{header:"Header 1",footer:"Footer 1"},{header:"Header 2",footer:"Footer 2"}]

let result = Array1.map(e => e.label.toLowerCase())
                   .map(s => Array2.map(n => n[s]))

console.log(result)

uj5u.com熱心網友回復：

一個簡單的 doubleArray.map會有所幫助。

邏輯

FirstArray.map將從value第一個 array回傳s arr1。
SecondArray.map將回傳第二個陣列中的元素arr2，鍵作為值來自arr1

const arr1 = [{ label: "HEADER", value: "header" }, { label: "FOOTER", value: "footer" }]
const arr2 = [{ header: "Header 1", footer: "Footer 1" }, { header: "Header 2", footer: "Footer 2" }];
const output = arr1.map(item => arr2.map(node => node[item.value]));
console.log(output);

轉載請註明出處，本文鏈接：https://www.uj5u.com/net/370403.html

標籤：javascript 打字稿

上一篇：每天下午5點的Cron作業

下一篇：如何檢查用戶是否存在于貓鼬中？