От автора: приветствую вас, друзья. Продолжаем работать с массивами в JavaScript. В этой статье мы познакомимся с некоторыми полезными методами для работы с массивами в JavaScript.
В одной из предыдущих статей мы с вами уже познакомились с некоторыми полезными методами для работы с массивами, это методы pop(), push(), shift() и unshift(). В этой статье мы добавим в свою коллекцию еще несколько нужных методов.
Первая функция, которая однозначно пригодится вам в работе — метод split(). Этот метод позволяет из строки получить массив. Составные части строки, разделенные определенным разделителем, станут элементами массива. Простейший пример. У нас есть строка с набором имен, отделенных друг от друга запятыми. Из этой строки мы хотим получить массив. Нам поможет именно метод split():
1 2 3 |
var namesStr = 'John, James, Jane, Jake'; var namesArr = namesStr.split(', '); console.log(namesArr); |
В качестве разделителя мы указали запятую с пробелом, поскольку именно эта комбинация символов использована в строке. Однако разделителем может быть и любой другой символ или группа символов. Например, у нас есть строка, слова в которой отделены друг от друга вертикальной чертой:
1 2 3 |
var namesStr = 'John|James|Jane|Jake'; var namesArr = namesStr.split('|'); console.log(namesArr); // ["John", "James", "Jane", "Jake"] |
Как видим, мы получили все тот же массив. Метод split() имеет также второй необязательный параметр, которым при необходимости можно ограничить длину массива:
1 2 3 |
var namesStr = 'John|James|Jane|Jake'; var namesArr = namesStr.split('|', 2); console.log(namesArr); // ["John", "James"] |
Следующий метод, с которым мы познакомимся — метод join(). Функция join() является антонимом функции split(). join() из массива позволяет получить строку, где бывшие элементы массива будут отделены друг от друга указанным разделителем:
1 2 3 |
var namesArr = ["John", "James", "Jane", "Jake"]; var namesStr = namesArr.join(', '); console.log(namesStr); // John, James, Jane, Jake |
Если вы знакомы с PHP, тогда заметили, что эти методы являются аналогами функции explode() и implode() в PHP.
Еще один метод, с которым мы поработаем в этой статье, — метод splice(). Этот метод посложнее всех предыдущих, но он и умеет побольше. Давайте рассмотрим на нескольких примерах возможности метода splice(). Прежде всего, этот метод используется для удаления элементов массива. Для этого мы можем передать два параметра: первый параметр укажет ключ элемента, с которого нужно начать операция, второй параметр — количество элементов, которые нужно удалить:
1 2 3 |
var names = ["John", "James", "Jane", "Jake"]; names.splice(1, 2); console.log(names); |
Мы начали со второго элемента (ключ 1) и удалили из массива 2 элемента, т.е. второй и третий. Очень удобно. Если не указывать второй параметр, тогда будут удалены все элементы массива, начиная с ключа, переданного первым параметром:
1 2 3 |
var names = ["John", "James", "Jane", "Jake"]; names.splice(1); console.log(names); // ["John"] |
Кроме простого удаления метод splice() умеет заменять элементы, для этого достаточно перечислить вставляемые элементы третьим и последующими параметрами. Пример:
1 2 3 |
var names = ["John", "James", "Jane", "Jake"]; names.splice(1, 2, 'Иванов', 'Петров'); console.log(names); |
Вместо удаленных имен James и Jane мы вставили фамилии Иванов и Петров. При этом мы можем добавить больше элементов, чем удалили, интерпретатор JavaScript просто сдвинет оставшиеся элементы вправо. Попробуйте самостоятельно.
Также у нас есть возможность вставить в средину массива элементы, ничего при этом не удаляя. Для этого необходимо в качестве второго параметра передать методу splice() число 0:
1 2 3 |
var names = ["John", "James", "Jane", "Jake"]; names.splice(1, 0, 'Иванов', 'Петров'); console.log(names); |
Очень удобный метод, не правда ли? В следующих статьях мы рассмотрим другие методы для работы с массивами. Если вы хотите больше узнать о JavaScript, тогда рекомендую обратить свое внимание на уроки по JavaScript и отдельный курс по языку JavaScript. Удачи!