Интервьюер «дразнит» вас рядом: сколько вы знаете о дедупликации массивов?

JavaScript

предисловие

Дедупликация массива — распространенная тема, а также часто задаваемый вопрос в детской обуви во время интервью. В этой статье мы подробно изучим принцип и реализацию дедупликации массива и предоставим вам多种Могу反手“调戏”Решение интервьюера.

Без лишних слов, поднимемся к шаттлу...

Основной принцип дедупликации массива

Основной принцип стоимостью 100 Вт будет дан вам, когда он появится ..., не забудьте оставить комментарий и лайкнуть утку!

  1. Как правило, мы создадим временную переменную tmp для хранения неповторяющихся элементов (хранящихся в элементах массива или ключах объекта);
  2. Обходим массив arr для дедупликации и в свою очередь определяем, содержится ли элемент в tmp;
  3. Если элемента нет в tmp, поставить его, иначе пропустить и не обрабатывать.

В основном независимо от того, какая реализация, ядро ​​​​одинаково (судя по тому, существует ли оно уже). Нет, просто оставьте сообщение, мы можемbattleодин раз

Классическая схема дедупликации 1:

Установите tmp как объект, ключ объекта хранит значение элемента массива и, наконец, возвращает все ключи объекта.

function array_unique (arr) {
  if (arr.length === 0) {
    return arr
  }
  let tmp = {}
  let len = arr.length
  for (let i = 0; i < len; i++) {
    if (tmp[arr[i]] === undefined) {
      tmp[arr[i]] = i
    }
  }
  return Object.keys(tmp)
}

// 调用数组去重
let arr = [1, 2, 3, 1, 2]
let newArr = array_unique(arr)
console.log(newArr) // ['1', '2', '3']

Если вы ответите интервьюеру таким образом, вы попадете в ловушку, которую он расставил заранее:

  1. Можно ли таким образом отличить числа от строк? может отличитьundefinedа также'undefined'?

  2. Тип данных, который вы возвращаете, совпадает с исходным типом данных?

С вопросами интервьюера давайте рассмотрим еще один классический метод дедупликации.

Классический метод дедупликации 2:

Установите tmp как массив, сохраните единственный элемент в массиве и, наконец, верните tmp

function array_unique (arr) {
  let len = arr.length
  if (!len) {
    return []
  }
  let tmp = []
  for (let i = 0; i < len; i++) {
    // 判断数组arr的元素是否在数组tmp中
    if (tmp.indexOf(arr[i]) === -1) {
      tmp.push(arr[i])
    }
  }
  return tmp
}
let arr = [1, 2, 3, '1', 2, undefined, undefined, 'undefined']
let newArr = array_unique(arr)
console.log(newArr) // [1, 2, 3, '1', undefined, 'undefined']

В этот момент сердце тайно счастливо!

Но, если вы так думаете, вы попадаете в другую ловушку интервьюера:

  1. Можете ли вы фильтровать NaN таким образом?

Ну, интервьюер самый большой, подумайте еще раз!

Третий метод дедупликации массива:

Принцип тот же, что и у метода дедупликации 2, за исключением того, что мы используем ES6.includesзаменятьindexOfметод,

Метод include() определяет, включен ли элемент в массив, и возвращает true, если он есть, иначе возвращает false.

Это очень просто!

function array_unique (arr) {
  let len = arr.length
  if (!len) {
    return []
  }
  let tmp = []
  for (let i = 0; i < len; i++) {
    // 判断数组arr的元素是否在数组tmp中
    if (!tmp.includes(arr[i]) {
      tmp.push(arr[i])
    }
  }
  return tmp
}
let arr = [1, 2, 3, '1', 2, undefined, undefined,  'undefined', NaN, NaN]
let newArr = array_unique(arr)
console.log(newArr) // [1, 2, 3, '1', undefined, 'undefined', NaN]

Как вы думаете, теперь все кончено? Нет, не возможно!

Яма интервьюера давно ждет вас:

  1. Может ли ваш метод фильтрации различать объекты? Например, {}, {а: 1}

Вы когда-нибудь хотели достать свой 40-метровый мачете?neng屎Интервьюер! (Картинка не соответствует, придумывайте сами...) Однако ничего не поделаешь, продолжайте думать...

Четвертый метод дедупликации массива:

Принцип тот же, что и выше, мы должны продолжать изменять метод оценки того, содержит ли массив элемент: ```findIndex``

findIndexЗапросить, содержит ли массив элемент, если есть индекс возвращаемого элемента, иначе вернуть -1. Он более продвинут, чем indexOf, поскольку его можно передать вcallback, запрос по соглашению.

function array_unique (arr) {
  let len = arr.length
  if (!len) {
    return []
  }
  let tmp = []
  for (let i = 0; i < len; i++) {
    // 判断数组arr的元素是否在数组tmp中
    if (tmp.findIndex((v) => JSON.stringify(v) === JSON.stringify(arr[i])) === -1) {
      tmp.push(arr[i])
    }
  }
  return tmp
}
let arr = [1, 2, 3, '1', 2, undefined, undefined,  'undefined', NaN, NaN, {}, {}, {a: 1}, {a: 1}]
let newArr = array_unique(arr)
console.log(newArr) // [1, 2, 3, '1', undefined, 'undefined', NaN, {}, {a: 1}]

Наконец удалось! Приходите и приходите, вы можете небрежно спросить интервьюера: «У вас есть какие-либо вопросы?»

Конечно, если вы берете инициативу на себя, чтобы спровоцировать интервьюера, вам придется рискнуть: вас могут повесить, потому что вы сначала моргнули правым глазом...

Есть несколько способов определить, содержит ли массив элемент:

Я дам вам таблицу, чтобы различать функции нескольких методов.

метод\обнаруживаемый null undefined NaN {} Примечание
indexOf да да нет нет без
includes да да да нет без
findIndex да да да да Конкретный обратный вызов должен быть передан в

резюме

Дедупликация массива — это вопрос собеседования, и есть еще много знаний, которые нужно изучить. Во-первых, нужно быть знакомым с общими методами массивов, а также с другими точками знаний, такими как NaN и NaN не равны, {} и {} не равны, и гибкой логикой мышления.

Конечно, существует множество других реализаций дедупликации массива, и вы можете оставить сообщение и обменяться мнениями!

постскриптум

Это то, чем сегодня поделился с вами брат Ху. Не забудьте поставить лайк.点赞,收藏Да, обратите внимание на то, что говорит брат Ху, не теряйтесь в изучении внешнего интерфейса, добро пожаловать, чтобы оставить сообщение для обмена...

Брату Ху есть что сказать, брату Ху с навыками и чувствами! Нынешний осадный лев Jingdong.

Брату Ху есть что сказать, сосредоточив внимание на области крупных интерфейсных технологий, поделившись архитектурой интерфейсных систем, принципами реализации фреймворка и новейшими и наиболее эффективными техническими методами!

胡哥有话说