JavaScript Array splice() Method Diziden Öğe Ekleme - Silme

javascript splice() Method, mevcut öğeleri silmek, yeni öğeler eklemek ve bir dizideki öğeleri değiştirmek için JavaScript Array Methodu nasıl kullanacağınızı gösterir.

JavaScript Dizi türü, splice() Methodu bir dizinin ortasına yeni öğeler eklemenizi sağlayan çok güçlü bir method sağlar. Ancak, bu methodu mevcut öğeleri silmek ve değiştirmek için de kullanabilirsiniz.

Not: Bu yöntem, orijinal diziyi değiştirir.

Sözdizimi:

index: Gereklidir. Öğelerin hangi konumda ekleneceğini / silineceğini belirten bir tamsayı, Dizinin sonundan konumu belirtmek için negatif değerler kullanın.

howmany: İsteğe bağlıdır. Silinecek öğe sayısı. 0 olarak ayarlanırsa, hiçbir öğe silinmeyecektir.

item1, ..., itemX: İsteğe bağlıdır. Diziye eklenecek yeni öğeleri belirtir.

JavaScript Array splice() Methodu Kullanarak Öğeleri Silme

Bir dizideki öğeleri silmek için splice() Methodu aşağıdaki gibi iki argüman iletirsiniz:

index argümanı silinecek ilk öğenin konumunu belirtir; Ve num argümanı silinecek öğe sayısını belirler.

Aşağıdaki örneğe bir göz atalım. Diyelim ki, puanlar adında dizimiz olsun 1'den 5'e kadar beş sayı içeren bir dizimiz var.

let puanlar = [1, 2, 3, 4, 5];

Aşağıdaki ifade puanlar dizisinin, ilk öğeden başlayarak dizinin üç öğesini siler.

let deletepuanlar = puanlar.splice(0, 3);

puanlar Dizi şimdi iki elemanları içerir.

console.log(puanlar); //  [4, 5]

Ve deletepuanlar dizi üç öğe içerir.

console.log(deletepuanlar); // [1, 2, 3]

Aşağıdaki şekil puanlar.splice(0,3) yukarıdaki method çağrısını göstermektedir .

JavaScript Array splice() Methodu Kullanarak Öğe Ekleme

splice() İkinci bağımsız argüman sıfır olan methoda üç veya daha fazla bağımsız değişken ileterek bir diziye, bir veya daha fazla öğe ekleyebilirsiniz.

Aşağıdaki sözdizimini düşünün:

Bu sözdiziminde:

• index argümanı, Yeni elemanlar eklenecek Dizi başlangıç konumunu belirler.
• İkinci argüman, splice() methodu herhangi bir dizi elemanını silmemesi talimatını veren sıfırdır (0)
• Üçüncü bağımsız Argüman, dördüncü bağımsız Argüman vb... Diziye eklenen yeni öğelerdir.

colors dizeyle adlandırılmış üç elemanlı bir diziniz olduğunu varsayarsak.

let colors = ['red', 'green', 'blue'];

Aşağıdaki ifade, ikinci öğeden başlayarak bir öğe ekler.

colors.splice(2, 0, 'purple');

colors Dizi şimdi ikinci pozisyonda eklenen yeni elemanı ile dört elemanı vardır.

console.log(colors); // ["red", "green", "purple", "blue"]

Aşağıdaki şekil yukarıdaki method çağrısını göstermektedir.

Aşağıdaki örnekte olduğu gibi splice() methodu dördüncü bağımsız değişkeni, beşinci bağımsız değişkeni vb. İleterek birden fazla öğe ekleyebilirsiniz.

Dizinin birinci indeks'inden itibaren "yellow", "gri" öğelerini ekleyin.

colors.splice(1, 0, 'yellow', 'gri');

console.log(colors); 

// ["red", "yellow", "gri", "green", "purple", "blue"]

JavaScript Array splice() methodu Kullanarak Öğeleri Değiştirme

splice() Methodu aynı anda mevcut elemanlarını silerken Bir diziye yeni öğeler eklemek için izin verir.

Bunu yapmak için, en az üç bağımsız argüman iletirsiniz, Birincisi dizi elemanın indeksi, ikincisi silinecek öğe sayısını belirtir ve üçüncüsü eklenecek öğeleri belirtir.

Silinecek öğe sayısının eklenecek öğe sayısıyla aynı olması gerekmediğini unutmayın.

Aşağıdaki gibi dört öğeli bir dizi programlama diline sahip olduğunuzu varsayalım:

let languages = ['C', 'C++', 'Java', 'JavaScript'];

Aşağıdaki ifade, ikinci öğeyi yenisiyle değiştirir.

languages.splice(1, 1, 'Python');

