От [0] до [«H», «E», «R», «O»]
В JavaScript массив - это единственная переменная, которая используется для хранения различных элементов. Он часто используется, когда мы хотим сохранить список элементов и получить к ним доступ с помощью одной переменной. Это более удобный способ хранения и структурирования информации, чем определение множества переменных с немного разными именами, например:
var fruit0 = 'Mango'; var fruit1 = 'Apple'; var fruit2 = 'Orange';
Вместо приведенного выше мы можем использовать массив для такой структуры данных:
Var fruits = new Array('Mango','Apple','Orange');
Объявление массива
Есть два основных способа объявить массив.
В буквальном обозначении []
var array = [1, 2, 3]
С конструктором Array ()
var array = new Array(1, 2, 3)
По сути, оба подхода одинаковы, но большинство людей используют буквальную нотацию, так как она быстрее набирается и требует меньше кода.
Массивы могут быть любыми - числами, строками, функциями и даже другими массивами, и внутри массивов вы можете свободно смешивать различные типы данных.
var number = [1, 2, 3, 4, 5]
var strings = ['name', 'place', 'food' ]
var functions = [ function x(){...}, finction y(){...} ]
var mix = [ 12, 'niceplace', function xy(){...} ]
Доступ к значениям массивов.
Мы можем получить доступ к значениям массива, указав номер индекса. Номер индекса можно определить как расположение элемента в массиве. Чтобы получить значение, мы обращаемся к членам массива, используя номер индекса в квадратной скобке [].
Например:
var array = [ 'val1', 'val2', 'val3'] alert(array[0]); // alerts val1.
примечание: индексирование массивов начинается с 0 в приведенном выше примере, вы можете видеть, что array [0] предупреждает первое значение массива, а array [1] предупреждает второе значение. Чтобы проверить это, вы можете определить массив и использовать console.table для просмотра индексации массива.
Создание массива массивов
Массив массивов известен как многомерный массив или матрица. Они построены следующим образом:
var Avengers = [
[ 'ironman', 'dr.strange', 'cap.america' ],
[ 'blackwidow', 'scarletwitch', 'wasp' ]
];
Вы также можете создать многомерный массив с помощью конструктора Array () следующим образом:
var Avengers = new Array(
new Array('ironman', 'dr.strange', 'cap.america'),
new Array('blackwidow', 'scarletwitch', 'wasp')
);
Элементы в многомерном массиве адресуются так же, как и отдельные массивы, но для разницы мы адресуем каждый элемент, используя несколько значений, начиная с самого внешнего массива. Например, значение wasp находится в индексе 1 самого внешнего массива и индексе 2 вложенного массива, поэтому мы будем называть его Avengers [1] [2].
Для лучшего понимания рассмотрим эту таблицу:
Индексирование массива строками вместо чисел
Мы можем индексировать массив, используя строки, а не числа. Это часто бывает полезно, когда мы используем многомерные массивы для группировки связанных данных.
Мы не можем напрямую собрать массив со строковыми индексами и заполнить его, для этого мы должны сначала создать пустой массив, а затем проиндексировать и заполнить его.
var Avengers = []; Avengers['males'] = [ 'ironman', 'dr.strange', 'cap.america' ]; Avengers['females'] = [ 'blackwidow', 'scarletwitch', 'wasp' ];
Теперь мы можем называть «железного человека» Мстителями [«мужчины»] [0], а «алая ведьма» - как Мстителей [«женщины»] [1].
Превращение массива в строку.
JavaScript предоставляет ряд методов для обработки массивов. Одна из самых полезных - это возможность превращать массив в строку.
По методу join ()
Метод join объединяет все элементы массива в строку вместе с разделителем. Если аргумент-разделитель опущен, по умолчанию используется запятая:
var Avengers = [ 'ironman', 'dr.strange', 'cap.america' ];
var together = Avengers.join('');
alert(together);
var list = Avengers.join();
alert(list);
var sentence = Avengers.join(' and ')
alert(sentence);
Теперь вместе это «ironmandr.strangecap.america», список - «ironman, dr.strange, cap.america», а предложение - «ironman, dr.strange и cap.america».
С помощью метода toString ()
Вы также можете преобразовать массив в строку с помощью метода toString ().
var Avengers = [ 'ironman', 'dr.strange', 'cap.america' ]; var together = Avengers.toString(); alert(together); // ironman,dr.strange,cap.america
Метод toString также работает так же, как метод join (), но в отличие от метода join (), который может объединять массив с помощью разделителя, метод toString () объединяет массив только через запятую.
Добавление или удаление элементов из массива
Чтобы изменить или удалить данные из массива, вы должны знать, как добавлять или удалять элементы из массива. JavaScript предоставляет различные методы для добавления, удаления или изменения данных массива. Некоторые методы выполняют одну и ту же задачу, но используют другой подход.
Изменение / замена существующего значения на новое.
Итак, вы создали массив и по какой-то причине хотите изменить конкретное значение массива. Это можно сделать с помощью оператора присваивания.
var Coffee = ['Americano', 'Cappuccino', 'Expresso', 'Latte']; Coffee[0] = 'Mocha'; alert(Coffee);
Теперь кофе - это мокко, капучино, экспрессо, латте.
Что ж, этот метод может быть полезен для изменения определенного значения, но, допустим, вы по ошибке даете ссылку на номер индекса, который не имеет значения, содержащего какое-либо значение. В этом случае JavaScript просто добавляет значение, которое вы присвоили этому индексу. Например
var Coffee = ['Americano', 'Cappuccino', 'Expresso', 'Latte']; Coffee[4] = "Macchiato"; alert(Coffee);
Маккиато будет добавлен в массив с индексом 4.
Теперь Cofffee - это мокко, капучино, экспрессо, латте, макиато.
Но такой способ добавления элементов в массив - не лучшая практика. Рассмотрим данный пример
var Coffee = ['Americano', 'Cappuccino', 'Expresso', 'Latte']; Coffee[5] = "Macchiato"; alert(Coffee);
Здесь вы можете видеть, что у нас есть 4 элемента в массиве, а последний индекс равен 3. Вместо того, чтобы ссылаться на 4-й индекс для присвоения значения, мы ссылались на 5-й. Это создаст пустое или нулевое значение между 3-м и 5-м индексами.
Таким образом, чтобы добавить или удалить значения без каких-либо проблем, JavaScript предоставляет различные методы работы и упрощения нашей работы.
Добавление участников: методы push () и unshift ()
Метод unshift () добавляет новые элементы в начало массива и возвращает новую длину.
var DBZ = ['Goku', 'Vegita', 'Gohan', 'Goten'];
DBZ.unshift("Frieza");
alert(DBZ);
DBZ теперь будет называться Frieza, Goku, Vegita, Gohan, Goten.
Метод push () добавляет заданные элементы в последний элемент массива и возвращает длину нового массива.
var DBZ = ['Goku', 'Vegita', 'Gohan', 'Goten'];
DBZ.push("Trunks");
alert(dbz);
DBZ теперь будет Goku, Vegita, Gohan, Goten, Trunks
Удаление участников: методы pop () и shift ()
Подобно push () и unshift () JavaScript предоставляет два полезных метода для удаления элемента с начала и с конца.
Метод shift () удаляет первый элемент из массива и возвращает этот удаленный элемент. Этот метод изменяет длину массива, для которого мы вызываем метод shift ().
var Naruto = ['Naruto', 'Sasuke', 'Sakura', ' Hinata']; Naruto.shift(); alert(Naruto);
Теперь Наруто будет Саске, Сакура, Хината
Метод pop () удаляет последний элемент массива и возвращает этот элемент.
var Naruto = ['Naruto', 'Sasuke', 'Sakura', ' Hinata']; Naruto.pop(); alert(Naruto);
Теперь Наруто будет Наруто, Саске, Сакура
Понимание методов splice () и slice ()
Теперь мы знаем, как добавить / удалить элемент из массива с начала или с конца. Пришло время понять, как можно добавить или удалить элемент между элементами массива.
Метод splice () - это встроенный в JavaScript метод, который используется для изменения содержимого массива путем удаления существующих элементов и / или добавления новых элементов.
Синтаксис:
Array.splice( index, remove_count, item_list )
. index: Index, обязательно. Целое число, указывающее, в какой позиции добавлять / удалять элементы. Используйте отрицательные значения, чтобы указать позицию от конца массива.
. remove_count: Необязательно. Количество удаляемых элементов. Если установлено значение 0 (ноль), никакие элементы не будут удалены. И если он не передан, все элементы из указанного индекса будут удалены.
. item_list: Необязательно. Новый элемент (ы) для добавления в массив.
var Pokemon = [ 'Pikachu', 'Bulbasaur', 'Charmander', 'Squirtle', 'Caterpie' ]; Pokemon.splice(2); // remove ["Charmander", "Squirtle", "Caterpie"] alert(Pokemon); // Pikachu,Bulbasaur
Давайте удалим ".Charmander" из списка.
var Pokemon = [ 'Pikachu', 'Bulbasaur', 'Charmander', 'Squirtle', 'Caterpie' ]; Pokemon.splice(2,1); alert(Pokemon); // Pikachu,Bulbasaur,Squirtle,Caterpie
Давайте добавим «Evolve» между «Bulbasaur» и «Charmander».
var Pokemon = [ 'Pikachu', 'Bulbasaur', 'Charmander', 'Squirtle', 'Caterpie' ]; Pokemon.splice(2,0,'Evolve'); alert(Pokemon); // Pikachu,Bulbasaur,Evolve,Charmander,Squirtle,Caterpie
Метод slice () возвращает выбранные элементы в массиве как новый объект массива . Метод slice () выбирает элементы, начиная с заданного начального аргумента, и заканчивая заданным конечным аргументом, но не включает его.
Синтаксис:
Array.slice(start, end)
. start: целое число, указывающее, с чего начать выделение. Используйте отрицательные числа для выбора из конца массива.
. end: целое число, указывающее, где закончить выделение. Если не указано, будут выбраны все элементы от начальной позиции до конца массива. Используйте отрицательные числа для выбора из конца массива.
var life = ['eat', 'sleep', 'code', 'repeat']; var slice = life.slice(2); alert(slice); // code,repeat alert(life) // eat,sleep,code,repeat
Исходный массив останется нетронутым.
Теперь давайте удалим из массива элементы «eat» и «repeat».
var life = ['eat', 'sleep', 'code', 'repeat']; var slice = life.slice(1,3); alert(slice) // sleep,code
Вы также можете проверить, присутствует ли выбранный вами элемент в массиве или нет, с помощью метода includes (), который даст либо истину, либо ложь в зависимости от того, присутствует ли элемент в списке или нет, соответственно.
Сортировка массива в алфавитном или числовом порядке
Сортировка по буквам или цифрам позволяет упорядочить данные по определенным критериям. Вы можете упорядочить имена по алфавиту или номера телефонов по коду города и т. Д.
Метод sort () сортирует массив в алфавитном порядке.
var songs = [’Voices’, ’Wasteland’, ’Gravity’, 'Scream’, 'Runaway’]; songs.sort(); alert(songs);
Теперь отсортированный массив будет: Gravity, Runaway, Scream, Voices, Wasteland.
Для сортировки числовых значений мы не можем напрямую использовать метод sort (). Для числовой сортировки нужно написать дополнительную функцию:
var score = [25, 8, 5, 2, 4, 1, 7, 1995];
score.sort(function(a,b){
return a-b }
);
Отсортированный массив теперь будет 1, 2, 4, 5, 7, 8, 25, 1995.
Обращение массива
Метод JavaScript array reverse () меняет местами элемент массива. Первый элемент массива становится последним, а последний - первым.
Синтаксис:
Array.reverse();
Примеры:
var Avengers = [
[ 'ironman', 'dr.strange', 'cap.america' ],
[ 'blackwidow', 'scarletwitch', 'wasp' ]
];
Avengers.reverse();
alert(Avengers);
// blackwidow,scarletwitch,wasp,ironman,dr.strange,cap.america
Здесь не только внутренние элементы, но и внешние элементы также перевернуты.
Для лучшего понимания рассмотрим эту таблицу:
Спасибо, что зашли так далеко. Надеюсь, вам понравилась статья.
