亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

React – 從對象中的數組創建數組

React – 從對象中的數組創建數組

交互式愛情 2022-12-02 16:10:27
初學者 React/JS 問題在這里。我有一系列條目(表單提交),每個條目都包含如下語言數組:0: {…}dream: Array [ "Bengali", "French" ]feel: Array [ "Arabic", "English" ]speak: Array [ "Afrikaans", "Armenian" ]think: Array [ "Albanian" ]1: {…}dream: Array [ "English", "French" ]feel: Array [ "German", "Italian" ]speak: Array [ "Afrikaans", "English" ]think: Array [ "Cantonese" ]我想要每個類別中所有語言的數組。我知道我必須過濾每個條目并保存語言,但我不知道如何檢查重復項。目前,我可以過濾以查看使用單一語言的條目setFilter(entries.filter((key) => key.speak.includes("Afrikaans")));但我不知道如何創建所有語言的主列表。
查看完整描述

5 回答

?
蕭十郎

TA貢獻1815條經驗 獲得超13個贊

這是你想要的嗎 ?您需要減少和過濾 du 避免重復,結果您將得到一個對象


    const myArray = [{

      dream: [ "Bengali", "French" ],

      feel: [ "Arabic", "English" ],

      speak: [ "Afrikaans", "Armenian" ],

      think: [ "Albanian" ]

    }

      ,{

        dream: [ "Bengaslis", "French" ],

        feel: [ "Arabsic", "English" ],

        speak: [ "Afrikasans", "Armenian" ],

        think: [ "Assslbanian" ]

      }

    ];


    const result = myArray.reduce((accumulator, currentValue) => {

      const dream = accumulator.dream.concat(currentValue.dream);

      const think = accumulator.think.concat(currentValue.think);

      const feel = accumulator.feel.concat(currentValue.feel);

      const speak = accumulator.speak.concat(currentValue.speak);

      accumulator.dream = dream.filter((item, pos) => dream.indexOf(item) === pos)

      accumulator.feel = feel.filter((item, pos) => feel.indexOf(item) === pos);

      accumulator.speak = speak.filter((item, pos) => speak.indexOf(item) === pos);

      accumulator.think = think.filter((item, pos) => think.indexOf(item) === pos);

      return accumulator;

    })

    

    console.log(result)


查看完整回答
反對 回復 2022-12-02
?
尚方寶劍之說

TA貢獻1788條經驗 獲得超4個贊

您可以使用Object.valuesandObject.entries來遍歷數據對象。

const data = {

  0: {

    dream: ["Bengali", "French"],

    feel: ["Arabic", "English"],

    speak: ["Afrikaans", "Armenian"],

    think: ["Albanian"],

  },


  1: {

    dream: ["English", "French"],

    feel: ["German", "Italian"],

    speak: ["Afrikaans", "English"],

    think: ["Cantonese"],

  }

};


const categoryMap = Object.values(data)

  .reduce((concatedArr, item) => concatedArr.concat(Object.entries(item)), [])

  .reduce((result, [category, values]) => {

    result[category] = result[category] || [];

    result[category] = result[category].concat(values);

    return result;

  }, {});


console.log(categoryMap);



查看完整回答
反對 回復 2022-12-02
?
慕桂英4014372

TA貢獻1871條經驗 獲得超13個贊

老實說,我不太理解這個問題。但我試著這樣解釋,讓我知道:


const entries = [

{

  dream:  [ "Bengali", "French" ],

  feel:   [ "Arabic", "English"],

  speak:  [ "Afrikaans", "Armenian" ],

  think:  [ "Albanian" ],

},{

  dream:  [ "English", "French" ],

  feel:   [ "German", "Italian" ],

  speak:  [ "Afrikaans", "English" ],

  think:  [ "Cantonese" ],

}

]


const fields = ["dream", "feel", "speak","think"];


const result = {};


for(field of fields){

  // create an array containing all the languages of the specific category of the for-loop (there may be duplications)

  const rawArray = entries.map(item =>  item[field]).flat();

  // delete duplicates

  const  arrayWithoutDuplicates = rawArray.filter((item,index) => rawArray.indexOf(item) === index);

  

  result[field] = arrayWithoutDuplicates;

}