languages Dizisi halen yeni ikinci bağımsız değişken ile dört elemana sahiptir 'C++' yerine 'Python'.

console.log(languages); 

// ["C", "Python", "Java", "JavaScript"]

Aşağıdaki şekil yukarıdaki yöntem çağrısını göstermektedir.

Aşağıdaki gibi splice() methodu daha fazla argüman ileterek bir öğeyi birden çok öğeyle değiştirebilirsiniz :

languages.splice(2,1,'C#','Swift','Go');

Yukarıda'ki ifade, ikinci öğeden bir öğeyi siler, yani languages diziye Java üç yeni öğe ekler. Sonuç aşağıdaki gibidir.

console.log(languages); // ["C", "Python", "C#", "Swift", "Go", "JavaScript"]

Bu eğitimde, splice() methodu mevcut öğeleri silmek, yeni öğeler eklemek ve bir dizideki öğeleri değiştirmek için JavaScript Array methodunu nasıl kullanacağınızı öğrendiniz.

Çeşitli Örnekler:

Örnek1: Birinci öğeden sonraki tüm öğeleri silin. Not: Diziler sıfırdan(0) başladığını unutmayın.

var arr = ['A', 'B', 'C', 'D'];  

var removed = arr.splice(1, arr.length-1);

console.log('Original Array: ', arr)
console.log('Removed Elements: ', removed)

// yeni dizi ['A'] 
// silinenler ['B', 'C', 'D']

Örnek2: Birinci elemandan sonraki tüm elemanları değiştirin.

var arr = ['A', 'B', 'C', 'D'];

var removed = arr.splice(1, arr.length-1, 'X', 'Y', 'Z');

console.log('Original Array: ', arr)
console.log('Removed Elements: ', removed)

// yeni dizi ['A', 'X', 'Y', 'Z'] 
// silinen öğeler ['B', 'C', 'D']

Örnek3: İkinci Argümana 0 (sıfır) elemanı iletin(Eleman silinmez) ve 2. dizine 2 eleman ekleyin

var arr = ['A', 'B', 'C', 'D'];

var removed = arr.splice(2, 0, 'X', 'Y');

console.log('Original Array: ', arr)
console.log('Removed Elements: ', removed)

// yeni dizi ['A', 'B', 'X', 'Y', 'C', 'D']
// sıfır silinen []

Örnek4: Belirli bir dizini takip eden tüm öğeleri silin.

var arr = ['A', 'B', 'C', 'D', 'E', 'F'];

index = 3

var removed = arr.splice(index);

console.log('Original Array: ', arr)
console.log('Removed Elements: ', removed)

// yeni dizi ['A', 'B', 'C']
// silinenler ['D', 'E', 'F']

Çeşitli örnekler

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

console.log(array.splice(2));
// Çıktı: [3, 4, 5], silinen öğeleri yeni bir dizi nesnesi olarak döndürdü.
 
console.log(array);
// Çıktı: [1, 2], orijinal dizi değiştirildi.
 
var array2=[6,7,8,9,0];
console.log(array2.splice(2,1));
// Çıktı: [8]
 
console.log(array2.splice(2,0));
//Çıktı: [] , sıfır argüman nedenle öğe silinmedi
 
console.log(array2);
// Çıktı: [6,7,9,0]
 
var array3=[5,6,7,8,9];
console.log(array3.splice(2,1,"Hello","World"));
// Çıktı: [7]
 
console.log(array3);
// Çıktı: [5, 6, "Hello", "World", 8, 9]
 
           -5 -4 -3 -2 -1
            |  |  |  |  |
var array4=[16,17,18,19,20];
             |  |  |  |  |
             0  1  2  3  4
 
console.log(array4.splice(-2,1,"webcebir"));
// Çıktı:  [19]
 
console.log(array4);
// Çıktı: [16, 17, 18, "webcebir", 20]

Bağımsız Argüman (1) NaN ise, 0'mış gibi kabul edilir.

var array5=[21,22,23,24,25];

console.log(array5.splice(NaN,4,"NaN 0 Olarak İşlem Görür"));
// Çıktı: [21,22,23,24]
 
console.log(array5);
// Çıktı: ["NaN 0 Olarak İşlem Görür",25]

Bağımsız Argüman (2), 0'dan küçükse veya NaN'a eşitse, 0'mış gibi değerlendirilir.

var array6=[26,27,28,29,30];
console.log(array6.splice(2,-5,"Hello"));
// Çıktı:Boş dizi []
 
console.log(array6);
// Çıktı: [26,27,"Hello",28,29,30]
 
console.log(array6.splice(3,NaN,"World"));
// Çıktı:Boş dizi []
 
console.log(array6);
// Çıktı: [26,27,"Hello","World",28,29,30]