JavaScript | Как проверить на массив?
Как узнать, является ли переменная массивом?
У нас есть две переменные ( massiv и chtoto ):
Как узнать, является ли переменная массивом? Мы хотим получить логическое значение проверки переменной на массив — true или false.
Видео
Как проверить именованные данные?
Консольные выводы в браузере — передаём переменные в качестве аргумента:
JavaScript — Как проверить переменную на массив?
Как узнать, является ли выражение массивом?
Как проверить не именованные данные?
В качестве аргумента функции isArray() прописываем «проверяемые» данные.
Консольные выводы в браузере — передаём массив и объект в качестве аргумента:
JavaScript — Как проверить массив на массив? — Всегда получим истину true 
JavaScript — Как проверить объект на массив? — Всегда получим ложь false
Альтернативный способ
Мы можем воспользоваться свойством конструктора объекта и получить его имя класса. Если это имя будет равно « Array «, значит мы имеем дело с классическим массивом JavaScript, а не массиво-подобным объектом.
Проверяем на массив свойством constructor и name — JavaScript
Зачем нужно проверять на массив?
Задача проверки на массив часто встречается в сложных структурах данных, когда нужно погружаться на много уровней в глубину основного массива, чтобы извлекать необходимые данные. Выглядит примерно как рекурсивная распаковка данных — сначала достаём что на уровень ниже, потом то, что ещё на один уровень ниже …и так далее. Вот хороший пример, где нужно проверять на массив: Как узнать глубину каждого элемента массива?
Это очень похоже на то, когда вы приходите из магазина с пакетом еды. Вы точно знаете, что где-то внутри в большом пакете есть средний пакет с фруктами, в который вложен ещё один маленький пакет с яблоками. Так вот если вы хотите получить яблоко, то вы должны погрузиться в самый «глубоко-лежащий» пакет. Вы должны из большого пакета сначала достать средний, а потом из среднего достать маленький. И только потом достать яблоко.
Как узнать, есть ли элемент в массиве?
4 ответа 4
Маленькая интродукция
Задача поиска элемента в массиве стоит перед всеми достаточно часто и хорошо бы расписать, как это можно сделать.
Разберем 6 способов сделать это на нативном JS разной новизны и 3 способа с их разбором на популярных фреймворках: jQuery, underscore и lodash.
Часть первая, нативная, в стиле аллегро
Для начала надо пройтись по родным возможностям языка и посмотреть, что можно сделать самим.
Поиск в лоб
Попробуем просто идти по элементам массива, пока мы не встретим то, что нам нужно. Как всегда самое простое решение является в среднем самым быстрым.
Array.prototype.indexOf()
Array.prototype.lastIndexOf()
Array.prototype.find()
Array.prototype.findIndex()
Array.prototype.includes()
Часть вторая, со вниманием, но чужая и в стиле сонаты
Теперь, наконец, можно поговорить об этой же теме, но в контексте парочки фреймворков! Говорят, что всегда хорошо посмотреть сначала, как делают другие, перед тем, как начнешь делать это сам. Может это откроет нам глаза на что-нибудь интересное!
jQuery
А теперь поговорим, как она работает. Вот, что она представляет из себя в версии 2.1.3 :
Где indexOf это вот это:
Забавный комментарий говорит, что так быстрее, чем родной Array.prototype.indexOf() (могу предположить, что из-за отсутствия всех проверок) и предлагает посмотреть тесты производительности.
Underscore
Lodash
Можно предложить просто обернуть _.indexOf() для поиска элемента:
Заключение, хотя и в стиле интермеццо
И да, все эти варианты имеют смысл, только если момент с поиском данных част в вашем алгоритме или поиск происходит на очень больших данных. Вот приведу ниже несколько тестов на поиск элементов типа Number и String в массивах длинной 1000000 (миллион) элементов для трех случаев, когда элемент находится вначале массива, в середине (можно считать за среднюю по палете ситуацию) и в конце (можно считать за время поиска отсутствующего элемента, кроме метода с Array.prototype.lastIndexOf() ).
Результаты тестов могут сильно зависеть от версии браузера, да и от самих браузеров, как этого избежать не знаю, но рекомендую протестить на нескольких.
Как проверить, является ли переменная массивом в JavaScript? [дубликат]
этот вопрос уже есть ответ здесь:
Я хотел бы проверить, является ли переменная массивом или одним значением в JavaScript.
Я нашел возможное решение.
Это лучший способ сделать это?
23 ответов
существует несколько способов проверить, является ли переменная массивом или нет. Лучшее решение-это то, которое вы выбрали.
это самый быстрый метод на Chrome, и, скорее всего, все другие браузеры. Все массивы являются объектами, поэтому проверка свойства конструктора является быстрым процессом для движков JavaScript.
если у вас возникли проблемы с выяснением, является ли свойство objects массивом, вы должны сначала проверить, является ли свойство там.
некоторые другие способы:
этот последний, на мой взгляд, самый уродливый, и это один из самый медленный. Запуск около 1/5 скорости в качестве первого примера. Матрица.прототип, на самом деле массив. подробнее об этом можно прочитать здесь https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/isArray
Итак, еще одно обновление
этот парень самый медленный для проверки массива. Однако, это одна остановка магазин для любого типа, который вы ищете. Однако, поскольку вы ищете массив, просто используйте самый быстрый метод выше.
кроме того, я провел тест:http://jsperf.com/instanceof-array-vs-array-isarray/33 так что повеселись и проверь это.
Примечание: @EscapeNetscape создал еще один тест как jsperf.com вниз. http://jsben.ch/#/QgYAV я хотел убедиться, что оригинальная ссылка остается всякий раз, когда jsperf возвращается в интернет.
вы также можете использовать:
Это кажется мне довольно элегантным решением, но каждому свое.
по состоянию на ES5 теперь также:
но это сломается в старых браузерах, если вы не используете polyfills (в основном. IE8 или похожие).
Я заметил, что кто-то упомянул jQuery, но я не знал, что есть isArray()
есть несколько решений со всеми своими причудами. на этой странице дает хороший обзор. Одним из возможных решений является:
в современных браузерах (и некоторых устаревших браузерах) вы можете сделать
(при поддержке Chrome 5, Firefox 4.0, IE 9, Opera 10.5 и Safari 5)
Если вам нужно поддерживать более старые версии IE, вы можете использовать в ES5-shim и к массиву polyfill.isArray; или добавьте следующее
Если вам не надо обнаружение массивов, созданных в разных кадрах, вы также можете просто использовать instanceof
Примечание: the arguments ключевое слово, которое может быть использовано для доступа к аргументу функции, не является массивом, хотя он (обычно) ведет себя как один:
Это старый вопрос, но с той же проблемой я нашел очень элегантное решение, которым я хочу поделиться.
добавление прототипа в массив делает его очень простым
теперь если у вас есть объект, который вы хотите проверить, чтобы увидеть, если массив все, что вам нужно, чтобы проверить новое свойство
isArray доступен, только если его массив
мне лично нравится предложение Петра:https://stackoverflow.com/a/767499/414784 (для ECMAScript 3. Для ECMAScript 5, Используйте Array.isArray() )
комментарии к сообщению указывают, однако, что если toString() изменяется вообще, этот способ проверки массива завершится ошибкой. Если вы действительно хотите быть конкретным и убедитесь, что toString() не было изменено, и нет никаких проблем с атрибутом класса объектов ( [object Array] является атрибутом класса объекта, который является массивом), тогда я рекомендую сделать что-то вроде этого:
когда я опубликовал этот вопрос, версия JQuery, которую я использовал, не включала
думал, что я добавлю еще один вариант для тех, кто уже может использовать подчеркивание.библиотека js в их сценарии. Подчеркивать.js имеет функцию isArray () (см. http://underscorejs.org/#isArray).
возвращает true, если объект является массивом.
Если вы имеете дело только с EcmaScript 5 и выше, вы можете использовать встроенный Array.isArray функции
Если вы используете Angular, вы можете использовать angular.параметры isarray() функция
в Крокфорд это JavaScript Хорошие Части, есть функция для проверки, является ли данный аргумент массивом:
во-первых, мы спрашиваем, является ли значение истинным. Мы делаем это, чтобы отклонить null и другие ложные значения. Во-вторых, мы спрашиваем, является ли значение typeof «object». Это будет верно для объектов, массивов и (странно) null. В-третьих, мы спрашиваем, имеет ли значение свойство length, которое является числом. Это всегда будет верно для массивов, но обычно не для предметов. В-четвертых, мы спрашиваем, содержит ли значение метод splice. Это снова будет верно для всех массивов. Наконец, мы спрашиваем, является ли свойство length перечислимым (будет ли длина создаваться циклом for in?). Это будет false для всех массивов. Это самый надежный тест для arrayness, который я нашел. К сожалению, это так сложно.
я использовал эту строку кода:
универсальное решение ниже:
начиная с ECMAScript 5, формальным решением является:
кроме того, для старых библиотек JavaScript вы можете найти ниже решение, хотя оно недостаточно точно:
для тех, кто кода-гольф, ненадежный тест с наименьшим количеством символов:
это обычно используется при обходе/уплощение иерархии:
мне понравился ответ Брайана:
но вы могли бы просто сделать вот так:
Я создал этот небольшой код, который может возвращать истинные типы.
Я еще не уверен в производительности, но это попытка правильно определить тип.
он работает, подобно текущему typeof.
он думает, что ему может понадобиться немного тонкой настройки, и принять во внимание вещи, я не сталкивался или проверить его должным образом. поэтому дальнейшие улучшения приветствуются, будь то производительность или неправильный перенос typeOf.
Я думаю, используя myObj.конструктор= = объект и myArray.constructor= = Array-лучший способ. Его почти 20x быстрее, чем с помощью toString(). Если вы расширяете объекты своими собственными конструкторами и хотите, чтобы эти творения считались «объектами», это не работает, но в противном случае его путь быстрее. typeof так же быстро, как метод конструктора, но typeof []==’object’ возвращает true, что часто будет нежелательным. http://jsperf.com/constructor-vs-tostring
следует отметить, что null.конструктор выдаст ошибку, поэтому, если вы можете проверять значения null, вам придется сначала сделать if (testThing!==null) <>
Underscorejs и несколько других библиотек используют этот короткий и простой трюк.
Как проверить пустой ли массив в Javascript.
В Javascript очень часто приходиться работать с массивами. Одна из проверок, с которой приходится часто встречаться – это проверка на то пустой ли массив или в нем есть какие-то элементы.
Когда вы вручную создаете массив, то там эту проверку производить совершенно не обязательно, там сразу все очевидно.
Другое дело, когда массив формируется автоматически при выполнении каких-либо условий. Например, вы получаете данные из базы данных и нужно проверить нашлось ли что-либо при таких условиях, либо таких записей в базе данных нет.
Если ничего найдено не было, то будет возвращаться пустой массив. Эту ситуацию нужно отследить и делать соответствующие действия.
Давайте посмотрим на упрощенном примере, как это работает.
Итак, предположим, что у нас есть два массива с данными:
dataFull – это массив, который содержит в себе элементы
dataEmpty – это пустой массив.
Задача в том, чтобы программно проверить пустой ли каждый из этих массивов или нет и вывести соответствующее сообщение.
Для проверки на то есть-ли какие-либо элементы в массиве, можно использовать свойство length.
Возвращаясь к задаче, которую мы поставили, решение может выглядеть вот так:
Чтобы посмотреть, как это работает, можете перейти по следующей ссылке:
На этом все. Надеюсь, что в будущем с подобными проверками у вас больше возникать трудностей не будет.
Все мои уроки по Javascript здесь.
Чтобы оставить сообщение, зарегистрируйтесь/войдите на сайт через:
Или зарегистрируйтесь через социальные сети:
Автор: Александр Булатов 24/05/2021 04:05:36
Спасибо, что показали решение в тривиальной задаче.
А есть у Вас какие-то мысли когда внутри массива пустые значения, это ведь тоже пустой массив?
Я про то, чтобы простая проверка была, а не вызов собственной функции, или вызов какой-то встроенной функции была, чтобы свою не писать. Вот как например в PHP есть функция empty().
В частности, может быть вот такой массив: [«»]. Значение в этом случае будет 1 у свойства length. Но ведь это пустой массив)
Автор: Дмитрий Ченгаев 24/05/2021 04:05:42
Здравствуйте. Какого-то универсального решения не знаю. Скорее всего придется перебирать массив и если все значения в нем пустые, то функция будет выдавать true, иначе false.
В php
$arr = [«»];
print_r(empty($arr));
Тоже выдаст ЛОЖЬ.
Если элемент один, думаю можно так проверить:
[»][0].length
Автор: Александр Булатов 25/05/2021 02:05:18
P.S. Дмитрий, у Вас ошибка в ссылке, которая приходит в письме об ответе на комментарий. Должно быть post, а в письме page.
Автор: vad general 14/07/2020 05:07:01
Автор: Дмитрий Ченгаев 14/07/2020 11:07:03
Автор: Aleksey Konstantinov 29/01/2020 03:01:39
Автор: Дмитрий Ченгаев 29/01/2020 03:01:40
Методы массивов
Массивы предоставляют множество методов. Чтобы было проще, в этой главе они разбиты на группы.
Добавление/удаление элементов
Мы уже знаем методы, которые добавляют и удаляют элементы из начала или конца:
splice
Как удалить элемент из массива?
Так как массивы – это объекты, то можно попробовать delete :
Поэтому для этого нужно использовать специальные методы.
Метод arr.splice(str) – это универсальный «швейцарский нож» для работы с массивами. Умеет всё: добавлять, удалять и заменять элементы.
Этот метод проще всего понять, рассмотрев примеры.
В следующем примере мы удалим 3 элемента и заменим их двумя другими.
Здесь видно, что splice возвращает массив из удалённых элементов:
Метод splice также может вставлять элементы без удаления, для этого достаточно установить deleteCount в 0 :
В этом и в других методах массива допускается использование отрицательного индекса. Он позволяет начать отсчёт элементов с конца, как тут:
slice
Он возвращает новый массив, в который копирует элементы, начиная с индекса start и до end (не включая end ). Оба индекса start и end могут быть отрицательными. В таком случае отсчёт будет осуществляться с конца массива.
concat
Метод arr.concat создаёт новый массив, в который копирует данные из других массивов и дополнительные значения.
Он принимает любое количество аргументов, которые могут быть как массивами, так и простыми значениями.
Если аргумент argN – массив, то все его элементы копируются. Иначе скопируется сам аргумент.
Обычно он просто копирует элементы из массивов. Другие объекты, даже если они выглядят как массивы, добавляются как есть:
Для корректной обработки в объекте должны быть числовые свойства и length :
Перебор: forEach
Метод arr.forEach позволяет запускать функцию для каждого элемента массива.
Например, этот код выведет на экран каждый элемент массива:
А этот вдобавок расскажет и о своей позиции в массиве:
Результат функции (если она вообще что-то возвращает) отбрасывается и игнорируется.
Поиск в массиве
Далее рассмотрим методы, которые помогут найти что-нибудь в массиве.
indexOf/lastIndexOf и includes
Методы arr.indexOf, arr.lastIndexOf и arr.includes имеют одинаковый синтаксис и делают по сути то же самое, что и их строковые аналоги, но работают с элементами вместо символов:
Кроме того, очень незначительным отличием includes является то, что он правильно обрабатывает NaN в отличие от indexOf/lastIndexOf :
find и findIndex
Представьте, что у нас есть массив объектов. Как нам найти объект с определённым условием?
Здесь пригодится метод arr.find.
Его синтаксис таков:
Функция вызывается по очереди для каждого элемента массива:
В реальной жизни массивы объектов – обычное дело, поэтому метод find крайне полезен.
filter
На тот случай, если найденных элементов может быть много, предусмотрен метод arr.filter(fn).
Преобразование массива
Перейдём к методам преобразования и упорядочения массива.
Метод arr.map является одним из наиболее полезных и часто используемых.
Он вызывает функцию для каждого элемента массива и возвращает массив результатов выполнения этой функции.
Например, здесь мы преобразуем каждый элемент в его длину:
sort(fn)
Вызов arr.sort() сортирует массив на месте, меняя в нём порядок элементов.
Не заметили ничего странного в этом примере?
По умолчанию элементы сортируются как строки.
Функция должна для пары значений возвращать:
Например, для сортировки чисел:
Теперь всё работает как надо.
Давайте возьмём паузу и подумаем, что же происходит. Упомянутый ранее массив arr может быть массивом чего угодно, верно? Он может содержать числа, строки, объекты или что-то ещё. У нас есть набор каких-то элементов. Чтобы отсортировать его, нам нужна функция, определяющая порядок, которая знает, как сравнивать его элементы. По умолчанию элементы сортируются как строки.
Кстати, если мы когда-нибудь захотим узнать, какие элементы сравниваются – ничто не мешает нам вывести их на экран:
В процессе работы алгоритм может сравнивать элемент с другими по нескольку раз, но он старается сделать как можно меньше сравнений.
На самом деле от функции сравнения требуется любое положительное число, чтобы сказать «больше», и отрицательное число, чтобы сказать «меньше».
Это позволяет писать более короткие функции:
Помните стрелочные функции? Можно использовать их здесь для того, чтобы сортировка выглядела более аккуратной:
Будет работать точно так же, как и более длинная версия выше.
reverse
Метод arr.reverse меняет порядок элементов в arr на обратный.
Он также возвращает массив arr с изменённым порядком элементов.
split и join
В примере ниже таким разделителем является строка из запятой и пробела.
У метода split есть необязательный второй числовой аргумент – ограничение на количество элементов в массиве. Если их больше, чем указано, то остаток массива будет отброшен. На практике это редко используется:
Вызов split(s) с пустым аргументом s разбил бы строку на массив букв:
reduce/reduceRight
Методы arr.reduce и arr.reduceRight похожи на методы выше, но они немного сложнее. Они используются для вычисления какого-нибудь единого значения на основе всего массива.
Функция применяется по очереди ко всем элементам массива и «переносит» свой результат на следующий вызов.
При вызове функции результат её вызова на предыдущем элементе массива передаётся как первый аргумент.
Этот метод проще всего понять на примере.
Тут мы получим сумму всех элементов массива всего одной строкой:
Давайте детальнее разберём, как он работает.
Поток вычислений получается такой:
В виде таблицы, где каждая строка –- вызов функции на очередном элементе массива:
| sum | current | result | |
|---|---|---|---|
| первый вызов | 0 | 1 | 1 |
| второй вызов | 1 | 2 | 3 |
| третий вызов | 3 | 3 | 6 |
| четвёртый вызов | 6 | 4 | 10 |
| пятый вызов | 10 | 5 | 15 |
Здесь отчётливо видно, как результат предыдущего вызова передаётся в первый аргумент следующего.
Мы также можем опустить начальное значение:
Результат – точно такой же! Это потому, что при отсутствии initial в качестве первого значения берётся первый элемент массива, а перебор стартует со второго.
Таблица вычислений будет такая же за вычетом первой строки.
Но такое использование требует крайней осторожности. Если массив пуст, то вызов reduce без начального значения выдаст ошибку.
Поэтому рекомендуется всегда указывать начальное значение.
Метод arr.reduceRight работает аналогично, но проходит по массиву справа налево.
Array.isArray
Массивы не образуют отдельный тип языка. Они основаны на объектах.
Поэтому typeof не может отличить простой объект от массива:
Большинство методов поддерживают «thisArg»
Этот параметр не объяснялся выше, так как очень редко используется, но для наиболее полного понимания темы мы обязаны его рассмотреть.
Вот полный синтаксис этих методов:
Например, вот тут мы используем метод объекта army как фильтр, и thisArg передаёт ему контекст:
Итого
Шпаргалка по методам массива:
Для добавления/удаления элементов:
Для поиска среди элементов:
Для перебора элементов:
Для преобразования массива:
Изученных нами методов достаточно в 99% случаев, но существуют и другие.
Полный список есть в справочнике MDN.
На первый взгляд может показаться, что существует очень много разных методов, которые довольно сложно запомнить. Но это гораздо проще, чем кажется.
Внимательно изучите шпаргалку, представленную выше, а затем, чтобы попрактиковаться, решите задачи, предложенные в данной главе. Так вы получите необходимый опыт в правильном использовании методов массива.
Всякий раз, когда вам будет необходимо что-то сделать с массивом, а вы не знаете, как это сделать – приходите сюда, смотрите на таблицу и ищите правильный метод. Примеры помогут вам всё сделать правильно, и вскоре вы быстро запомните методы без особых усилий.
Задачи
Переведите текст вида border-left-width в borderLeftWidth
То есть дефисы удаляются, а все слова после них получают заглавную букву.
