array.filter正在回傳整個物件，而不僅僅是一個值

我有一個過濾陣列的簡單函式。

我只想要字串值，而不是整個物件。

為什么整個物件都回來了，而不僅僅是字串？

如果我將回傳切換到 console.log()，我會得到所需的輸出

有任何想法嗎？

這是代碼

 const Array2 = [
        { header: 'First name', HeaderIndex: 0},
        { header: 'Last name', HeaderIndex: 1},
        { header: 'Company', HeaderIndex: 2},
        { header: 'Favorite food', HeaderIndex: 3},
        { header: 'Favorite color', HeaderIndex: 4},
    ]

const testing = Array2.filter((obj) => { if(obj.HeaderIndex === 1) { return obj.header } } )

console.log(testing)

// gives undesired output

[{…}]
0: {header: 'Last name', HeaderIndex: 1}
length: 1
[[Prototype]]: Array(0)



const testing = Array2.filter((obj) => { if(obj.HeaderIndex === 1) { console.log(obj.header)} } )

// gives desired output

"Last name"

我有問題的輸出如下，我只想回傳字串

[{…}]
0: {header: 'Last name', HeaderIndex: 1}
length: 1
[[Prototype]]: Array(0)

更新*

我接受了 Mayur 的回答，因為它在更大的用例中解決了我的問題。下面是我更大的用例，我需要根據需要匹配來自 Array2 的 HeaderIndex 的 Array1 索引來合并這兩個陣列

const Array1 = [ 
    ['Alex', 'Boe', 'MeowWolf', 'pizza', 'pink'],
    ['Arron', 'Coe', 'Kmart', 'tofu', 'purple'],
    ['Jane', 'Doe', 'Sears', 'tacos', 'orange'],
    ['John', 'Eoe', 'YugiOh', 'blueberries', 'magenta'],
    ['Suzie', 'Boe', 'Toyota', 'steroids', 'blue']
    ]
    
    
    const Array2 = [
        { header: 'First name', HeaderIndex: 0},
        { header: 'Last name', HeaderIndex: 1},
        { header: 'Company', HeaderIndex: 2},
        { header: 'Favorite food', HeaderIndex: 3},
        { header: 'Favorite color', HeaderIndex: 4},
    ]

const testResult = Array1.map((arr) => arr.map((string) => { return  {"ChosenHeader": Array2.filter((obj) => obj.HeaderIndex === arr.indexOf(string))[0]?.header, "content": string}} ))

console.log(testResult)


// desired output



0: {ChosenHeader: 'First name', content: 'Alex'}
1: {ChosenHeader: 'Last name', content: 'Boe'}
2: {ChosenHeader: 'Company', content: 'MeowWolf'}
3: {ChosenHeader: 'Favorite food', content: 'pizza'}
4: {ChosenHeader: 'Favorite color', content: 'pink'}

uj5u.com熱心網友回復：

因為filter()總是回傳一個陣列。你想從回傳陣列中過濾。使用[0].header你可以做到！

試試這個代碼它的作業

 const testing = Array2.filter((obj) => obj.HeaderIndex === 1)[0].header;
    console.log(testing, 'testing')

uj5u.com熱心網友回復：

陣列過濾器方法總是回傳一個帶有結果的新陣列。在第二個測驗的示例中，當您 console.log 時，您將在函式內列印此結果，但如果您 console.log 變數（測驗），您還應該有一個像第一個測驗中一樣的陣列。

您應該做的是在回傳新陣列后，使用 forEach、地圖或僅訪問具有索引的元素（如果您總是只有一個結果，您總是可以使用 testing[0] ）。

uj5u.com熱心網友回復：

在 .filter() 之后使用 .map()：

const testing = Array2.filter((obj) => obj.HeaderIndex === 1).map(x => x.header);

我認為在你的情況下最好使用 .find() 而不是 .filter() 像：

const testing = (Array2.find((obj) => obj.HeaderIndex === 1) || {}).header;

uj5u.com熱心網友回復：

實際上在那種情況下你最好使用findinsted filter：

const Array2 = [{ header: 'First name', HeaderIndex: 0},{ header: 'Last name', HeaderIndex: 1},{ header: 'Company', HeaderIndex: 2},{ header: 'Favorite food', HeaderIndex: 3},{ header: 'Favorite color', HeaderIndex: 4},];
    
const { header } = Array2.find((obj) => obj.HeaderIndex === 1);
console.log(header);

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

但是，如果您必須使用filter只需使用單一解構

const Array2 = [{ header: 'First name', HeaderIndex: 0},{ header: 'Last name', HeaderIndex: 1},{ header: 'Company', HeaderIndex: 2},{ header: 'Favorite food', HeaderIndex: 3},{ header: 'Favorite color', HeaderIndex: 4},];
        
const [{ header }] = Array2.filter((obj) => obj.HeaderIndex === 1);
console.log(header);

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

標籤：

上一篇：從多個選擇選項框中選擇值-Jquery

下一篇：如果引數為真，則來自JSON的Javascript