Поиск соответствия UniqueID между массивом с идентификаторами и массивом с объектами и одинаковыми идентификаторами

#javascript #arrays #javascript-objects #unique-id

#javascript #массивы #javascript-объекты #уникальный идентификатор

Вопрос:

У меня есть следующий объект и массив, которые имеют совпадающие идентификаторы, но из-за функции перетаскивания простая карта без поиска не работает, потому что они не совпадают по порядку. Я объясню.

У меня есть этот объект (который является моими обновленными значениями после отправки формы)

data переменная в моем коде ниже

 {"we98Yt8JLyxkcJorf":"Kanye","yG6JiFaBBut6XgHpj":"2813348004","RcpDcF72K2aN9fub4":"kanye@usa.gov","ShBTee9MNxvRNG3XN":"123 White House Avenue","GSCZMMwscKh3ZaKix":"473 estate drive","Jmr7HoYmfXJWHMwmr":"2813348004"}
  

и у меня есть этот массив с объектами в них, которые соответствуют идентификаторам

cards переменная в моем коде ниже

 [{"inputType":"shortText","uniId":"we98Yt8JLyxkcJorf","label":"First Name:","value":"Kanye"},{"inputType":"phoneNumber","uniId":"yG6JiFaBBut6XgHpj","label":"Cell Phone Number","value":"2813348004"},{"inputType":"email","uniId":"RcpDcF72K2aN9fub4","label":"Work Email","value":"kanye@usa.gov"},{"inputType":"multipleChoice","uniId":"GSCZMMwscKh3ZaKix","label":"Preferred Method of Contact","value":"2813348004","options":[{"uniId":"poXf65zi8NDko5Je4","label":"Email"},{"uniId":"FmvYT4cbY8JotAaqA","label":"Cell Phone"}]},{"inputType":"Address","uniId":"ShBTee9MNxvRNG3XN","label":"Home Address","value":"123 White House Avenue"},{"inputType":"dropDown","uniId":"Jmr7HoYmfXJWHMwmr","label":"How did you find us?","value":"2813348004","options":[{"uniId":"EQj9MXdnaBjmCkAKZ","label":"Google"},{"uniId":"EbbhhqSd4K6sAsQ3T","label":"Referral"}]}]
  

Теперь я хочу обновить массив новыми данными, в обоих из них есть поле UniqueID, которые совпадают, но я продолжаю терпеть неудачу при попытке сопоставить их и обновить массив, чтобы я мог отправить его в БД в формате, который ему нужен, т.Е. в его текущем состоянии.

Это то, что я пробовал до сих пор, оно возвращает undefined

    const test = Object.keys(data);

    console.log(test);

    let testArray = [];

    test.map((item) => {
      let testArraySingle = cards.find((x) => {
        x.uniId === item;
      }).value;

      testArray.push(testArraySingle);
    });

    console.log(testArray);
  

Я тоже пробовал это, но он возвращает неверный результат, потому что он соответствует только тому, сколько раз он повторяет array.length, но не проверяет, имеет ли это смысл

 const dataArray = Object.entries(data);

    let newArray = [];

    cards.map((card, i) => {
      var checkId = dataArray[i][0];

      let matchesArray = [];

      if (card.uniId === checkId) {
        const new_obj = { ...cards[i], value: dataArray[i][1] };
        newArray.push(new_obj);
      }
      // }
    });
  

Надеюсь, кто-нибудь может помочь с этим. Спасибо!

Ответ №1:

Вы можете использовать комбинацию Array.prototype.filter() и Array.prototype.map() метод, чтобы получить свой результат. Просматривайте ключи данных с помощью map и фильтруйте uniId методом filter и снова используйте map для получения всех значений.

 const data = {
  we98Yt8JLyxkcJorf: 'Kanye',
  yG6JiFaBBut6XgHpj: '2813348004',
  RcpDcF72K2aN9fub4: 'kanye@usa.gov',
  ShBTee9MNxvRNG3XN: '123 White House Avenue',
  GSCZMMwscKh3ZaKix: '473 estate drive',
  Jmr7HoYmfXJWHMwmr: '2813348004',
};

const cards = [
  {
    inputType: 'shortText',
    uniId: 'we98Yt8JLyxkcJorf',
    label: 'First Name:',
    value: 'Kanye',
  },
  {
    inputType: 'phoneNumber',
    uniId: 'yG6JiFaBBut6XgHpj',
    label: 'Cell Phone Number',
    value: '2813348004',
  },
  {
    inputType: 'email',
    uniId: 'RcpDcF72K2aN9fub4',
    label: 'Work Email',
    value: 'kanye@usa.gov',
  },
  {
    inputType: 'multipleChoice',
    uniId: 'GSCZMMwscKh3ZaKix',
    label: 'Preferred Method of Contact',
    value: '2813348004',
    options: [
      { uniId: 'poXf65zi8NDko5Je4', label: 'Email' },
      { uniId: 'FmvYT4cbY8JotAaqA', label: 'Cell Phone' },
    ],
  },
  {
    inputType: 'Address',
    uniId: 'ShBTee9MNxvRNG3XN',
    label: 'Home Address',
    value: '123 White House Avenue',
  },
  {
    inputType: 'dropDown',
    uniId: 'Jmr7HoYmfXJWHMwmr',
    label: 'How did you find us?',
    value: '2813348004',
    options: [
      { uniId: 'EQj9MXdnaBjmCkAKZ', label: 'Google' },
      { uniId: 'EbbhhqSd4K6sAsQ3T', label: 'Referral' },
    ],
  },
];

const ret = Object.keys(data)
  .map((x) => {
    const tmp = cards
      .filter((y) => y.uniId === x)
      .map((z) => {
        const obj = { ...z };
        obj.value = data[x];
        return obj;
      });
    return tmp;
  })
  .flat();
console.log(ret);  

Комментарии:

1. хм, какие данные я хочу в итоге, это тот же формат массива cards со значениями, обновленными из данных, например, я хочу, чтобы идентификатор GSCZMMwscKh3ZaKix сформировал значение данных 473 estate drive для обновления этого объекта значения uniId в массиве cards, так что [... {inputType:'multipleChoice',unId:GSCZMMwscKh3ZaKix,value:473 estate drive}...] для этого я бы хотел, чтобы ваш результат по-прежнему имел тот же формат, что и у массива cards.номер 2183348004, но переменная данных имеет обновленное значение, которое 473 estate drive соответствует значению. И я хочу, чтобы в конце был весь массив с каждым объектом в нем в качестве результата.