Метод массива splice() в JavaScript
Метод splice() очень гибкий инструмент для работы с массивом. Он умеет добавлять, удалять и заменять элементы массива и может принимать до 3-ех аргументов.
Синтаксис метода splice()
Первый аргумент - это индекс, начиная с которого можно изменять массив. Если индекс установлен больше длины массива, то метод отработает до конца массива. Кроме того, индекс может быть отрицательным и тогда начнет работу с конца массива, (-1 берет последний элемент, -2 берет предпоследний элемент).
Второй аргумент задает количество элементов для удаления из массива.
Третий аргумент указывает на то, что нужно добавить к массиву вместо удаленного элемента. Данный параметр необязательный и если его оставить пустым, то элементы будут удалены из массива.
Добавление нового элемента в массив
Создадим массив с названиями городов. Обратимся к массиву cities и передадим туда три аргумента. В первом аргументе указываем начало, с какого индекса мы начинаем изменять массив. Начиная с 'Мadrid', мы будем менять массив. Во втором аргументе указываем количество удаляемых элементов из массива. Когда число равно нулю, то из массива ничего не удаляется. Третьим аргументом добавляем новый элемент. Перед 'Madrid' встало слово 'London'.
const cities ['Riga', 'Prague', Madrid', 'Berlin']; // создание массива
const del = cities.splice(2, 0, 'London' ); // метод splice и его аргументы
console.log(cities); // ['Riga', 'Prague', 'London', 'Madrid', 'Berlin'];
С помощью этой записи мы вставили новый элемент на второй индекс в массиве.
Замена элемента массива
У нас есть массив с числами. Задача такая - заменить значение второго элемента. Чтобы сделать замену, сначала нужно удалить это значение. Указываем название массива, сам метод и передадим первым аргументом порядковый номер элемента в массиве, число 1. Не забываем о том, что в программировании отсчет ведется с нуля. Вторым аргументом передадим количество элементов, которые нужно удалить. Мы хотим удалить один элемент. И третьим аргументом указываем новое значение элемента, который мы хотим добавляем в массив. Замена числа прошла успешно.
const number [20, 10, 50, 4, 6]; // создание массива
number.splice(1, 1, 30 ); // метод splice и его аргументы
console.log(number); // проверка результата [20, 30, 50, 4, 6]
Удаление числового элемента массива
Например, мы хотим удалить второй элемент из массива. Указываем, начиная с какого индекса (1) следует удалить элемент и количество удаляемых элементов (1).
const number [20, 10, 50, 4, 6]; // создание массива
number.splice(1, 1); // метод splice и его аргументы
console.log(number); // проверка результата [20, 50, 4, 6]
Удаление строкового элемента из массива
Мы начинаем удалять элементы, начиная с третьего индекса, в количестве одного элемента. На выходе получаем массив без элемента 'Madrid'.
const cities ['Riga', 'Prague', 'London', 'Madrid', 'Berlin'];; // создание массива
const rem = cities.splice(3, 1); // метод splice и его аргументы
console.log(rem); // ['Riga', 'Prague', 'London', Berlin'];
Удаление нескольких элементов из массива
Например, мы хотим удалить второй и третий элемент из массива. Первым аргументом указываем, начиная с какого индекса удалять элементы, а вторым аргументом - количество удаляемых элементов.
const number [20, 10, 50, 4, 6]; // создание массива
number.splice(1, 2); // метод splice и его аргументы
console.log(number); // проверка результата [20, 4, 6]
Пример отрицательного индекса
При отрицательном индексе, элементы удаляются с конца массива. Удалим один элемент, начиная со второго элемента с конца.
const number [20, 10, 50, 4, 6]; // создание массива
number.splice(-2, 1); // метод splice и его аргументы
console.log(number); // проверка результата [20, 10, 50, 6]
Если вы чувствуете, что создание сайтов стало вашей страстью, но вам не хватает динамики на страницах: создавать анимацию, взаимодействовать с пользователем, делать удобные интерфейсы, то смело переходите по этой ссылке и смотрите мой видеокурс по JavaScript. Это то, что вам не хватает для развития и продвижения вперед.
-
Создано 27.01.2021 10:46:42
-
Михаил Русаков
Комментарии (1):
Неправильно створюються масиви в прикладах, правильно, наприклад, так: let міста = ["Кіровськ", "Луганськ", "Стаханов"];
Ответить
Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.