JavaScript örneklerinde diziler. JavaScript'te iki boyutlu dizi. Tek boyutlu dizi sayıları1

Bir önceki yazıda, ne olduğu ve onunla nasıl çalışılacağı hakkında konuştuk. Bu yazıda konuşacağız çok boyutlu dizi.

Aynı zamanda dizi olan bir veya daha fazla öğeye sahip bir dizidir. Özellikle reklamın derinliğine bağlı olarak çağrılabilir iki boyutlu dizi(2 seviye) ya üç boyutlu dizi(3 seviye) ya dört boyutlu(4 seviye) ve benzeri.

Tek boyutlu diziden sonra en popüler olanı iki boyutlu dizidir. Daha detaylı inceleyeceğiz.


Gördüğünüz gibi, iki boyutlu bir dizinin elemanları tek boyutlu dizilerdir. Bu tek boyutlu diziler daha fazla dizi içeriyorsa, dizi zaten üç boyutlu olurdu.

Örnek olarak, üç basit dizi oluşturalım ve bunları verilerle dolduralım. Birincisini çift sayılarla, ikincisini tek sayılarla ve üçüncüsünü bazı rasgele verilerle dolduracağız.

// Üç boş dizi bildiriniz var evenNumbers \u003d new Array (); // Değişken k - çiftNumber dizi indisleri için var k \u003d 0; var oddNumbers \u003d new Array (); // Değişken n - oddNumbers dizi indisleri için var n \u003d 0; var data \u003d new Array ("araba", "uçak", doğru, 89, "m"); // Çift Sayılar dizisini çift sayılarla doldurun (var i \u003d 1; i

Dizinin içinde ne olduğunu görmek için aşağıdaki gibi bir araç kullanabilirsiniz. konsol.

Örneğin, tek sayılı tek sayılı bir dizinin içeriğini görmek istiyoruz. Bunu yapmak için aşağıdaki koda aşağıdaki satırı yazın:

Console.log (oddNumbers);

Sonucu görmek için açmanız gerekir tarayıcıda konsol... Google Chrome'da bu şu şekilde yapılır: Sayfayı sağ tıklayın ve içerik menüsünden son seçenek olan "Kodu görüntüle" yi, yani denetçiyi seçin. İngilizce sürümde, bu seçeneğe Inspect adı verilir.


Ve altında geliştirici araç çubuğu görünecektir. İçinde Konsol sekmesine gitmeniz gerekiyor.


Şimdi için iki boyutlu bir dizi oluştur, onu bildirmeniz ve yukarıda oluşturduğunuz tek boyutlu dizileri ona eklemeniz gerekir.

// İki boyutlu bir dizi twoDimens bildirin ve onu doldurun var twoDimens \u003d new Array (evenNumbers, tekNumbers, data); console.log (twoDimens);

Konsolda bu dizinin içeriğini görelim.


iki boyutlu bir dizi üzerinde yineleme

İlk önce öğrenelim iki boyutlu bir dizinin öğelerine nasıl erişilir.

Tek dizilerde olduğu gibi, elemanlara indisleri ile erişilir.

Örneğin, tek sayılar (tekSayılar) içeren bir diziden dizin 3'teki elemanı görüntüleyelim. İki boyutlu twoDimens dizisindeki tek boyutlu oddNumbers dizisinin indeksi bir (1) 'dir.

Document.write ("oddNumbers dizisindeki dizin 3'e sahip öğe:" + twoDimens); // Eleman: 7

TwoDimens dizisinde, dizin 1'deki öğeye başvururuz. Bu dizindeki öğe, oddNumbers dizisidir. Ve bu dizide, zaten 7 numaralı indeks 3'e sahip elemana erişiyoruz.

Şimdi sorunun kendisine gelelim iki boyutlu bir dizi üzerinde nasıl döngü yapılır.

İki boyutlu bir dizi üzerinden döngü, çift döngü kullanılarak yapılır. Örneğin, twoDimens dizimizi yineleyelim.

