JavaScript Массив сплайс против ломтика

195

В чем разница между spliceи slice?

$scope.participantForms.splice(index, 1);
$scope.participantForms.slice(index, 1);
Ренат Гатин
источник
2
Splice и Slice - это встроенные команды Javascript, а не команды AngularJS. Slice возвращает элементы массива от «start» до непосредственно перед спецификаторами «end». Splice изменяет фактический массив и начинается с «start» и сохраняет количество указанных элементов. У Google есть много информации по этому вопросу, просто поиск.
mrunion
1
проверьте, помогает ли этот ответ вам stackoverflow.com/questions/1777705/…
Фабио Луис
Методы splice () видоизменяют массив путем добавления в массив или удаления из массива и возвращают только удаленные элементы.
Shaik Md N Rasool

Ответы:

266

splice()изменяет исходный массив, тогда как slice()нет, но оба возвращают объект массива.

Смотрите примеры ниже:

var array=[1,2,3,4,5];
console.log(array.splice(2));

Это вернется [3,4,5]. Исходный массив влияет в результате arrayтого [1,2].

var array=[1,2,3,4,5]
console.log(array.slice(2));

Это вернется [3,4,5]. Исходный массив не влияет с в результате arrayтого [1,2,3,4,5].

Ниже приведена простая скрипка, которая подтверждает это:

//splice
var array=[1,2,3,4,5];
console.log(array.splice(2));

//slice
var array2=[1,2,3,4,5]
console.log(array2.slice(2));


console.log("----after-----");
console.log(array);
console.log(array2);

Thalaivar
источник
20
Также важно отметить, что метод массива slice () можно использовать для копирования массивов, не передавая никаких аргументовarr1 = arr0.slice()
Mg Gm
3
Вы можете думать об этом, как spliceбудто правительство берет налоги с вас. Принимая во внимание, что sliceэто больше всего парня-копировщика.
Radbyx
.splice()является чрезвычайно неинтуитивными, я потратил возрастов , пытаясь выяснить , почему ссылки на исходный массив возвращались , undefinedпока я не нашел эту тему.
Никсинова
61

Splice и Slice оба являются функциями Javascript Array.

Сплайс против ломтика

  1. Метод splice () возвращает удаленный элемент (ы) в массиве, а метод slice () возвращает выбранный элемент (ы) в массиве как новый объект массива.

  2. Метод splice () изменяет исходный массив, а метод slice () не изменяет исходный массив.

  3. Метод splice () может принимать n аргументов, а метод slice () принимает 2 аргумента.

Сращивание с примером

Аргумент 1: Индекс, обязательно. Целое число, указывающее, в какой позиции добавлять / удалять элементы. Используйте отрицательные значения, чтобы указать позицию в конце массива.

Аргумент 2: необязательно. Количество предметов, которые будут удалены. Если установлено значение 0 (ноль), элементы не будут удалены. И если не пройдено, все элементы из указанного индекса будут удалены.

Аргумент 3… n: Необязательно. Новый элемент (ы) для добавления в массив.

var array=[1,2,3,4,5];
console.log(array.splice(2));
// shows [3, 4, 5], returned removed item(s) as a new array object.
 
console.log(array);
// shows [1, 2], original array altered.
 
var array2=[6,7,8,9,0];
console.log(array2.splice(2,1));
// shows [8]
 
console.log(array2.splice(2,0));
//shows [] , as no item(s) removed.
 
console.log(array2);
// shows [6,7,9,0]

Срез с примером

Аргумент 1: обязательно. Целое число, указывающее, с чего начать выбор (первый элемент имеет индекс 0). Используйте отрицательные числа для выбора в конце массива.

Аргумент 2: необязательно. Целое число, которое указывает, где заканчивать выбор, но не включает. Если опущен, будут выбраны все элементы от начальной позиции и до конца массива. Используйте отрицательные числа для выбора в конце массива.

var array=[1,2,3,4,5]
console.log(array.slice(2));
// shows [3, 4, 5], returned selected element(s).
 
console.log(array.slice(-2));
// shows [4, 5], returned selected element(s).
console.log(array);
// shows [1, 2, 3, 4, 5], original array remains intact.
 
var array2=[6,7,8,9,0];
console.log(array2.slice(2,4));
// shows [8, 9]
 
console.log(array2.slice(-2,4));
// shows [9]
 
console.log(array2.slice(-3,-1));
// shows [8, 9]
 
console.log(array2);
// shows [6, 7, 8, 9, 0]

Гагандеп Гамбир
источник
3
Хотя обе функции выполняют совершенно разные задачи, в отличие от splice(x,y), в slice(x,y)втором аргументе yне учитывается с позиции х, но с первого элемента массива.
Рамеш Парик
Еще одна вещь, которую я заметил: вместо array.slice(index, count), если вы используете array.slice((index, count)), вы получите оставшуюся часть после «нарезки». Попытайся!
Рамеш Парик
23

Метод slice () возвращает копию части массива в новый объект массива.

$scope.participantForms.slice(index, 1);

