Итерировать по объекту массива с условием - PullRequest
0 голосов
/ 24 февраля 2020

Я хочу получить данные из массива объекта способом ES6.

У меня есть объект массива.

const data = [
  {
    title: 'first',
    description: "some desc",
    url: firstUrl,
  },
  {
    title: 'second',
    description: "some desc",
    url: secondUrl,
  },
];

Я пытаюсь проверить, есть ли title === 'second' затем верните его URL, иначе верните firstUrl

Я знаю, что могу сделать это для l oop. Но я хочу это с ES6 способом. Любая помощь будет принята с благодарностью.

Я пытался:

let text = data.map((val) => { val.title === 'second' ? val.url : val.url });

Но, не работает, и я знаю, что это не очень хороший способ.

Ответы [ 6 ]

1 голос
/ 24 февраля 2020

Вы можете сделать это, проверить, есть ли у вас второй элемент в вашем массиве (условие title === 'second'), а затем либо использовать его, либо переходить к первому. если первым (или вторым) является undefined, вы получите Undefinded reference ошибку в строке (*)

const data = [
  {
    title: 'first',
    description: "some desc",
    url: 'firstUrl',
  },
  {
    title: 'second',
    description: "some desc",
    url: 'secondUrl',
  },
];

// if your order is allways first and second (0 and 1) you can do this 
// const urlObject = data[1] || data[0]
const urlObject = data.find(item => item.title === 'second') || data.find(item => item.title === 'first')

// here you have your url
console.log(urlObject.url) // line (*)
1 голос
/ 24 февраля 2020

Вы можете взять объект и назначить ему нужный ключ. Для других титров по умолчанию возьмите default.

. Для получения результата выберите требуемый ключ или значение по умолчанию.

const
    data = [{ title: 'first', description: "some desc", url: 'firstUrl' }, { title: 'second', description: "some desc", url: 'secondUrl' }],
    temp = data.reduce((r, { title, url }) => {
        r[title === 'second' ? title : 'default'] = url;
        return r;
    }, {});

console.log(temp.second || temp.default);
1 голос
/ 24 февраля 2020

const secondItem = data.find(item => item.title === 'second')
const url = secondItem ? secondItem.url || firstUrl

просто будь проще

0 голосов
/ 24 февраля 2020

Предполагая, что вы хотите знать только, существует ли «второй» объект, и в противном случае использовать первый элемент массива, вы можете использовать .find().

const secondItem = data.find(e => e.title === "second"); // secondItem will be undefined if not found
const result = secondItem ? secondItem.url : data[0].url;

Также следует проверить крайний случай, когда данные могут быть пустым массивом. Приведенный выше код выдаст ошибку при доступе к регистру по умолчанию.

0 голосов
/ 24 февраля 2020

Я бы использовал уменьшить вместо другого метода (например, карты), если нужен только один вычисляемый элемент .

Также, если по умолчанию используется первый элемент, затем я бы начал с конца массива, обслуживающего second , а затем, если его нет, я бы возвратил первое.

Итак reduRight кажется лучшим вариантом

const data = [
    // ...
];

let text = data.reduceRight((prev, {title, url}, i) => {
    if(prev) {
        return prev
    }
    if(title === 'second' || i === 0) {
        return url
    }
}, null)
0 голосов
/ 24 февраля 2020

Вы можете использовать троичный оператор , чтобы проверить, существует ли second. Если это так, возьмите его URL, в противном случае откройте URL-адрес first, например:

С обоими: вы получите второй URL

const data = [{
    title: 'first',
    description: "some desc",
    url: "firstUrl"
  },
  {
    title: 'second',
    description: "some desc",
    url: "secondUrl"
  }
];

const targetURL = data[1] ? data[1].url : data[0].url;

console.log(targetURL);

Только с first вы получите first' s URL:

const data = [{
  title: 'first',
  description: "some desc",
  url: "firstUrl"
}];

const targetURL = data[1] ? data[1].url : data[0].url;

console.log(targetURL);

Также обратите внимание, что вам нужно заключить значения URL в кавычки, в противном случае они называются переменными, что приводит к ошибкам.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...