(Var i \u003d 0; i için< twoDimens.length; i++){ for(var j = 0; j < twoDimens[i].length; j++){ document.write("

Dizinli öğe "+ i +" "+ j +" eşittir: "+ ikiDimens [i] [j] +"

"); } }

İlk döngüde, twoDimens dizisinin kendisini yineliyoruz. İkinci döngüde, elemanın kendisi (dizi) üzerinde zaten yineliyoruz. Birincisi, i değişkeni 0'a eşittir. Bu nedenle, ikinci döngüde, ilk önce indeksi 0 olan birinci dizi evenNumbers üzerinde yineleme yapıyoruz. Ve zaten ikinci döngü içinde, bu dizinin elemanlarına erişiyoruz. Böylece: twoDimens [j]. Burada j, 0'dan evenNumbers dizisinin uzunluğuna kadar değişir.

İlk dizideki öğeler üzerinde yineledikten sonra, birinci döngüye geri dönüyoruz, i değişkenini artırıyoruz ve indeksi 1 olan ikinci oddNumbers dizisi üzerinde yinelemeye devam ediyoruz. Ve böylece, twoDimens iki boyutlu dizinin her bir öğesi üzerinde yineleme yapıyoruz.

Şimdi bu aramanın sonucuna bakalım:


Bu yazıda konuşmak istediğim tek şey bu. Artık iki boyutlu bir dizinin nasıl oluşturulacağını, iki boyutlu bir dizinin öğelerine nasıl erişileceğini ve iki boyutlu bir dizi üzerinde nasıl yineleme yapılacağını biliyorsunuz. Umarım her şey açıktı. Size büyük başarılar dilerim!

  • I. Gerçek diziler üzerinde yineleme
    1. ForEach ve ilgili yöntemler
    2. Döngü için
    3. For ... in döngüsünün doğru kullanımı
    4. For ... of loop (bir yineleyicinin örtük kullanımı)
    5. Bir yineleyicinin açık kullanımı
    1. Gerçek diziler üzerinde yineleme yapmak için yöntemler kullanma
    2. Gerçek bir diziye dönüştürme
    3. Çalışma zamanı nesneleri hakkında bir not

I. Gerçek diziler üzerinde yineleme

Şu anda, gerçek bir dizinin öğeleri üzerinde yineleme yapmanın üç yolu vardır:
  1. array.prototype.forEach yöntemi;
  2. döngü için klasik;
  3. İyi biçimlendirilmiş bir ... in döngüsü.
Ek olarak, yakında yeni ECMAScript 6 (ES 6) standardının ortaya çıkmasıyla iki yol daha beklenmektedir:
  1. for ... of loop (bir yineleyicinin örtük kullanımı);
  2. bir yineleyicinin açık kullanımı.

1. forEach yöntemi ve ilgili yöntemler

Projeniz ECMAScript 5 (ES5) standardının yeteneklerini desteklemek üzere tasarlandıysa, yeniliklerinden biri olan forEach yöntemini kullanabilirsiniz.

Kullanım örneği:
var a \u003d ["a", "b", "c"]; a.forEach (işlev (giriş) (console.log (giriş);));
Genel olarak, forEach kullanmak, bu yöntem için yerel desteğe sahip olmayan tarayıcılar için es5-shim öykünme kitaplığını gerektirir. Bunlar, bugün hala kullanımda olan IE 8 ve önceki sürümleri içerir.

ForEach'in avantajı, geçerli dizi öğesinin dizinini ve değerini depolamak için yerel değişkenleri bildirmeye gerek olmamasıdır, çünkü bunlar otomatik olarak geri çağrı işlevine bağımsız değişken olarak aktarılır.

Her öğe için bir geri aramanın olası maliyeti konusunda endişeleniyorsanız, endişelenmeyin ve bunu okuyun.

ForEach, bir dizinin tüm öğelerini yinelemek için tasarlanmıştır, ancak bunun dışında ES5, öğelerin tümü veya bir kısmı üzerinde yineleme yapmak ve bunlarla bazı eylemler gerçekleştirmek için daha kullanışlı birkaç yöntem sunar:

  • every - dizinin her bir öğesi için geri çağırma, true değerine dönüştürülen bir değer döndürürse true döndürür.
  • bazı - dizinin en az bir öğesi için geri çağırma, true değerine dönüştürülen bir değer döndürürse true döndürür.
  • filtre - geri çağrının true döndürdüğü orijinal dizinin bu öğelerini içeren yeni bir dizi oluşturur.
  • map - geri çağırma tarafından döndürülen değerleri içeren yeni bir dizi oluşturur.
  • azalt - bir diziyi tek bir değere indirger, sırayla dizinin her bir öğesine, ilkinden başlayarak bir geri arama uygular (dizi öğelerinin ve diğer son işlevlerin toplamını hesaplamak için yararlı olabilir).
  • azaltmaRight - azaltmaya benzer şekilde çalışır, ancak öğeler üzerinde ters sırada yineler.

2. for döngüsü

Kurallar için yaşlı:

Var a \u003d ["a", "b", "c"]; var indeksi; for (dizin \u003d 0; dizin< a.length; ++index) { console.log(a); }
Dizinin uzunluğu tüm döngü boyunca değişmezse ve döngünün kendisi performans açısından kritik bir kod parçasına aitse (ki bu olası değildir), dizinin uzunluğunu depolamak için for "daha uygun" sürümünü kullanabilirsiniz:

Var a \u003d ["a", "b", "c"]; var indeksi, len; for (dizin \u003d 0, len \u003d a.length; dizin< len; ++index) { console.log(a); }
Teorik olarak, bu kod öncekinden biraz daha hızlı çalışmalıdır.

Öğelerin numaralandırma sırası önemli değilse, optimizasyon açısından daha da ileri gidebilir ve numaralandırma sırasını tersine değiştirerek dizinin uzunluğunu depolamak için değişkenden kurtulabilirsiniz:

Var a \u003d ["a", "b", "c"]; var indeksi; for (index \u003d a.length - 1; index\u003e \u003d 0; --index) (console.log (a);)
Bununla birlikte, modern JavaScript motorlarında, bu optimize edilmiş oyunlar genellikle hiçbir şey ifade etmez.

3. for ... in döngüsünün doğru kullanımı

Bir for ... in döngüsü kullanmanız tavsiye edilirse, diziler üzerinde yinelemenin amaçlanan şey olmadığını unutmayın. Yaygın yanlış anlamanın aksine, for ... in döngüsü, dizi indeksleri üzerinde değil, nesnenin numaralandırılmış özelliklerini yineler.

Ancak, seyrek diziler üzerinde yineleme gibi bazı durumlarda, aşağıdaki örnekte gösterildiği gibi bazı önlemler aldığınız sürece, for ... in yararlı olabilir:

// a seyrek bir dizidir var a \u003d; a \u003d "a"; a \u003d "b"; a \u003d "c"; for (a'daki var anahtarı) (if (a.hasOwnProperty (anahtar) && / ^0$| ^\\d*$/.test(key) && key<= 4294967294) { console.log(a); } }
Bu örnekte, döngünün her yinelemesinde iki kontrol gerçekleştirilir:

  1. dizinin key adında kendi özelliğine sahip olduğunu (prototipinden miras alınmadığını).
  2. bu anahtar, değeri 4294967294'ten küçük olan bir tamsayının ondalık gösterimini içeren bir dizedir. Son numara nereden geliyor? ES5'teki bir dizi dizininin tanımından, bir dizideki bir öğenin sahip olabileceği en büyük dizinin (2 ^ 32 - 2) \u003d 4294967294 olduğunu izler.
Elbette, bu tür kontroller döngü yürütülürken fazladan zaman alacaktır. Ancak seyrek bir dizi durumunda, bu yöntem bir for döngüsünden daha etkilidir, çünkü bu durumda yalnızca dizide açıkça tanımlanan öğeler yinelenir. Bu nedenle, yukarıdaki örnekte yalnızca 3 yineleme gerçekleştirilecektir (0, 10 ve 10000 dizinleri için) - for döngüsünde 10001'e karşılık.

Bir dizi üzerinde yinelemeniz gerektiğinde bu kadar külfetli bir kontrol kodu yazmamak için, onu ayrı bir işlev olarak tasarlayabilirsiniz:

İşlev arrayHasOwnIndex (array, key) (return array.hasOwnProperty (key) && / ^0$|🖤\\d*$/.test(key) && key<= 4294967294; }
Ardından, örnekteki döngünün gövdesi önemli ölçüde azalacaktır:

For (key in a) (if (arrayHasOwnIndex (a, key)) (console.log (a);))
Yukarıdaki kontrol kodu evrenseldir ve tüm durumlar için uygundur. Ancak bunun yerine, resmi olarak tam olarak doğru olmasa da çoğu durum için uygun olsa da daha kısa bir versiyon kullanabilirsiniz:

For (key in a) (if (a.hasOwnProperty (key) && String (parseInt (key, 10)) \u003d\u003d\u003d key) (console.log (a);))

4. for ... of döngüsü (bir yineleyicinin örtük kullanımı)

ES6, hala taslak durumundayken JavaScript'e yineleyiciler eklemelidir.

Yineleyici bir dizi değer (sonlu veya sonsuz) elde etmenin standart bir yolunu tanımlayan, nesne uygulamalı bir protokoldür.
Yineleyici, next () yönteminin tanımlandığı bir nesnedir - iki özelliğe sahip bir nesne döndüren bağımsız değişken içermeyen bir işlev:

  1. done (boolean) - yineleyici yinelenen dizinin sonuna ulaştıysa doğrudur. Aksi takdirde, yanlış.
  2. değer - yineleyici tarafından döndürülen değeri tanımlar. Done özelliği doğruysa tanımsız (eksik) olabilir.
Birçok yerleşik nesne, dahil. gerçek dizilerin varsayılan yineleyicileri vardır. Gerçek dizilerde yineleyici kullanmanın en basit yolu, yeni for ... of construct'ı kullanmaktır.

... / için kullanımına bir örnek:

Var val; var a \u003d ["a", "b", "c"]; (a değeri) için (console.log (val);)
Yukarıdaki örnekte, for ... of döngüsü, dizideki her bir değeri almak için Array nesnesinin yineleyicisini örtük olarak çağırır.

5. Bir yineleyicinin açık kullanımı

Yineleyiciler de açıkça kullanılabilir, ancak bu durumda kod, for ... of döngüsüne kıyasla çok daha karmaşık hale gelir. Şöyle görünüyor:

Var a \u003d ["a", "b", "c"]; var it \u003d a.entries (); var girişi; while (! (entry \u003d it.next ()). bitti) (console.log (entry.value);)
Bu örnekte, Array.prototype.entries yöntemi, dizinin değerlerini görüntülemek için kullanılan bir yineleyici döndürür. Her yinelemede, entry.value [anahtar, değer] gibi bir dizi içerir.

II. Dizi benzeri nesneler üzerinde yineleme

Gerçek dizilere ek olarak, JavaScript ayrıca dizi benzeri nesneler ... Gerçek dizilerle ortak yönleri, bir length özelliğine ve dizinin öğelerine karşılık gelen sayılar biçiminde adlara sahip özelliklere sahip olmalarıdır. Örnekler arasında NodeList koleksiyonunun DOM'si ve herhangi bir işlev / yöntem içinde bulunan sözde dizi argümanları bulunur.

1. Gerçek diziler üzerinde yineleme yöntemlerini kullanma

Hepsi değilse de en azından çoğu, gerçek diziler üzerinde yineleme yöntemleri dizi benzeri nesneler üzerinde yineleme yapmak için kullanılabilir.

For ve for ... in yapıları, gerçek dizilere yapabildikleri gibi, dizi benzeri nesnelere de uygulanabilir.

ForEach ve diğer Array.prototype yöntemleri, dizi benzeri nesnelere de uygulanır. Bunu yapmak için Function.call veya Function.apply için bir çağrı kullanın.

Örneğin, bir Node nesnesinin childNodes özelliğine forEach'i uygulamak istiyorsanız, bunu şu şekilde yapabilirsiniz:

Array.prototype.forEach.call (node.childNodes, function (child) (// alt nesneyle bir şeyler yapın));
Bu tekniğin yeniden kullanım kolaylığı için, Array.prototype.forEach yöntemine ayrı bir değişkende bir başvuru bildirebilir ve bunu bir kısaltma olarak kullanabilirsiniz:

// (Bu, aşağıdaki kodun tümünün aynı kapsamda olduğunu varsayar) var forEach \u003d Array.prototype.forEach; // ... forEach.call (node.childNodes, function (child) (// alt nesneyle bir şeyler yapın));
Dizi benzeri nesnenin bir yineleyicisi varsa, gerçek dizilerde olduğu gibi nesne üzerinde yineleme yapmak için açıkça veya örtük olarak kullanılabilir.

2. Gerçek bir diziye dönüştürün

Bir dizi benzeri nesne üzerinde yinelemenin başka, çok basit bir yolu daha vardır: onu gerçek bir diziye dönüştürmek ve gerçek diziler üzerinde yinelemek için yukarıdaki yöntemlerden herhangi birini kullanmak. Dönüştürme için, herhangi bir dizi benzeri nesneye uygulanabilen genel Array.prototype.slice yöntemini kullanabilirsiniz. Bu, aşağıdaki örnekte gösterildiği gibi çok basit bir şekilde yapılır:

Var trueArray \u003d Array.prototype.slice.call (arrayLikeObject, 0);
Örneğin, bir NodeList koleksiyonunu gerçek bir diziye dönüştürmek istiyorsanız, aşağıdaki gibi koda ihtiyacınız vardır:

Var divs \u003d Array.prototype.slice.call (document.querySelectorAll ("div"), 0);
Güncelleme: Rock and torbasow'un yorumlarında belirtildiği gibi, ES6'da Array.prototype.slice yerine daha açıklayıcı Array.from yöntemini kullanabilirsiniz.

3. Çalışma zamanı nesneleri hakkında bir not

Çalışma zamanı nesnelerine (DOM koleksiyonları gibi) Array.prototype yöntemlerini uygularsanız, bu yöntemlerin tüm çalışma zamanı ortamlarında (tarayıcılar dahil) doğru çalışacağının garanti edilmediğini aklınızda bulundurmalısınız. Belirli bir çalışma zamanındaki belirli bir nesnenin davranışına, daha kesin olarak HasProperty soyut işleminin bu nesnede nasıl uygulandığına bağlıdır. Sorun, ES5 standardının kendisinin nesnenin bu işleme göre hatalı davranma olasılığına izin vermesidir (bkz. §8.6.2).

Bu nedenle, Array.prototype yöntemlerini uygulamanızı kullanmayı planladığınız her çalışma zamanında (tarayıcı) test etmek önemlidir.

JavaScript çok boyutlu diziler ve sıralama ile ilgilenen herkese selamlar. Mevcut yayında bu konuyu tüm detaylarıyla ele almaya çalışacağım.

Bu nedenle, bu makaleyi okuduktan sonra, çok boyutlu dizilerin web uygulamalarında neden kullanıldığını, nasıl oluşturulduğunu ve nasıl işlenip sıralanabileceğini öğreneceksiniz. Öğrenmeye başlayalım!

Çok boyutlu diziler nasıl yaratılır ve ne içindir?

Başlangıç \u200b\u200bolarak, normal bir tek boyutlu dizinin nasıl oluşturulduğunu hatırlamakta fayda var.

var dizi \u003d

Şimdi, çok boyutlu bir dizinin bir dizi dizisi olduğunu hatırlayın.Katılıyorum, kulağa bir totoloji gibi geliyor. Ancak tanımı tekrar okuyun. Aslında, çok boyutlu bir dizi, belirli sayıda iç içe geçmiş olandan oluşur.

Aşağıdaki durumu düşünün. Bir oyunun başında kullanıcı adını girer ve bittikten sonra oyuncuların isimleri ve kayıtlarının bulunduğu bir reyting tablosu ekrana gelir.

Bu tür bilgilerin bir veri tabanında saklandığı açıktır. Ancak onu veritabanından çıkardığımızda çok boyutlu bir dizi elde ederiz. Sonuçta, her alt dizi oyuncunun giriş bilgilerini ve atılan puan sayısını içerir.

Hepsi şöyle görünecek:

var sonuçlar \u003d [["Markus", 333], ["Natasha", 211], ["Alexey", 124]];

Gördüğünüz gibi, bilgi heterojen olarak saklanabilir. Dizeler, sayılar ve hatta olabilir. Bu mümkündür çünkü diziler türsüzdür.

Bu durumda, öğelere erişim çift operatör aracılığıyla gerçekleşir.

Malzemeyi birleştirmek için küçük bir programı analiz edin.

Sonuçlar \u003d

Diziler, sıralı karmaşık verileri işlerken depolamanın oldukça uygun bir yoludur. Ek olarak, onlarla çalışmak çok uygundur ve aynı zamanda işlemlerinin hızı oldukça yüksektir.

Veri sıralama yöntemleri

JavaScript'teki diziler için, adında yerleşik bir yöntem vardır çeşit ()... Bu araç çok esnektir. Ve şimdi nedenini açıklayacağım.

Parametre içermeyen bir yöntem kullanırsanız, alt dizileri ilk öğeye göre alfabetik sırada otomatik olarak sıralar. Yani ararken sonuçlar.çeşit () ayrıştırılan nesne şöyle görünecektir:

Alexey, 124

Markus, 333

Natasha, 211

Ve her iç içe dizideki öğeleri değiştirirseniz, şunu elde edersiniz:

124, Alexey

211, Natasha

333, Markus

Bu durumda, karşılaştırma için tüm öğeler geçici olarak dizelere dönüştürülür.

Belirli bir görevi çözmek için, öğeleri standart olmayan bir şekilde sıralayan bir işleve ihtiyacınız varsa, bunu kendiniz yazabilir ve bir parametre olarak çeşit ()... Özel bir işlevin döndürülmesi gerektiği dikkate alınmalıdır:

  • karşılaştırmada birinci belirtilen öğe ikinciyi takip ediyorsa pozitif bir sayı (genellikle 1 seçilir);
  • ikinci seçilen öğe birinciyi takip edecekse negatif bir sayı (genellikle -1);
  • test edilen iki değer eşitse sıfır.

Örnek olarak ilk diziyi alalım. sonuçlar noktalara göre sırala. Ayrıca, sonuçlar en yüksekten en düşüğe doğru sıralanacaktır. Bu iki şekilde yapılabilir.

İlk versiyonda sıralama mantığını değiştirdim, yani pozitif bir sayı döndürmeniz gereken bir durumda, negatif bir tane döndürürüm ve bunun tersi de geçerlidir.

Kayıt tablosu:

Ancak ikinci yöntemde, sıralama mantığını olduğu gibi bıraktım, ancak ek olarak başka bir yöntem kullandım - tersine çevirmek ()... Adından da anlaşılacağı gibi, öğelerin sırasını tersine çevirir.

Bu nedenle sort () işlevi şöyle görünecektir:

1 2 3 4 5 function RecordSort (a, b) (if (a\u003e b) return 1; else if (a< b) return -1; else return 0; }

function RecordSort (a, b) (if (a\u003e b) return 1; else if (a< b) return -1; else return 0; }

Ancak ondan sonra yukarıdaki yöntemi ekleyin.

Sonuç benzer şekilde yapılır.

Dikkatinizi önemli bir noktaya çekmek istiyorum. Bu işlevleri kullanırken, tüm değişiklikler onları uyguladığınız dizide gerçekleşir. Bu nedenle, verilerin orijinal biçimini korumanız gerekiyorsa, bir kopyasını oluşturun ve ardından düzenleyin.

Ben de çok boyutlu dizilerden ve bunların sınıflandırılmasından bahsettim. Makaleyi beğendiyseniz, bloga abone olun ve diğer eşit derecede ilginç yayınları okuyun. Repostlar için minnettar olurum. Bir sonrakine kadar!

Güle güle!

Saygılarımızla, Roman Chueshov

Diziler

Dizi sıralı bir değerler koleksiyonudur. Bir dizideki değerlere öğeler denir ve her öğe, dizideki bir sayısal konumla karakterize edilir, bu da dizin adı verilir. JavaScript'teki diziler türsüzdür: Bir dizinin öğeleri herhangi bir türde olabilir ve aynı dizinin farklı öğeleri farklı türlerde olabilir. Dizi öğeleri, nesne dizileri ve dizi dizileri gibi karmaşık veri yapıları oluşturmanıza olanak tanıyan nesneler veya başka diziler bile olabilir.

JavaScript'teki dizi dizinleri sıfır tabanlıdır ve 32 bitlik tamsayılar kullanır - bir dizinin ilk öğesi dizin 0'a sahiptir. JavaScript dizileri dinamiktir: gerektiğinde büyüyebilir ve küçülebilirler; Oluşturulduklarında sabit boyutta diziler bildirmeye veya yeniden boyutlandırıldıklarında belleği yeniden ayırmaya gerek yoktur.

JavaScript'teki diziler özel bir nesne biçimidir ve dizi indeksleri, tesadüfen tamsayı olan özellik adlarından biraz daha fazlasını ifade eder.

Diziler oluşturma

Bir dizi oluşturmanın en kolay yolu, köşeli parantez içindeki dizi öğelerinin virgülle ayrılmış basit bir listesi olan değişmez değer kullanmaktır. Bir dizideki değerlerin sabit olması gerekmez - bunlar, nesne değişmezleri dahil herhangi bir ifade olabilir:

Var boş \u003d; // Boş dizi var numaraları \u003d; // Beş sayısal öğeli dizi var misc \u003d [1.1, true, "a",]; // Farklı türlerde 3 öğe + sondaki virgül var base \u003d 1024; var table \u003d; // Değişkenlere sahip dizi var arrObj \u003d [,]; // nesneler içeren 2 dizi

Dizi değişmez sözdizimi, isteğe bağlı bir sondaki virgül, yani değişmez [,], üç değil, iki öğeli bir diziyle eşleşir.

Bir dizi oluşturmanın başka bir yolu da kurucuyu çağırmaktır Dizi ()... Kurucu üç farklı şekilde çağrılabilir:

    Yapıcıyı bağımsız değişken olmadan çağırın:

    Var arr \u003d new Array ();

    Bu durumda, değişmez değere eşdeğer boş bir dizi oluşturulacaktır.

    Yapıcıyı, dizinin uzunluğunu belirten tek bir sayısal bağımsız değişkenle çağırın:

    Var arr \u003d new Array (10);

    Bu durumda, belirtilen uzunlukta boş bir dizi oluşturulacaktır. Array () yapıcısını çağırmanın bu biçimi, öğelerinin sayısı önceden biliniyorsa bir dizi için belleği önceden ayırmak için kullanılabilir. Bunun dizide herhangi bir değer saklamadığını unutmayın.

    Bir yapıcı çağrısında ilk iki veya daha fazla dizi öğesinin veya sayısal olmayan bir öğenin değerlerini açıkça belirtin:

    Var arr \u003d new Array (5, 4, 3, 2, 1, "test");

    Bu durumda, kurucunun argümanları yeni dizinin öğelerinin değerleri haline gelir. Dizi değişmezlerini kullanmak, neredeyse her zaman Array () yapıcısını bu şekilde kullanmaktan daha kolaydır.

Dizi elemanlarını okuma ve yazma

Dizi öğelerine operatör kullanılarak erişilir. Parantezlerin solunda bir dizi referansı olmalıdır. Negatif olmayan bir tamsayı değeri döndüren rastgele bir ifade, parantez içinde olmalıdır. Bu sözdizimi, bir dizi elemanının değerini hem okumak hem de yazmak için uygundur. Bu nedenle, aşağıdaki JavaScript ifadelerinin tümü geçerlidir:

// Tek öğeli bir dizi oluşturun var arr \u003d ["world"]; // 0 maddesini oku var value \u003d arr; // Değeri 1 numaralı elemana yazın arr \u003d 3.14; // Öğe 2'ye bir değer yazın i \u003d 2; dizi [i] \u003d 3; // 3. elemana bir değer yazın arr \u003d "merhaba"; // 0 ve 2 öğelerini okuyun, değeri öğe 3'e yazın arr] \u003d arr;

Dizilerin özel bir nesne türü olduğunu hatırlatmama izin verin. Dizi öğelerine erişmek için kullanılan köşeli parantezler, nesne özelliklerine erişmek için kullanılan köşeli parantezlerle tam olarak aynı işlevi görür. JavaScript yorumlayıcısı, parantezli sayısal dizinleri dizelere dönüştürür - dizin 1, "1" dizesi olur - ve ardından dizeleri özellik adları olarak kullanır.

Sayısal indisleri dizelere dönüştürmenin özel bir yanı yoktur: aynısı normal nesnelerle de yapılabilir:

Var obj \u003d (); // Basit bir nesne oluşturun obj \u003d "one"; // Tamsayılarla indeksleyin

Dizilerin özelliği, negatif olmayan tam sayılar olan özellik adlarını kullanırken, dizilerin otomatik olarak özelliğin değerini belirlemesidir. uzunluk... Örneğin, arr dizisi yukarıda tek bir elemanla oluşturuldu. Daha sonra 1, 2 ve 3 indisli elemanlarına değerler atanmıştır. Bu işlemler sonucunda dizinin length özelliğinin değeri değişmiş ve 4'e eşit olmuştur.

Bir dizideki dizinleri ve nesne özelliği adlarını açıkça ayırt etmelisiniz. Tüm dizinler özellik adlarıdır, ancak yalnızca tamsayı adlarına sahip özellikler dizindir. Tüm diziler nesnelerdir ve bunlara herhangi bir adla özellikler ekleyebilirsiniz. Bununla birlikte, dizi indeksleri olan özellikleri etkiliyorsanız, diziler, gerekli olduğu şekilde length özelliğinin değerini güncelleyerek tepki verir.

Negatif ve tamsayı olmayanların dizi indeksleri olarak kullanılmasına izin verildiğini unutmayın. Bu durumda, sayılar özellik adları olarak kullanılan dizelere dönüştürülür.

Dizi Öğelerini Ekleme ve Çıkarma

Bir diziye eleman eklemenin en kolay yolunun yeni indislere değer atamak olduğunu görmüştük. Bir dizinin sonuna bir veya daha fazla öğe eklemek için yöntemi de kullanabilirsiniz. it ():

Var arr \u003d; // Boş bir dizi oluştur arr.push ("sıfır"); // end arr.push'a bir değer ekleyin ("bir", 2); // İki değer daha ekleyin

Arr öğesine bir değer atayarak bir dizinin sonuna bir öğe de ekleyebilirsiniz. Bir dizinin başına bir öğe eklemek için yöntemi kullanabilirsiniz. unshift ()ve dizideki mevcut elemanlar daha yüksek dizinlere kaydırılır.

Nesnelerin sıradan özellikleri gibi silme operatörünü kullanarak bir dizinin öğelerini silebilirsiniz:

Var arr \u003d; arr sil; 2 in arr; // yanlış, dizideki dizin 2 tanımsız dizi.length; // 3: silme operatörü dizinin uzunluk özelliğini değiştirmez

Bir öğeyi kaldırmak, o öğeye tanımsız bir değer atamaya benzer (ancak biraz farklıdır). Silme operatörünün bir dizideki bir öğeye uygulanmasının length özelliğinin değerini değiştirmediğini veya öğe silindikten sonra kalan boşluğu doldurmak için daha yüksek indisli öğelerde aşağı hareket etmediğini unutmayın.

Bir dizinin sonundaki öğeleri, length özelliğine yeni bir değer atayarak kaldırmak da mümkündür. Dizilerin bir yöntemi var pop () (dizinin uzunluğunu 1 azaltan ve kaldırılan öğenin değerini döndüren push () yönteminin tersi). Ayrıca bir yöntem var vardiya () (unshift () 'in tersi), dizinin başındaki öğeyi kaldırır. Silme operatörünün aksine, shift () yöntemi tüm öğeleri geçerli indekslerinin altında bir konum aşağı kaydırır.

Son olarak çok amaçlı bir yöntem var ekleme ()bu, dizi öğelerini eklemenize, silmenize ve değiştirmenize olanak tanır. Length özelliğinin değerini değiştirir ve gerektiğinde daha düşük veya daha yüksek indisli dizinin öğelerini kaydırır. Tüm bu yöntemleri biraz sonra tartışacağız.

Çok boyutlu diziler

JavaScript "gerçek" çok boyutlu dizileri desteklemez, ancak dizilerden gelen dizileri kullanarak bunların benzetimini yapmak için iyi bir iş çıkarır. Bir dizi dizisindeki bir veri öğesine erişmek için, operatörü iki kez kullanmak yeterlidir.

Örneğin, değişken matrisin sayı dizilerinden oluşan bir dizi olduğunu varsayalım. Matris [x] 'in her bir elemanı bir sayılar dizisidir. Bir dizideki belirli bir sayıya erişmek için [x] [y] ifade matrisini kullanabilirsiniz. Aşağıda, çarpım tablosu olarak iki boyutlu bir dizinin kullanıldığı belirli bir örnek verilmiştir:

// Çok boyutlu bir dizi oluşturun var table \u003d new Array (10); // Tabloda 10 satır var (var i \u003d 0; i

Dizi sınıfı yöntemleri

ECMAScript 3 standardı, herhangi bir dizinin yöntemi olarak kullanılabilen Array.prototype'nin bir parçası olarak dizilerle çalışmak için birçok kullanışlı işlevi tanımlar. Bu yöntemler aşağıdaki alt bölümlerde sunulacaktır.

Birleştirme () yöntemi

Array.join () yöntemi, dizideki tüm öğeleri dizelere dönüştürür, birleştirir ve elde edilen dizeyi döndürür. Yönteme, sonuç dizesindeki öğeleri ayırmak için kullanılacak bir dizeyle isteğe bağlı bir argüman geçirilebilir. Sınırlayıcı dize belirtilmezse, virgül kullanılır. Örneğin, aşağıdaki kod parçası "1,2,3" dizesiyle sonuçlanır:

Var arr \u003d; arr.join (); // "1,2,3" arr.join ("-"); // "1-2-3"

Reverse () yöntemi

Array.reverse () yöntemi, bir dizideki öğelerin sırasını tersine çevirir ve yeniden sıralanmış bir dizi döndürür. Permütasyon, doğrudan orijinal dizi üzerinde yapılır, yani. bu yöntem, yeniden sıralanan öğelerle yeni bir dizi oluşturmaz, ancak bunları zaten var olan bir dizide yeniden sıralar. Örneğin, reverse () ve join () yöntemlerini kullanan aşağıdaki kod parçası "3,2,1" dizesiyle sonuçlanır:

Var arr \u003d; arr.reverse (). join (); // "3,2,1"

Sort () yöntemi

Array.sort () yöntemi, orijinal dizideki öğeleri sıralar ve sıralanmış diziyi döndürür. Sort () yöntemi bağımsız değişken olmadan çağrılırsa, sıralama alfabetik olarak gerçekleştirilir (karşılaştırma için, gerekirse öğeler geçici olarak dizelere dönüştürülür). Tanımsız öğeler dizinin sonuna sarılır.

Alfabetik olmayan diğer herhangi bir düzende sıralamak için sort () yapmak için bir karşılaştırma işlevini bağımsız değişken olarak iletebilirsiniz. Bu işlev, sıralanan listede iki bağımsız değişkeninden hangisinin önce gelmesi gerektiğini ayarlar. İlk bağımsız değişken ikinciden önce gelmesi gerekiyorsa, karşılaştırma işlevi negatif bir sayı döndürmelidir. İlk bağımsız değişken, sıralı dizide ikinciyi takip edecekse, işlev sıfırdan büyük bir sayı döndürmelidir. Ve iki değer eşdeğerse (yani sıra önemli değilse), karşılaştırma işlevi 0 döndürmelidir:

Var arr \u003d; arr.sort (); // Alfabetik sıra: 1111, 222, 33, 4 sıralı sıralama (işlev (a, b) (// Sayısal sıra: 4, 33, 222, 1111 return ab; // Sıralama düzenine bağlı olarak 0 değerini döndürür // a ve B)); // Geriye doğru sırala, en yüksekten en küçüğe doğru sıralı sıralama (işlev (a, b) (dönüş b-a));

Bu kod parçacığında adsız bir işlev kullanmanın ne kadar kolay olduğuna dikkat edin. Karşılaştırma işlevi yalnızca burada kullanılır, bu nedenle ona bir ad vermeye gerek yoktur.

Concat () yöntemi

Array.concat () yöntemi, concat () yönteminin çağrıldığı orijinal dizinin öğelerini ve concat () yöntemine iletilen tüm argümanların değerlerini içeren yeni bir dizi oluşturur ve döndürür. Bu bağımsız değişkenlerden herhangi birinin kendisi bir dizi ise, öğeleri döndürülen diziye eklenir. Bununla birlikte, bir dizinin dizilerden tek boyutlu bir diziye özyinelemeli bir dönüşümü olmadığına dikkat edilmelidir. Concat () yöntemi orijinal diziyi değiştirmez. Aşağıda bazı örnekler verilmiştir:

Var arr \u003d; arr.concat (4, 5); // arr.concat (); // arr.concat (,) döndürür // arr.concat (4,]) döndürür // Döndürür]

Dilim () yöntemi

Array.slice () yöntemi, belirtilen dizinin bir dilimini veya alt dizisini döndürür. Yöntemin iki bağımsız değişkeni, döndürülen parçanın başlangıcını ve sonunu tanımlar. Döndürülen dizi, ilk bağımsız değişkende numaralandırılan öğeyi ve ikinci bağımsız değişkende numaralandırılan öğeye kadar (ancak dahil olmayan) sonraki tüm öğeleri içerir.

Yalnızca bir bağımsız değişken belirtilirse, döndürülen dizi, dizinin başlangıç \u200b\u200bkonumundan sonuna kadar tüm öğeleri içerir. Bağımsız değişkenlerden herhangi biri negatifse, dizinin sonuna göre öğe numarasını belirtir. Dolayısıyla, -1 bağımsız değişkeni dizinin son elemanına ve -3 değişkeni dizinin sondan üçüncü elemanına karşılık gelir. İşte bazı örnekler:

Var arr \u003d; arr.slice (0.3); // arr.slice (3); // dizi.slice (1, -1); // arr.slice (-3, -2); // Geri dönücek

Splice () yöntemi

Array.splice () yöntemi, bir diziden öğe ekleyen veya kaldıran genel bir yöntemdir. Slice () ve concat () yöntemlerinden farklı olarak, splice () yöntemi çağrıldığı orijinal diziyi değiştirir. Splice () ve slice () yöntemlerinin çok benzer adlara sahip olduğunu, ancak tamamen farklı işlemler gerçekleştirdiklerini unutmayın.

Splice () yöntemi, bir diziden öğeleri kaldırabilir, yeni öğeler ekleyebilir veya aynı anda her ikisini birden yapabilir. Dizinin öğeleri, yerleştirme veya silme işleminden sonra bitişik bir dizi oluşacak şekilde gerektiği gibi kaydırılır.

Splice () yönteminin ilk argümanı, dizinin ekleneceği ve / veya silineceği konumu belirtir. İkinci bağımsız değişken, diziden kaldırılacak (kesilecek) öğelerin sayısını belirtir. İkinci bağımsız değişken atlanırsa, belirtilen diziden dizinin sonuna kadar tüm dizi öğeleri kaldırılır. Splice () yöntemi, kaldırılan öğelerin bir dizisini veya (öğelerden hiçbiri kaldırılmadıysa) boş bir dizi döndürür.

Splice () yönteminin ilk iki argümanı, kaldırılacak dizi öğelerini belirtir. Bu bağımsız değişkenlerin ardından, ilk bağımsız değişkende belirtilen konumdan başlayarak diziye eklenecek öğeleri belirten herhangi bir sayıda ek bağımsız değişken gelebilir.

Var arr \u003d; arr.splice (4); // arr \u003d arr.splice (1,2); // arr \u003d arr.splice (1,1); // Geri dönücek; arr \u003d arr \u003d; arr.splice (2,0, "a", "b"); // Geri dönücek; arr \u003d

Push () ve pop () yöntemleri

Push () ve pop () yöntemleri, yığınlar gibi dizilerle çalışmanıza izin verir. Push () yöntemi, dizinin sonuna bir veya daha fazla yeni öğe ekler ve yeni uzunluğunu döndürür. Pop () yöntemi, tersi işlemi gerçekleştirir - dizinin son öğesini kaldırır, dizinin uzunluğunu azaltır ve çıkardığı değeri döndürür. Bu yöntemlerin her ikisinin de değiştirilmiş bir kopyasını oluşturmak yerine orijinal diziyi değiştirdiğini unutmayın.

Unshift () ve shift () Yöntemleri

Unshift () ve shift () yöntemleri push () ve pop () ile hemen hemen aynı şekilde davranır, tek fark öğeleri dizinin sonuna değil başlangıcına ekler ve kaldırır. Unshift () yöntemi, yer açmak için mevcut öğeleri daha büyük dizinlere kaydırır, öğeyi veya öğeleri dizinin başlangıcına ekler ve dizinin yeni uzunluğunu döndürür. Shift () yöntemi, dizinin başlangıcında boşalan alanı kaplamak için sonraki tüm öğeleri bir konum aşağı kaydırarak dizinin ilk öğesini kaldırır ve döndürür.

Son güncelleme: 09.04.2018

Diziler, veri kümeleriyle çalışmak için tasarlanmıştır. New Array () ifadesi bir dizi oluşturmak için kullanılır:

Var myArray \u003d new Array ();

Bir diziyi başlatmanın daha kısa bir yolu da vardır:

Var myArray \u003d;

Bu durumda boş bir dizi oluşturuyoruz. Ancak buna ilk verileri de ekleyebilirsiniz:

Var insanlar \u003d ["Tom", "Alice", "Sam"]; console.log (kişiler);

Bu durumda, myArray'in üç öğesi olacaktır. Grafik olarak şu şekilde temsil edilebilir:

Dizinler, bir dizinin ayrı öğelerini belirtmek için kullanılır. Sayma sıfırdan başlar, yani, ilk elemanın indeksi 0 olacak ve sonuncusu 2'ye sahip olacaktır:

Var insanlar \u003d ["Tom", "Alice", "Sam"]; console.log (kişiler); // Tom var person3 \u003d insanlar; // Sam console.log (person3); // Sam

Dizinin boyutundan daha büyük bir dizindeki bir elemana erişmeye çalışırsak, tanımsız oluruz:

Var insanlar \u003d ["Tom", "Alice", "Sam"]; console.log (kişiler); // Tanımsız

Ayrıca dizin, dizi öğelerinin değerlerini ayarlamak için kullanılır:

Var insanlar \u003d ["Tom", "Alice", "Sam"]; console.log (kişiler); // Tom insanları \u003d "Bob"; console.log (kişiler); // Bob

Ayrıca, C # veya Java gibi diğer dillerin aksine, başlangıçta yüklenmemiş bir öğe kurabilirsiniz:

Var insanlar \u003d ["Tom", "Alice", "Sam"]; console.log (kişiler); // tanımsız - dizide yalnızca üç öğe vardır people \u003d "Bob"; console.log (kişiler); // Bob

Ayrıca, JavaScript'teki bir dizi programlama dilinin aksine, dizilerin güçlü bir şekilde yazılmadığını, bir dizinin farklı türlerdeki verileri depolayabileceğini de belirtmek gerekir:

Var nesneleri \u003d ["Tom", 12, doğru, 3.14, yanlış]; console.log (nesneler);

yayılma operatörü

yayılma operatörü ... bir diziden ayrı olarak değer almanıza izin verir:

Sayılar \u003d; console.log (... numaralar); // 1 2 3 4 console.log (sayılar); //

yayılma operatörü diziden önce belirtilir. Sonuç olarak, ifade ... sayılar bir dizi sayı döndürecektir, ancak bu bir dizi değil, ayrı değerler olacaktır.

Çok boyutlu diziler

Diziler tek boyutlu ve çok boyutlu olabilir. Çok boyutlu bir dizideki her öğe ayrı bir dizi olabilir. Yukarıda tek boyutlu bir dizi düşündük, şimdi çok boyutlu bir dizi oluşturalım:

Var numbers1 \u003d; // tek boyutlu dizi var numbers2 \u003d [,]; // iki boyutlu dizi

Görsel olarak, her iki dizi de aşağıdaki gibi temsil edilebilir:

Tek boyutlu dizi numaraları1

Bir dizinin tek bir öğesini elde etmek için bir dizin de kullanılır:

Var tomInfo \u003d insanlar;

Sadece şimdi tomInfo değişkeni bir diziyi temsil edecek. İç içe geçmiş bir dizinin içinde bir öğe elde etmek için ikinci boyutunu kullanmamız gerekir:

Console.log ("Ad:" + kişiler); // Tom console.log ("Yaş:" + kişi); // 25

Yani, iki boyutlu bir diziyi bir tablo biçiminde görsel olarak temsil edebiliyorsak, o zaman insanlar öğesi, ilk satır ve ikinci sütunun kesişme noktasında bulunan tablo hücresine başvuracaktır (ilk boyut - 0 - satır, ikinci boyut - 1 - sütun).

Atamayı da yapabiliriz:

Var insanlar \u003d [["Tom", 25, false], ["Bill", 38, true], ["Alice", 21, false]]; insanlar \u003d 56; // ayrı bir değer atayın console.log (insanlar); // 56 kişi \u003d ["Bob", 29, false]; // bir dizi console.log (kişiler) atayın; // Bob

Çok boyutlu diziler oluştururken, sadece iki boyutlu dizilerle sınırlı değiliz, aynı zamanda büyük boyutlu diziler de kullanabiliriz:

Değişken sayılar \u003d; sayılar \u003d; // şimdi sayılar iki boyutlu bir dizi sayıdır \u003d; // şimdi sayılar üç boyutlu bir dizi sayıdır \u003d 5; // 3B dizinin ilk elemanı 5 console.log (sayılar);