Javascript copywithin() Metodu Kullanımı
Merhaba arkadaşlar. Bu yazımda javascript de copywithin() metodunun kullanımını öğrenip örneklerle pekiştireceğiz. Bir önceki javascript yazımda slice() metodundan bahsetmiştik. slice() da bir dizideki elemanları kopyalayıp değerleri döndürüyordu. Şimdi tanıtacağım metot da hemen hemen aynı ancak biraz daha gelişmiş.
copywithin() metodu, tanımlanmış olan dizinin elemanlarını verdiğimiz parametrelere göre belirttiğimiz aralıkta kopyalayarak yine parametreler ile belirttiğimiz aralıkta bulunan elemanlar ile değiştirir ve değeri döndürür. Bu metot dizinin yapısını değiştirir.
Kullanım :
copywithin( hedef, başlangıç, bitiş ) şeklinde üç parametre alabilir.
hedef : kopyalanan elemanların değişmeye başlayacağı indis numarasıdır. Yani hedef kısmına 5 yazarsanız 5. indis dahil olacak şekilde değişim başlar.
başlangıç – bitiş : başlangıç, kopyalamaya başlayacağı indis numarası, bitiş de hangi indis değerine kadar kopyalanacağını belirten indis numarasıdır. Yani başlangıç parametresine 7 bitiş parametresine 11 yazarsanız size 7 dahil 11 hariç olacak şekilde 7-8-9-10 numaraları indislere sahip elemanları alacaktır.
NOT: Sadece tek parametre kullanılırsa, girilen indis değerinden itibaren diziyi, dizinin eleman sayısı kadar yeniden yazacaktır.
Örnek;
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<script> // belirlenen parametrelere göre dizi içeriğini alır ve belirlenen yere kopyalar. 3 parametre alır. hedef, başlangıç, bitiş. var meyveler = ["elma", "armut", "kiraz", "muz", "incir", "hurma", "kivi", "ananas", "şeftali", "nar", "erik", "karpuz", "kavun", "çilek", "portakal", "mandalina", "üzüm"]; document.write("Meyveler : <br>" + meyveler + "<br><br>"); meyveler.copyWithin(4, 6, 11); document.write("Değişimden sonra meyveler : <br>" + meyveler); </script> |
Çıktısı;
Meyveler :
elma,armut,kiraz,muz,incir,hurma,kivi,ananas,şeftali,nar,erik,karpuz,kavun,çilek,portakal,mandalina,üzümDeğişimden sonra meyveler :
elma,armut,kiraz,muz,kivi,ananas,şeftali,nar,erik,nar,erik,karpuz,kavun,çilek,portakal,mandalina,üzüm
şeklinde oldu. Yukarıda vurguladığım yerlere dikkat ederseniz değişimi fark edeceksinizdir. hedef olarak 4 numaralı indisi vermiştik yani 5. eleman dahil kopyalanan değerler ile değişsin dedik. indis numarası 6 olan eleman dahil 11. indis numarasına kadar elemanları kopyala dedik yani 5 eleman. Kopyala sonrasında hedef değerinden başladı ve kopyalama adedi kadar değişim yaptı. Dikkat ederseniz dizinin eleman sayısı değişmedi.
Diğer Örnek;
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<script> // belirlenen parametrelere göre dizi içeriğini alır ve belirlenen yere kopyalar. 3 parametre alır. hedef, başlangıç, bitiş. var meyveler = ["elma", "armut", "kiraz", "muz", "incir", "hurma", "kivi", "ananas", "şeftali", "nar", "erik", "karpuz", "kavun", "çilek", "portakal", "mandalina", "üzüm"]; document.write("Meyveler : <br>" + meyveler + "<br><br>"); meyveler.copyWithin(8); document.write("Değişimden sonra meyveler : <br>" + meyveler); </script> |
Çıktısı;
Meyveler :
elma,armut,kiraz,muz,incir,hurma,kivi,ananas,şeftali,nar,erik,karpuz,kavun,çilek,portakal,mandalina,üzümDeğişimden sonra meyveler :
elma,armut,kiraz,muz,incir,hurma,kivi,ananas,elma,armut,kiraz,muz,incir,hurma,kivi,ananas,şeftali
şeklinde olacaktır. Koyulaştırdığım yerlere bakacak olursanız, bir başlangıç ve bitiş parametresi belirtmediğimiz için dizinin sonuna kadar değişim devam etti. Yani diziyi 0 numaralı indisten aldı ve kendisinine bitiş olarak da son indisi seçti. Bu durumda copywithin() metoduna başlangıç ve bitiş belirtmezsen kendisine başlangıç olarak ilk indisi bitiş olarak da son indisi alır diyebiliriz.
Javascript de dizi içerisinden eleman kopyalayarak değiştirme bu şekilde. Bir sonraki yazıda görüşmek üzere.