Это НЕ меняет participantFormsмассив, но возвращает новый массив, содержащий единственный элемент, найденный в indexпозиции в исходном массиве.

Метод splice () изменяет содержимое массива, удаляя существующие элементы и / или добавляя новые элементы.

$scope.participantForms.splice(index, 1);

Это удалит один элемент из participantFormsмассива в indexпозиции.

Это нативные функции Javascript, AngularJS не имеет к ним никакого отношения.

Алек Кравец
источник
Кто-нибудь может привести полезные примеры, и что было бы идеально для каждого? Как ситуации, которые вы предпочитаете использовать сращивания или среза?
Petrosmm
1
этот ответ частично неверен. для splice2-го аргумента - количество элементов в возвращаемом массиве, но для slice2-го аргумента - индекс конечного элемента, который возвращает + 1. slice(index,1)Не обязательно возвращать массив из одного элемента, начиная с index. [1,2,3,4,5].slice(0,1)возвращает, [1]но [1,2,3,4,5].slice(3,1)возвращает, []потому что 1интерпретируется final index +1так, final index = 0но это до start index = 3того, как будет возвращен пустой массив.
BaltoStar
Почему это не лучший ответ?
Джей Джей Лабахо
23

Вот простой трюк , чтобы помнить разницу между sliceпротивsplice

var a=['j','u','r','g','e','n'];

// array.slice(startIndex, endIndex)
a.slice(2,3);
// => ["r"]

//array.splice(startIndex, deleteCount)
a.splice(2,3);
// => ["r","g","e"]

Trick to remember:

Думайте о "spl" (first 3 letters of splice)сокращении «указать длину», что второй аргумент должен быть длиной, а не индексом

Sajeetharan
источник
1
Это больше, чем просто как вы указываете аргументы. Один из них (сплайс) изменяет базовый массив, а другой - нет.
Арбитр
также можно рассматривать сплайс как сплит (генерирует 2 массива) + срез
14

Сращивание - ссылка MDN - спецификация ECMA-262

Синтаксис
array.splice(start[, deleteCount[, item1[, item2[, ...]]]])

параметры

  • start: обязательный. Начальный индекс.
    Если startоно отрицательное, оно обрабатывается в "Math.max((array.length + start), 0)"соответствии со спецификацией (пример приведен ниже) с конца array.
  • deleteCount: по желанию. Количество удаляемых элементов (все из, startесли не указано).
  • item1, item2, ...: по желанию. Элементы, которые будут добавлены в массив из startиндекса.

Возвращает : массив с удаленными элементами (пустой массив, если ни один не удален)

Изменить исходный массив : Да

Примеры:

const array = [1,2,3,4,5];

// Remove first element
console.log('Elements deleted:', array.splice(0, 1), 'mutated array:', array);
// Elements deleted: [ 1 ] mutated array: [ 2, 3, 4, 5 ]

// array = [ 2, 3, 4, 5]
// Remove last element (start -> array.length+start = 3)
console.log('Elements deleted:', array.splice(-1, 1), 'mutated array:', array);
// Elements deleted: [ 5 ] mutated array: [ 2, 3, 4 ]

Больше примеров в примерах MDN Splice


Срез - ссылка MDN - спецификация ECMA-262

Параметры синтаксиса
array.slice([begin[, end]])

  • begin: по желанию. Начальный индекс (по умолчанию 0).
    Если beginоно отрицательное, оно обрабатывается в "Math.max((array.length + begin), 0)"соответствии со спецификацией (пример приведен ниже) с конца array.
  • end: по желанию. Последний индекс для извлечения, но не включая (по умолчанию array.length). Если endоно отрицательное, оно обрабатывается в "Math.max((array.length + begin),0)"соответствии со спецификацией (пример приведен ниже) с конца array.

Возвращает : массив, содержащий извлеченные элементы.

Мутировать оригинал : нет

Примеры:

const array = [1,2,3,4,5];

// Extract first element
console.log('Elements extracted:', array.slice(0, 1), 'array:', array);
// Elements extracted: [ 1 ] array: [ 1, 2, 3, 4, 5 ]

// Extract last element (start -> array.length+start = 4)
console.log('Elements extracted:', array.slice(-1), 'array:', array);
// Elements extracted: [ 5 ] array: [ 1, 2, 3, 4, 5 ]

Больше примеров в примерах MDN Slice

Сравнение производительности

Не воспринимайте это как абсолютную истину, поскольку в зависимости от каждого сценария один может быть эффективнее другого.
Тест производительности

taguenizy
источник
12

Splice и Slice - это встроенные команды Javascript, а не команды AngularJS. Slice возвращает элементы массива от «start» до непосредственно перед спецификаторами «end». Splice изменяет фактический массив и начинается с «start» и сохраняет количество указанных элементов. У Google есть много информации по этому вопросу, просто поиск.

mrunion
источник
2
Splice удаляет указанное число, а затем вставляет любые последующие аргументы.
Джосия Келлер
splice удаляет указанное количество элементов из заданного начального индекса, например, splice (4,1); удаляет один элемент, начиная с индекса 4, тогда как сплайс (4,3); удаляет три элемента, начиная с элемента с индексом 4. Затем после удаления возвращает возвращенные значения.
briancollins081
8

