Как извлечь неидентичные элементы из двух массивов в React Native?

Question

Позвольте, у меня есть два массива со строками.

let a = ["ABC", "DEF"]
let b = ["ABC", "DEF", "GHI"]

Я хочу сравнить два вышеупомянутых массива и создать новый массив с именем c, который содержит следующее.

c = ["GHI"]

Итак, я хочу сравнить массивы a и b и вставить неидентичные элементы в новый массив.

Как это сделать в React Native?

Answer 1

Вы можете сделать это в следующих шагах:

• Сначала получите те элементы a, которых нет в b
• Затем получите те элементы b, которыене находятся в a
• Тогда concat() оба массива.

let a = ["ABC", "DEF"]
let b = ["ABC", "DEF", "GHI"]

const res = a.filter(x => !b.includes(x)).concat(b.filter(x=> !a.includes(x)))
console.log(res)

Как работает код

Рассмотрим строку

a.filter(x => !b.includes(x))

filter() - это метод массива, который принимает обратный вызов.Если обратный вызов возвращает true, тогда элемент будет добавлен в массив результатов, иначе нет.

Так что теперь в приведенном выше коде x является элементом массива b, через который мы итерируем.b.includes(x) вернет true, если x присутствует в массиве b, иначе false.

! оператор преобразует true в ложь и наоборот

Таким образом, если x будет внутри b, он вернет true.Таким образом, к ! оно станет false и false будет возвращено из обратного вызова.Поэтому элемент x не будет включен в массив результатов / фильтрации.

Предложение для строки над строкой состоит в том, что "Он получает только те элементы массива a, которые отсутствуют вb "

Вторая строка

b.filter(x=> !a.includes(x))

Получает элементы b, которых нет в a.

Atlast concat()используется для объединения обоих массивов.

Answer 2

Вы также можете использовать Array.reduce и Array.filter примерно так:

const findUniques = (a,b) => [...a,...b].reduce((r,c,i,a) => {
  a.filter(x => x===c).length === 1 ? r.push(c) : null
  return r
}, [])

console.log(findUniques(["ABC", "DEF"], ["ABC", "DEF", "GHI"]))
console.log(findUniques(["ABC", "DEF"], ["ABC"]))
console.log(findUniques(["ABC", "DEF", "AAA"], ["AAA", "DEF", "GHI"]))

Если вы используете lodash, это становится действительно тривиальным с xor:

console.log(_.xor(["ABC", "DEF"], ["ABC", "DEF", "GHI"]))
console.log(_.xor(["ABC", "DEF"], ["DEF"]))
console.log(_.xor(["ABC", "DEF", "AAA"], ["AAA", "DEF", "GHI"]))

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js"></script>

Answer 3

Если вы хотите запретить обход массивов O (n²) раз, из-за необходимости искать в каждом массиве дублированные значения, вы можете воспользоваться производительностью JavaScript Objects.

const a = ["ABC", "DEF", "JKL"]
const b = ["ABC", "DEF", "GHI"]

const getUniqueValues = (a, b) => {
  const uniqueValuesObject = [...a, ...b].reduce((uniqueValuesObject, value) => {
    // if the value already exists, then it is not unique
    if (uniqueValuesObject[value]) {
      uniqueValuesObject[value] = false
    } else {
      uniqueValuesObject[value] = true
    }
    return uniqueValuesObject
  }, {})

  return Object.entries(uniqueValuesObject).reduce((uniqueValues, [value, isUnique]) => {
    if (isUnique) {
      uniqueValues.push(value)
    }
    return uniqueValues
  }, [])
}

const c = getUniqueValues(a, b)

console.log(c)

Это можно сократить с помощью delete, однако я не уверен, приведет ли это к снижению производительности по сравнению с решением выше.

const a = ["ABC", "DEF", "JKL"]
const b = ["ABC", "DEF", "GHI"]

const getUniqueValues = (a, b) => {
  const uniqueValuesObject = [...a, ...b].reduce((uniqueValuesObject, value) => {
    // delete if the value already exists
    if (uniqueValuesObject[value]) {
      delete uniqueValuesObject[value]
    } else {
      uniqueValuesObject[value] = true
    }
    return uniqueValuesObject
  }, {})

  return Object.keys(uniqueValuesObject)
}

const c = getUniqueValues(a, b)

console.log(c)