Как самая основная структура данных, массивы и объекты играют решающую роль в различных языках программирования. Трудно представить, как бы выглядел язык программирования без массивов и объектов, особенно JS, слаботипизированный язык, очень гибкий. В этой статье вы узнаете об использовании и сравнении общего обхода массива, обхода объектов и мер предосторожности.

Обход массива

С непрерывным развитием JS существует более десяти методов обхода по спецификации ES7. Ниже приведена группа методов с похожими функциями для представления общих методов обхода массивов.

for、forEach、for...of

Краткое содержание

  1. Все это просто обход массива слева направо
  2. forEach не может выйти из цикла; for и for ..of можно пропустить или прервать с помощью break или continue.
  3. for …of напрямую обращается к фактическому элементу. для обхода индекса массива функция обратного вызова forEach имеет больше параметров, и можно получить элемент, индекс и исходный массив.
  4. for …of и for также выполняются, если в массиве есть пустые элементы.

некоторые, каждый

Краткое содержание

  1. Оба используются для условной оценки массива и оба возвращают логическое значение.
  2. Оба могут быть прерваны
  3. someЕсли элемент удовлетворяет условию, возвращается true, и цикл прерывается; если все элементы не удовлетворяют условию, возвращает false.
  4. каждыйВ отличие от некоторых, если полезный элемент не удовлетворяет условию, он возвращает false, и цикл прерывается; если все элементы удовлетворяют условию, возвращается true.

фильтр, карта

Краткое содержание

  1. Оба генерируют новый массив, и ни один из них не изменит исходный массив.
  2. Оба будут пропускать пустые элементы. Заинтересованные студенты могут распечатать его самостоятельно.
  3. map сформирует новый массив с возвращаемым значением функции обратного вызова, а длина массива будет такой же, как у исходного массива.
  4. filter сформирует новый массив элементов, отвечающих условиям функции обратного вызова, и длина массива отличается от исходного массива.
  5. Новые элементы массива, сгенерированные картой, можно настраивать.
  6. Новые элементы массива, сгенерированные фильтром, не могут быть настроены и согласуются с соответствующими исходными элементами массива.

найти、найтиIndex

Краткое содержание

  1. Оба используются для поиска элементов массива.
  2. find возвращает значение первого элемента массива, удовлетворяющего функции обратного вызова. Возвращает неопределенное значение, если оно не существует.
  3. findIndex возвращает индекс элемента, найденного в массиве, а не его значение, или -1, если он не существует.

уменьшить、уменьшитьПраво

reduce: принимает два параметра, первый параметр — это функция обратного вызова, а второй параметр — начальное значение.

reduceRight : возвращает индекс элемента, найденного в массиве, а не его значение, или -1, если он не существует.

Функция обратного вызова получает четыре параметра:

  1. накопитель: до текущего элемента все предыдущие элементы массива обрабатываются функцией обратного вызова и накапливаются.
  2. current: текущий выполняемый элемент массива.
  3. currentIndex: индекс элемента массива, выполняемого в данный момент.
  4. sourceArray: исходный массив, то есть массив, вызывающий метод сокращения.

Если начальное значение не передано, метод сокращения выполнит функцию обратного вызова, начиная с индекса 1. Если начальное значение передано, оно начнется с индекса 0 и выполнит обратный вызов накопительно на основе начального значения.

Вычисляет сумму свойств массива объектов

Дедупликация массива объектов и подсчет количества повторений каждого элемента

Получить максимальное/минимальное значение массива объектов

Сравнение производительности

Сказав так много, в чем разница в производительности между этими методами обхода? Пробуем в браузере Chrome. Я использую каждый цикл для выполнения 10 раз, удаляю максимальное и минимальное значения и беру среднее значение, чтобы уменьшить ошибку.

Как видно из напечатанных результатов, цикл for является самым быстрым, а цикл for of — самым медленным.