首頁猿問 Javascript...

Javascript 如何從對象數(shù)組中獲取屬性的所有值？

JavaScript

Qyouu 2023-06-15 17:41:33

各位 Javascript 開發(fā)人員，我希望你們今天過得愉快。我試圖從我的過濾器的數(shù)組中獲取對象元素的某些屬性的所有動態(tài)設置值。例如var data = [ {id: 0, category: "RINGS", type: "CH"}, {id: 1, category: "NECKLACE", type: "CHE"}, {id: 2, category: "PENDANT", type: "CH"}, {id: 3, category: "BRACELET", type: "CH"}, {id: 4, category: "RINGS", type: "HBR"}, {id: 5, category: "PENDANT", type: "CHE"}, ];以及我的數(shù)據(jù)如何來自 api 的 exmaple 數(shù)組。如您所見，我知道這兩個屬性category&type將始終保持不變，但它們的值可能會根據(jù)用戶輸入數(shù)據(jù)而變化。我想為我的過濾器設置這兩個對象道具的所有可用值。我如何獲取某個道具的所有值，以便為自己獲取某個屬性的值數(shù)組，然后我可以將其分配給 React Native 中的下拉列表。結(jié)果：var category = [ { name: "Rings", id: "RINGS"}, { name: "Necklace", id: "NECKLACE"}, { name: "Pendant", id: "PENDANT"}, { name: "Bracelet", id: "BRACELET"}, ]和var type = [ { name: "CH", id: "CH" }, { name: "CHE", id: "CHE" }, { name: "HBR", id: "HBR" }, ]然后這兩個數(shù)組基本上傳遞給過濾器，然后過濾器將用于對數(shù)據(jù)進行排序。我認為它并不太復雜，但我是 javascript 的初學者，所以請多多包涵。謝謝。

查看完整描述

2 回答

慕桂英546537

TA貢獻1848條經(jīng)驗獲得超10個贊

var data = [

{ id: 0, category: 'RINGS', type: 'CH' },

{ id: 1, category: 'NECKLACE', type: 'CHE' },

{ id: 2, category: 'PENDANT', type: 'CH' },

{ id: 3, category: 'BRACELET', type: 'CH' },

{ id: 4, category: 'RINGS', type: 'HBR' },

{ id: 5, category: 'PENDANT', type: 'CHE' }

];

const categories = [], types = [];

data.forEach((item) => {

if (!categories.includes(item.category)) {

categories.push(item.category);

}

if (!types.includes(item.type)) {

types.push(item.type);

}

});

const category = categories.map((item) => ({

name: item.toLowerCase(),

id: item

}));

const type = types.map((item) => ({ name: item, id: item }));

console.log(category);

console.log(type);

反對回復 2023-06-15

當年話下

TA貢獻1890條經(jīng)驗獲得超9個贊

至少有兩種方法可以做到這一點：

使用Array.includes。正如上面提到的@baymax，您可以使用過濾數(shù)組includes。
在 Javascript 中使用Set。查看代碼。

const data = [

{id: 0, category: "RINGS", type: "CH"},

{id: 1, category: "NECKLACE", type: "CHE"},

{id: 2, category: "PENDANT", type: "CH"},

{id: 3, category: "BRACELET", type: "CH"},

{id: 4, category: "RINGS", type: "HBR"},

{id: 5, category: "PENDANT", type: "CHE"},

];

// by includes

const uniqueCategories = [];

const uniqueTypes = []

data.forEach(entry => {

if (!uniqueCategories.includes(entry.category)){

uniqueCategories.push(entry.category)

}

if (!uniqueTypes.includes(entry.type)){

uniqueTypes.push(entry.type)

}

})

const categoriesMap = uniqueCategories.map(category => ({name: category.toLowerCase(), id: category}));

const typesMap = uniqueTypes.map(typeEntry => ({name: typeEntry, id: typeEntry}));

// by set

const categoriesSet = new Set()

const typesSet = new Set()

data.forEach(entry => {

categoriesSet.add(entry.category);

typesSet.add(entry.type);

});

const uniqueCategoriesFromSet = Array.from(categoriesSet).map(category => ({name: category.toLowerCase(), id: category}));

const uniqueTypesFromSet = Array.from(typesSet).map(typeEntry => ({name: typeEntry, id: typeEntry}));

console.log(uniqueCategoriesFromSet, uniqueTypesFromSet);

console.log(categoriesMap, typesMap)

反對回復 2023-06-15

2 回答
0 關(guān)注
275 瀏覽

關(guān)注

添加回答

舉報

0/150

提交

取消

使用 Ctrl+D 可將網(wǎng)站添加到書簽

微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學習伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號

第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

熱搜

最近搜索清空

Javascript 如何從對象數(shù)組中獲取屬性的所有值？

Javascript 如何從對象數(shù)組中獲取屬性的所有值？

2 回答

添加回答

Javascript 如何從對象數(shù)組中獲取屬性的所有值？

Javascript 如何從對象數(shù)組中獲取屬性的所有值？