Изучение Javascript неполное, если не углубляться в массивы. Это одна из самых популярных структур данных для хранения коллекции данных, уступающая только объектам, которые сами часто хранятся в массивах как элементы. Независимо от того, хотите ли вы сохранить небольшую коллекцию чисел или базу данных организации, содержащую большое количество текстов, чисел, объектов и т. Д., Для их обработки можно использовать массивы. Многие вызовы API к веб-сайтам возвращают данные в виде массива, содержащего глубоко вложенные объекты данных внутри него, к которым вы должны получить доступ для использования в своем приложении. Здесь пригодятся знания о методах работы с массивами.
Хотя термины «массивы» и «объекты» используются отдельно, в действительности массивы также являются особым типом объектов. Вот чек.
Отдельные данные, хранящиеся в массиве, называются элементом, а их положение определяется его индексом. Именно этот индекс помогает нам манипулировать элементами в массиве. Итак, если мы умеем играть с индексами, массивы у нас в руках. Помните, счет индекса начинается с 0 с шагом 1, поэтому последний элемент в массиве, имеющем 'n' элементов, будет иметь индекс 'n-1'.
Здесь мы разделим различные методы массива на CRUD (создание, чтение, обновление, удаление) для лучшего понимания. Это также отделит методы, которые изменяют (~ изменяют или изменяют) исходный массив (UPDATE), от методов, которые не изменяются (READ), так как важно знать, когда мы хотим редактировать исходный массив, а когда нет. Непреднамеренное изменение данных в исходном массиве может отрицательно сказаться на других модулях, которые продолжают использовать тот же массив.
Давайте рассмотрим 4 аспекта методов массива один за другим:
- Создавать
- Читать
- Обновлять
- Удалить
1. СОЗДАТЬ
Есть много способов создания / объявления массивов. Некоторые из них:-
Добавление элементов в массив
метод push ():
Он используется для добавления элемента (ов) в конец массива с предоставленными аргументами.
метод unshift ():
Он используется для добавления элемента (ов) в начало массива с предоставленными аргументами.
метод splice ():
Splice - это многофункциональный метод, предоставляющий нам множество способов манипулирования данными. Поскольку на первый взгляд это немного сложно, здесь мы сосредоточимся только на его возможностях добавления элемента. Мы рассмотрим другие возможности сращивания позже, а пока просто обратите внимание, что первый аргумент будет начальным индексом, откуда следует добавить, второй остается 0 для этого случая, а третий аргумент будет элементами, которые мы хотим добавить.
Создание нового массива из существующих массивов / данных
метод concat ():
Этот метод примет один массив в качестве аргумента и добавит его к тому, кого он вызвал. Это может быть присвоено новой переменной массива, которую мы хотим создать.
Мы также можем использовать оператор распространения [… имя-массива], чтобы назначить его элементы новому массиву.
from () метод:
Этот метод создаст новый массив из предоставленных аргументов, похожих на массив. Аргумент может быть строкой или функцией обратного вызова, определяющей некоторую операцию с аргументами внутри нее.
2. ПРОЧИТАЙТЕ
Чтение данных из массива, вероятно, является наиболее выполняемой операцией с массивами, поэтому Javascript предоставил нам в распоряжение ряд методов. Помните, что чтение не изменяет исходный массив, поэтому приведенные ниже методы можно свободно использовать в любом массиве в этом смысле.
Обход всех элементов в массиве
метод forEach ():
Этот метод используется так же, как наш традиционный цикл for, для последовательного обхода всех элементов в массиве.
метод map ():
Этот метод также используется для обхода всех элементов в массиве. Мы также можем выполнить некоторые действия с элементами, результат которых может быть использован новым массивом.
Выбор определенных элементов из массива
метод filter ():
Этот метод определяет условие в функции обратного вызова, и обратно возвращаются только элементы, которые его удовлетворяют.
метод slice ():
Этот метод используется для получения «части» или «фрагмента» нашего массива, причем часть определяется его аргументами. Первый аргумент указывает, что индекс должен начинаться, а второй аргумент указывает количество элементов для выбора. Помните, что отрицательные индексы означают, что их нумерация начинается с конца, причем первый (последний в реальном времени) равен -1.
Отсутствие второго аргумента расширит выделение до конца массива.
Условные проверки в массиве
includes () метод:
Этот метод возвращает истину, если данные в его аргументе находятся в массиве, который он вызывает.
Второй аргумент, если он присутствует, сообщает индексу, откуда начать поиск.
метод every ():
Этот метод проверяет наличие условия для каждого элемента в массиве и возвращает истину, если «все» элементы возвращают истинное значение.
метод some ():
Этот метод проверяет наличие условия для каждого элемента в массиве и возвращает истину, если «любой из элементов» возвращает истинное значение.
Методы, дающие единичные результаты
метод find ():
Этот метод проверяет условие, упомянутое в его функции обратного вызова, и возвращает первый элемент в массиве, который удовлетворяет условию. Если никто этого не сделает, на выходе мы получим undefined.
метод reduce ():
Этот метод запускает функцию обратного вызова для каждого элемента в массиве, начиная с первых двух элементов, и передает результат предыдущей итерации следующему вычислению для его включения. Другими словами, указанное вычисление выполняется постепенно для всех элементов в массиве.
метод reduceRight ():
Этот метод работает аналогично методу сокращения, за исключением того факта, что начальный элемент, рассматриваемый для вычислений, является последним элементом (начинается справа) и продолжается в обратном порядке.
Поиск индексов элементов в массиве
Иногда нас интересует только индекс интересующего нас элемента. В этих случаях можно использовать следующие методы.
метод findIndex ():
Этот метод проверяет все элементы в массиве на предмет условия, указанного в его функции обратного вызова, и возвращает индекс первого массива, удовлетворяющего условию.
indexOf () метод:
Этот метод будет искать элемент в массиве и возвращает индекс первого найденного элемента.
Если указан второй аргумент, поиск начинается с этого индекса.
Метод lastIndexOf ():
Этот метод будет искать элемент в массиве с конца (справа) и возвращает индекс первого найденного элемента.
Преобразование данных из массива
Приведенные ниже методы берут данные из массива и меняют его форму.
метод flat ()
Этот метод объединяет / 'выравнивает' подмассивы до уровня (глубины), указанного в предоставленном ему аргументе.
метод join ()
Этот метод просто объединяет все элементы в одно значение. Если указан аргумент, он помещается между элементами вывода как объединяющий.
метод toString ()
Этот метод объединяет все элементы в массиве, чтобы получить одно строковое значение.
3. ОБНОВЛЕНИЕ
Обновление элементов массива включает изменение исходного массива. При использовании этих методов необходимо соблюдать осторожность, чтобы мы знали, какое влияние они оказывают на исходный массив, который также можно использовать в другом месте, предполагая, что он находится в исходной форме.
Обновление отдельных элементов можно выполнить с помощью индексов.
метод reverse ():
Этот метод просто изменит порядок всех элементов в массиве, при этом первый элемент станет последним.
метод sort ():
Этот метод сортирует все элементы в массиве. Уловка здесь в том, что если он вызывается без аргументов, он работает только со строковыми значениями элементов. Чтобы он работал с числами, нам нужно предоставить функцию обратного вызова, описывающую, как мы хотим сортировать элементы.
метод splice ():
Мы будем использовать этот метод здесь для обновления элементов в массиве. Первый аргумент, как обычно, будет указывать индекс, из которого следует выполнить действие, второй аргумент сообщает, сколько элементов нужно обновить, а третий аргумент сообщает, какие значения мы хотим разместить в массиве.
метод fill ():
Этот метод просто заполняет все элементы в нашем массиве предоставленным аргументом.
метод copyWithin ():
Этот метод принимает элементы, указанные между его вторым и третьим аргументом, и копирует их в позицию индекса, указанную в первом аргументе. При отсутствии третьего аргумента последний элемент массива считается его значением.
4. УДАЛИТЬ
Как следует из названия раздела, эти методы удаляют элементы из массива и, следовательно, видоизменяют его. Элементы, удаленные такими методами, как pop () или shift (), могут быть «захвачены» какой-либо переменной для дальнейшего использования.
Удаление всех элементов в массиве может быть выполнено следующим образом:
Примечание. Свойство .length массива возвращает количество элементов в этом массиве, но здесь оно используется для установки его длины на 0 и, следовательно, его опустошения.
метод pop ():
Этот метод удаляет последний элемент в массиве.
метод shift ():
Этот метод удаляет первый элемент в массиве.
метод splice ():
Этот метод появляется здесь в последний раз. Для удалений первый аргумент будет указывать на указатель, где следует выполнить действие, а второй аргумент указывает количество элементов для удаления. Отсутствие второго аргумента удалит все элементы в конце массива из указанного индекса.
ключевое слово «удалить»:
Мы можем использовать ключевое слово delete для удаления определенного элемента в массиве. Беспокоит то, что пространство, занятое удаленным элементом, остается там и отображается как неопределенное. Вот почему это не очень популярный способ удаления элементов из массива, так как всегда лучше полностью удалить элемент из массива.
С этими иллюстрациями, описывающими только базовое использование этих методов, они могут быть использованы для получения очень сильных результатов при использовании друг с другом и при правильном использовании в зависимости от ситуации. Более того, они помогают реорганизовать наш код, а также упрощают нашу работу по манипулированию данными.
Вы можете проверить ниже репозиторий Github, содержащий весь упомянутый выше код, а также некоторые другие методы. Попробуйте поиграть руками с разными ценностями, чтобы лучше понять, как они работают.
Https://github.com/Gp-singh-git/array-methods-crud-tutorial
Любые отзывы / предложения приветствуются. Продолжайте кодировать !!!