splice()Метод возвращает удаленные элементы в массиве. slice() метод возвращает выбранный элемент (ы) в массиве, как новый объект массива.

splice()Метод изменяет исходный массив и slice()метод не изменяет исходный массив.

  • Splice() Метод может принимать n аргументов:

    Аргумент 1: Индекс, обязательно.

    Аргумент 2: необязательно. Количество предметов, которые будут удалены. Если установлено значение 0 (ноль), элементы не будут удалены. И если не пройдено, все элементы из указанного индекса будут удалены.

    Аргумент 3..n: Необязательно. Новый элемент (ы) для добавления в массив.

  • slice() Метод может принимать 2 аргумента:

    Аргумент 1: обязательно. Целое число, указывающее, с чего начать выбор (первый элемент имеет индекс 0). Используйте отрицательные числа для выбора в конце массива.

    Аргумент 2: необязательно. Целое число, которое указывает, где заканчивается выбор. Если опущен, будут выбраны все элементы от начальной позиции и до конца массива. Используйте отрицательные числа для выбора в конце массива.

Ранджит Айядурай
источник
4

склеить и удалить элемент массива по индексу

индекс = 2

//splice & will modify the origin array
const arr1 = [1,2,3,4,5];
//slice & won't modify the origin array
const arr2 = [1,2,3,4,5]

console.log("----before-----");
console.log(arr1.splice(2, 1));
console.log(arr2.slice(2, 1));

console.log("----after-----");
console.log(arr1);
console.log(arr2);

let log = console.log;

//splice & will modify the origin array
const arr1 = [1,2,3,4,5];

//slice & won't modify the origin array
const arr2 = [1,2,3,4,5]

log("----before-----");
log(arr1.splice(2, 1));
log(arr2.slice(2, 1));

log("----after-----");
log(arr1);
log(arr2);

введите описание изображения здесь

xgqfrms
источник
3

Другой пример:

[2,4,8].splice(1, 2) -> returns [4, 8], original array is [2]

[2,4,8].slice(1, 2) -> returns 4, original array is [2,4,8]
Якуб Кубиста
источник
3

slice не меняет исходный массив, он возвращает новый массив, но splice изменяет исходный массив.

example: var arr = [1,2,3,4,5,6,7,8];
         arr.slice(1,3); // output [2,3] and original array remain same.
         arr.splice(1,3); // output [2,3,4] and original array changed to [1,5,6,7,8].

Второй аргумент метода сращивания отличается от метода среза. Второй аргумент в splice представляет количество элементов, которые нужно удалить, а в slice он представляет конечный индекс.

arr.splice(-3,-1); // output [] second argument value should be greater then 
0.
arr.splice(-3,-1); // output [6,7] index in minus represent start from last.

-1 представляет последний элемент, поэтому он начинается с -3 до -1. Выше приведены основные различия между методом сращивания и среза.

Dev Verma
источник
2

//splice
var array=[1,2,3,4,5];
console.log(array.splice(2));

//slice
var array2=[1,2,3,4,5]
console.log(array2.slice(2));


console.log("----after-----");
console.log(array);
console.log(array2);

Тахере Джалилпур
источник
Пожалуйста, предоставьте больше информации о том, что происходит
MKant
2

Разница между встроенными функциями JavaScript в Slice () и Splice () заключается в том, что Slice возвращает удаленный элемент, но не изменяет исходный массив; лайк,

        // (original Array)
        let array=[1,2,3,4,5] 
        let index= array.indexOf(4)
         // index=3
        let result=array.slice(index)
        // result=4  
        // after slicing=>  array =[1,2,3,4,5]  (same as original array)

но в случае splice () это влияет на исходный массив; лайк,

         // (original Array)
        let array=[1,2,3,4,5] 
        let index= array.indexOf(4)
         // index=3
        let result=array.splice(index)
        // result=4  
        // after splicing array =[1,2,3,5]  (splicing affects original array)
Мухаммед Абдулла
источник
0

Метод JavaScript Array splice () в качестве примера

Пример1 от tutsmake -Удалить 2 элемента из индекса 1

  var arr = [ "one", "two", "three", "four", "five", "six", "seven", "eight", "nine", "ten" ]; 

 arr.splice(1,2);

 console.log( arr ); 

Пример 2 По tutsmake - добавить новый элемент из индекса 0 JavaScript

  var arr = [ "one", "two", "three", "four", "five", "six", "seven", "eight", "nine", "ten" ]; 

 arr.splice(0,0,"zero");

 console.log( arr );  

Пример 3 от tutsmake - добавление и удаление элементов в массиве JavaScript

var months = ['Jan', 'March', 'April', 'June'];

months.splice(1, 0, 'Feb'); // add at index 1

console.log(months); 

months.splice(4, 1, 'May'); // replaces 1 element at index 4

console.log(months);

https://www.tutsmake.com/javascript-array-splice-method-by-example/

разработчик
источник