將多個對象數組合並為一個對象數組

Question

我需要你的幫助。 我有以下代碼行，它根據單擊的復選框返回一個或多個數組。

到目前為止一切正常。

selected.forEach(langsel => {
                let filtered = person.filter(pers => pers.language == langsel);
            })

選擇，我不報告其他變量，以方便閱讀。

例如我得到：

第一個數組：[{id: "2", name: "Tomas Addreh", language: "English"},{id: "6", name: "Mark Addreh", language: "English"}];

第二個數組：= [{id: "15", name: "Alex Atres", language: "Spanish"}, {id: "1", name: "Mark Sertoj", language: "Spanish"}, id: " 12”，姓名：“瑪莎福雷斯特”，語言：“西班牙語”]；

這是兩個獨立的數組； 從某種意義上說，如果我單擊感興趣的復選框，我會得到第一個數組，如果我單擊第二個復選框（始終選中第一個復選框），我會得到與第二個復選框相關的數組，而丟失與先前單擊的復選框相關的第一個復選框。

我不希望前者丟失，但我希望將它們合並到一個數組中。

Answer 1

如果您只是想合並它們並且不擔心碰撞，我會使用 concat。

array1.concat(array2)將解決您的問題。 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/concat

如果你想要一些關於合並的邏輯，還有很多其他的方法可以做到，但最好的方法很可能取決於邏輯是什么。

Answer 2

您可以通過使用Array.filter()和Array.includes()方法來簡單地實現此要求。 我在下面的代碼片段中添加了描述性注釋。

試試這個：

 // Input person array const person = [{ id: "2", name: "Tomas Addreh", language: "English" }, { id: "6", name: "Mark Addreh", language: "English" }, { id: "15", name: "Alex Atres", language: "Spanish" }, { id: "1", name: "Mark Sertoj", language: "Spanish" }, { id: "12", name: "Martha Forrest", language: "Spanish" }]; // Initializing an array to get selected checkbox values. const selectedPerson = []; // getSelectedPerson() method invoke on checkbox value change. function getSelectedPerson(event) { // This line of code is used to push the selected languages from the checkboxes on checked into an array and remove if checbox unchecked. event.target.checked ? selectedPerson.push(event.target.value) : selectedPerson.splice(selectedPerson.indexOf(event.target.value), 1); // If there is any checbox selected then it will go inside this condition. if (selectedPerson.length) { // To filtered out the person array based on the languages available in selectedPerson array. const filtered = person.filter(({ language }) => selectedPerson.includes(language)); // Assignign a result into a "result" div document.getElementById('result').innerHTML = JSON.stringify(filtered, null, 2); } else { // else case document.getElementById('result').innerHTML = []; } }

 <input type="checkbox" id="english" name="english" value="English" onchange="getSelectedPerson(event)"> <label for="english"> English</label><br> <input type="checkbox" id="spanish" name="spanish" value="Spanish" onchange="getSelectedPerson(event)"> <label for="spanish"> Spanish</label><br> <pre id="result"></pre>