Спланування JavaScript масиву проти фрагмента


195

У чому різниця між spliceі slice?

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

2
Splice та Slice - це вбудовані команди Javascript - не конкретно команди AngularJS. Фрагмент повертає елементи масиву від "запуску" до тих пір, поки не буде визначено специфікатор "end". Сплайс мутує фактичний масив і починається з "пуску" та зберігає вказану кількість елементів. У 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);


20
Важливо також зауважити, що метод масиву slice () може використовуватися для копіювання масивів, не передаючи жодних аргументівarr1 = arr0.slice()
Mg Gm

3
Ви можете думати про це так splice, як уряд, який бере у вас податки. В той час, sliceяк скоріше хлопець з копіюванням.
radbyx

.splice()є надзвичайно неінтуітівнимі, я витратив віку , намагаючись з'ясувати , чому посилання на вихідний масив поверталися , undefinedпоки я не знайшов цю тему.
Ніксінова

61

З'єднання та зріз - це функції масиву Javascript.

Splice vs Slice

  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рахуються не з позиції x, а з першого елемента масиву.
Рамеш Парік

Ще одне, що я зазначив: замість цього 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

Чому це не головна відповідь?
JJ Labajo

23

Ось простий трюк, щоб запам'ятати різницю між slicevssplice

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)як коротке для "вказати довжину", що другим аргументом має бути довжина, а не індекс


1
Це не просто те, як ви вказуєте аргументи. Один з них (сплайс) модифікує базовий масив, а інший - ні.
Арбітр

також міг би сприймати сплайс як спліт (генерує 2 масиви) + зріз

14

Сплайс - посилання MDN - специфікація ECMA-262

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

Параметри

  • start: вимагається. Початковий індекс.
    Якщо startвід’ємний, то "Math.max((array.length + start), 0)"з кінця 2010 року це трактується відповідно до специфікацій (наведений нижче приклад) 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


Фрагмент - посилання MDN - специфікація ECMA-262

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

  • begin: необов’язково. Початковий індекс (за замовчуванням 0).
    Якщо beginвід’ємний, то "Math.max((array.length + begin), 0)"з кінця 2010 року це трактується відповідно до специфікацій (наведений нижче приклад) array.
  • end: необов’язково. Останній індекс для вилучення, але не включає (array.length за замовчуванням). Якщо endвід’ємний, то "Math.max((array.length + begin),0)"з кінця 2010 року це трактується відповідно до специфікацій (наведений нижче приклад) 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

Порівняння продуктивності

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


12

Splice та Slice - це вбудовані команди Javascript - не конкретно команди AngularJS. Фрагмент повертає елементи масиву від "запуску" до тих пір, поки не буде визначено специфікатор "end". Сплайс мутує фактичний масив і починається з "пуску" та зберігає вказану кількість елементів. У Google є багато інформації про це, лише пошук.


2
Сплайс видаляє вказане число і потім вставляє будь-які наступні аргументи.
Джосія Келлер

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);

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


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

фрагмент не змінює початковий масив, він повертає новий масив, але сплайс змінює вихідний масив.

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].

Другий аргумент методу сплайсингу відрізняється від методу зрізу. Другий аргумент в сплайсі представляють кількість елементів, які потрібно вилучити, а в фрагменті вони представляють кінцевий індекс.

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. Вище наведено основні відмінності між методом зрощення та зрізом.


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 ()

Example1 by 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/

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.