В этой статье мы поговорим о методах вставки и среза, различиях между ними и о том, как их использовать в массивах.
Что делать, если вам нужно добавить элементы или манипулировать элементами в разных местах массива? Для этого вы можете использовать прямой доступ к индексу.
const hobbies = ['cooking', 'sports', 'games']; hobbies[1] = 'running';
Итак, здесь мы можем выбрать элемент с индексом один и установить его как новый элемент, он не обязательно должен быть того же типа, что и предыдущий элемент, кстати, я могу установить номер или что-то еще.
Давайте посмотрим на другой случай, что, если мы на самом деле нацелимся на индекс, который не установлен как индекс 6 в массиве, скажем, он содержит только два элемента.
let hobbies = ['reading', 'cooking']; hobbies[6] = 'sports'; console.log(hobbies); ['reading', 'cooking', empty x 4, 'sports'];
Что мы получили здесь, так это то, что у нас есть первые два элемента как они есть, затем 4 пустых индекса, а затем последний элемент, который мы добавили (спорт), кстати, это действительно пустые места в массиве, если бы вы получили доступ один из них, вы получите undefined, потому что в конце концов там ничего не было найдено, так что все это приятно знать.
Теперь этот способ добавления элементов очень редок, когда вы добавляете что-то с произвольным номером индекса, когда вы намеренно или ненамеренно оставляете пустые места в массиве, что не то, что вы хотите делать в 99,99% случаев, поэтому это редко используется.
Тем не менее, приятно знать, что вы можете напрямую ориентироваться на индексы, которые даже не существуют, и присваивать им значения.
Метод сплайсинга()
Если мы хотим вставить элемент между двумя элементами в массиве, есть другой метод, который называется splice()метод.
На самом деле splice() — чрезвычайно полезный метод, который позволяет нам делать с массивами всевозможные вещи, поэтому давайте начнем с того случая, когда элемент добавляется между двумя элементами в массиве.
Теперь, как это splice()работает? Он принимает как минимум два аргумента, но есть и другая версия, которая принимает больше аргументов, поэтому существует две разные версии этого метода.
Итак, вы указываете начальный индекс, а затем количество элементов, которые вы хотите удалить из этого индекса, теперь мы не хотим ничего удалять здесь, поэтому, возможно, мы начнем с нулевого индекса и добавьте ноль во второй аргумент, потому что мы не хотим ничего удалять вместо этого, и теперь в игру вступает вторая версия метода, которую мы можем добавьте дополнительные аргументы, которые будут элементами, вставленными вместо этих удаленных значений во вторых аргументах.
let hobbies = ['reading', 'sports']; hobbies.splice(0,0,'music'); console.log(hobbies); // ['music', 'reading', 'sports'] hobbies.splice(1,0,'coding); console.log(hobbies); // ['music', 'coding', 'reading', 'sports']
Итак, как работает splice():
- Сообщите ему индекс, с которого он должен начать поиск, включая тот индекс, который вы передаете ему в первом аргументе.
- Удалите столько элементов, сколько я укажу здесь во втором аргументе, мы устанавливаем его равным нулю, потому что мы не хотим удалять какие-либо элементы.
- вставьте в следующие аргументы все элементы, которые вы хотите добавить.
что произойдет дальше, так это то, что метод сдвинет все элементы, начиная с индекса, который мы указали в первом аргументе, а затем вставит все элементы один за другим, не удаляя ни одного старого элемента из массива.
Кстати, это один из методов, который доступен только для реальных массивов, а не для итерируемых объектов, а не для массивоподобных объектов, и это может быть одной из причин, по которой вы конвертируете массивоподобный объект или итерируемый объект в реальный массив с Array.from(), потому что тогда в этом реальном массиве вы можете использовать метод splice().
Вот как работает сращивание и как его можно использовать для вставки элементов внутрь массива, а также можно использовать if для удаления.
let hobbies = ['reading', 'sports']; hobbies.splice(0,1); console.log(hobbies); //['sports']
splice()возвращает удаленные значения в новый массив, чтобы мы могли сохранить его и распечатать.
Теперь, как мы видели, мы использовали его, чтобы начать просмотр с нулевого индекса, а затем мы сказали ему удалить один элемент, чтобы он удалил элемент с нулевым индексом, конечно, вы можете удалить больше элементов, вы можете удалить столько элементов, сколько хотите. .
Теперь, если мы использовали splice только с одним аргументом, например hobbies.splice(0), он удалит все элементы внутри массива из того индекса, который мы передали, и так далее.
let hobbies = ['reading', 'sports', 'gaming', 'coding']; let deletedArray = hobbies.splice(2); console.log(hobbies, deletedArray); //['reading', 'sports'] <== hobbies //['gaming', 'coding'] <== deletedArray
Приятно знать, что splice() также работает с отрицательными индексами здесь, вы можете указать первый аргумент равным -1 или -2, и тогда он перейдет в конец массива и будет смотреть справа, поэтому, если мы передали -1, он будет посмотреть на последний элемент массива и так далее.
В этом примере удаляется последний элемент массива
hobbies.splice(-1,1);
Таким образом, здесь разрешены отрицательные индексы для доступа к массиву справа.
Кстати, вы должны знать, что это не разрешено для обычного доступа к данным на основе индексов в массивах.
hobbies[-2]; //undefined
Таким образом, отрицательные индексы действительно являются исключительными для нескольких методов, и splice()method является одним из них.
Теперь мы увидели метод splice(), который является действительно универсальным методом для добавления, удаления и вставки элементов.
Метод Slice()
Теперь вы можете использовать другой метод, который имеет название, похожее на splice(), но делает нечто совершенно другое, а именно slice()method.
let nums = [1,2,3,4,5]; console.log(nums.slice()); // [1,2,3,4,5]
Вы можете использовать slice()like, и вы увидите в основном массив.
Интересная вещь, которую slice() делает здесь, заключается в том, что она возвращает совершенно новый массив, и на самом деле это хороший способ копирования массива.
Массивы являются конечными объектами и, следовательно, ссылочными значениями, поэтому, если вы сравните массив с массивом, который выглядит полностью равным нам, людям, он вернет false, если это не совсем тот же объект.
Если мы создали массив и сохранили копию этого массива в другой переменной, а затем запихнули элемент в первый массив, мы увидим, что первый и второй массивы затронуты не только первым, потому что массивы являются эталонными значениями и подтверждением то, что мы храним здесь, просто указатель на это место в памяти, просто адрес массива.
Так что slice() поможет нам в этом случае, поскольку он возвращает совершенно новый массив на основе старого массива.
let nums = [1,2,3,4,5]; let numsCopy = nums.slice();
Теперь numsCopy — это совершенно новый массив, не связанный со ссылкой на старый массив (nums), поэтому, если мы добавим некоторые элементы в старый массив, это не повлияет на новый массив.
Но на самом деле slice() также удобен для выбора диапазонов массива, поэтому, если вы хотите выбрать часть массива, а не весь массив, slice() вам в этом поможет.
let nums = [1,2,3,4,5]; let numsCopy = nums.slice(0,2); console.log(num, numsCopy); // [1,2,3,4,5] <== nums // [1,2] <== numsCopy
Вы просто передаете этот начальный индекс в slice(), и он будет включен в массив, а второй элемент будет последним и не будет включен в новый массив.
Вы также можете передавать отрицательные числа в качестве аргументов.
let nums = [1,2,3,4,5]; let numsCopy = nums.slice(-3,-1); console.log(nums, numsCopy); // [1,2,3,4,5] <== nums // [3,4] <== numsCopy
Существует также полезный метод для добавления элементов в массив и возврата нового массива, который может быть полезен в ситуациях, когда вы хотите создать копию массива.
Если у вас есть какие-либо вопросы, как всегда, обращайтесь через Facebook ❤