console.log(result);


查看完整回答
反對 回復 2022-12-02
?
人到中年有點甜

TA貢獻1895條經驗 獲得超7個贊

試試這個 Obj 結構


var completObj=[

    {

     dream:[ "Bengali", "French" ],

     feel:[ "Arabic", "English" ],

     speak:[ "Afrikaans", "Armenian" ],

     think:[ "Albanian" ]

    },

    {

     dream:[ "English", "French" ],

     feel:[ "German", "Italian" ],

     speak:[ "Afrikaans", "English" ],

     think:[ "Cantonese" ]

    }

    ]

    var Afrikaans=completObj.filter((key) => key.speak.includes("Afrikaans"))

    

    

    console.log('Afrikaans:'+JSON.stringify( Afrikaans))

    var uniqueObj={}

    completObj.map((value, index) => {

      Object.entries(completObj[index]).forEach(([ObjKey, value]) => {

       

        if (!uniqueObj[ObjKey]) {

          uniqueObj[ObjKey] = new Set();

        }

         debugger

        value.map(list => uniqueObj[ObjKey].add(list));

        // uniqueObj[ObjKey].add(value)

      });

      

    });

    

    var dream=Array.from(uniqueObj.dream)

    

    console.log('dream unique Value:'+JSON.stringify( dream))


查看完整回答
反對 回復 2022-12-02
?
忽然笑

TA貢獻1806條經驗 獲得超5個贊

給定數據


const data = [

  {

    dream: ["Bengali", "French"],

    feel: ["Arabic", "English"],

    speak: ["Afrikaans", "Armenian"],

    think: ["Albanian"]

  },

  {

    dream: ["English", "French"],

    feel: ["German", "Italian"],

    speak: ["Afrikaans", "English"],

    think: ["Cantonese"]

  }

];

首先將類別語言數組數組轉換為類別語言集的簡化對象。這些集合用于刪除重復項。


const reducedData = data.reduce((categories, current) => {

  // Loop over the categories (dream, feel, etc..)

  // and add languages to sets

  Object.entries(current).forEach(([currentCategory, languages]) => {

    if (!categories[currentCategory]) {

      // A set will not allow duplicate entires

      categories[currentCategory] = new Set();

    }


    // Add all languages to the set

    languages.forEach(language => categories[currentCategory].add(language));

  });

  return categories;

}, {});

你現在有一個有形狀的物體


{

  dream: Set("Bengali", "French", "English"), 

  feel: Set("Arabic", "English", "German", "Italian"),

  speak: Set("Afrikaans", "Armenian", "English"),

  think: Set("Albanian", "Cantonese"),

}

然后再次將其縮減為類別對象 - 語言數組。這只是將集合轉換回數組。


const reducedDataArray = Object.entries(reducedData).reduce(

  (categories, [category, languageSet]) => {

    // Convert Set back to an array

    categories[category] = [...languageSet];

    return categories;

  },

  {}

);

結果對象形狀


{

  dream: ["Bengali", "French", "English"], 

  feel: ["Arabic", "English", "German", "Italian"],

  speak: ["Afrikaans", "Armenian", "English"],

  think: ["Albanian", "Cantonese"],

}

const data = [

  {

    dream: ["Bengali", "French"],

    feel: ["Arabic", "English"],

    speak: ["Afrikaans", "Armenian"],

    think: ["Albanian"]

  },

  {

    dream: ["English", "French"],

    feel: ["German", "Italian"],

    speak: ["Afrikaans", "English"],

    think: ["Cantonese"]

  }

];


const reducedData = data.reduce((categories, current) => {

  Object.entries(current).forEach(([currentCategory, languages]) => {

    if (!categories[currentCategory]) {

      categories[currentCategory] = new Set();

    }

    languages.forEach(language => categories[currentCategory].add(language));

  });

  return categories;

}, {});


const reducedDataArray = Object.entries(reducedData).reduce(

  (categories, [category, languageSet]) => {

    categories[category] = [...languageSet];

    return categories;

  },

  {}

);


console.log(reducedDataArray);


查看完整回答
反對 回復 2022-12-02
  • 5 回答
  • 0 關注
  • 191 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號