JavaScript'e Giriş

Merhaba bundan önceki HTML'ye giriş ve CSS'ye giriş yazılarımızda olduğu gibi bu bölümü de okuyabilmeniz için fizik , kimya , biyoloji , matematik ve pedagoji dallarının hepsinde uzman olmanız gerekmiyor, 2 tanesinde uzman olsanız yeter.

Başlıyoruz. Bu bölümde web sayfalarındaki görsel konulardan biraz lojik konularına doğru geçeceğiz. JavaScript web tarayıcı uygulamalarında web sayfaları gösterilirken çalıştırılabilen programlama dillerinden en önemli ve yaygın olanı. Bu yazıda JavaScript dilinin genel bir girişini yapacağız, web sayfası ile etkileşimleri ise daha ileri bölümlerde ele alacağız.

Nasıl çalışır

JavaScript'i denemenin birkaç değişik yolu var. Bunları gördükçe kendinize en uygun olanı tercih edersiniz. Fakat ilk önce JavaScript programı HTML ve CSS ile nasıl bağlı?

Çoğunlukla JavaScript tarayıcınızda HTML ve CSS'nin yanında çalışır ve herhangi bir sayfaya <script> tag ile eklenir. script tag JavaScript'i direk içinde barındırabilir (sayfa içi kullanım) ya da src adlandırılmış özelliği ile harici dosyadan da çalıştırılabilir. 

Tarayıcı JavaScripti ilk satırından itibaren satır satır çalıştırarak sona kadar işler (eğer komutlarda başka bir yere yönlendirilmemişse). 

Dahili kullanım

JavaScript kodu direk olarak script tag'in içeriğine yazarız.

        <script>
            alert("Merhaba Dünya");
        </script>
 

Harici kullanım

Harici JavaScript dosyası ".js" uzantılı bir text dosyasıdır. (.css uzantılı harici CSS dosyası gibi). Diyelim "script.js" adında bir harici JavaScript dosyamız olsun. Bunu sayfaya dahil etmek için script tag'ine src özelliğine "script.js" değerini yazarız. 

        <script src="/script.js"></script>

Bunların dışında HTML içinde tıklanan bir elemana da direk JavaScript enjekte edebiliriz. Mesela <a href="biryer.html" onclick="alert('Noooooo!');">Bana tıkla</a> gibi. Özel durumlarda kullanılabilir ama Mantık şudur ki HTML , CSS , JavaScript hepsini birbirinden ayırın. Hatırlarsanız CSS kursunda da aynı şekilde satır içi stil eklememenizi önermiştim.

Konsol

Modern tarayıcı programlarında yazılımcılara çok yardımcı olan bir özellik eklenmiştir. Herhangi bir web sayfasında bir elemana sağ tıkladığımızda açılan menüde "inspect element" ya da Türkçe olarak "Öğeyi Denetle" seçeneği görünür.

Ekranın bir ytarafında bölüm açılarak geliştirici araçları görünür. Burada Console sekmesine gidersek JavaScript komutlarımızı anında çalıştırabileceğimiz bir terminal açılır. Burada yazdığımız komutlar direk çalışır.

Bu geliştirici araçları bölümünün web tasarımı yaparken ne kadar faydalı bir eser olduğunu size anlatamam, özellikle bir şeyler öğrenirken.

Başlayalım

Sayfa içi script kullanarak başlayabiliriz. script'i değiştirip kaydettiğmide tarayıcıda sayfayı yenilersek direk sonucu görürüz. (gerçi harici dosyada da öyle ama neyse). 

Değişkenler ve Veriler

Program yazarken verileri saklamak ve daha sonra kullanmak çok yaygın ihtiyaç duyulan işlemlerdir. Ne mutlu ki bütün programlama dilleri gibi JavaScript de bunu yapabiliyor. Eğer yapamasaydı zaten bir işe yaramaz olacaktı. 

Şimdi kullanıcıya (yani size) soyadını soralım (ehliyetinize bakabilir ya da bir arkadaşınıza sorabilirsiniz). 

Konsolda çalışalım. Yukarıda anlatıldığı gibi herhangi bir web sayfası tarayıcıda açıkken (mesela şu anda bu sayfa açık, başka yere gitmeyin, burada da konsol açabilirsiniz, ne olur burada açın..) konsola ulaşalım. Şu kodu yazıp enter basalım.

var soyadı = prompt("Merhaba arkadaşım. Soyadını öğrenebilir miyim?");

Bir pencere açılıp soyadımızı soracaktır. Soyadımızı yazıp tamam tıklayalım ya da enter basalım.

Artık soyadınız "soyadı" isimli bir değişkenin içine kaydedildi. Konsolda soyadı yazıp enter basarsak değişkene saklanmış olan değeri görürüz. Süper di mi? bir değişken tanımlamış olduk.

Değişkenler

Düşünebilen varlıklarız madem, şöyle düşünebiliriz. Bir değişken adı olan bir raf gibi düşünülebilir. Bu rafı üzerinde yazılı adından rahatça bulabiliriz. 

Değişkenlere isim verirken içlerinde barındırdıkları değerin anlamına uygun isimler vermeniz önerilir. Örneğin burada kişinin soyadı değerini soyadı isimli bir değişkene sakladık. soyadı yerine birşey ya da s karıştırması kolay seçenekler olacaktır. 

Konsolda değişken adını yazdığımızda hayalimizdeki o raflara gider üzerinde değişken adı yazılı olan rafı bulur ve bize o raftaki şeyi getirir. Buna değişkenin değeri denir (value, çok kullanılan bir JavaScript terimi olduğu için öğrenmekte fayda var). Bu değer hemen herşey olabilir. soyadı örneğinde olduğu gibi harflerden oluşan bir dizi (string) olabileceği gibi sayı veya bir sürü veri çeşidinden biri olabilir. 

Yani bi değişkenin adı ve değeri var. Verileri saklamamız ve daha sonra defalarca kullanmamız için bir yoldur. 

Bir değişken oluşturmanın iki adımı var tanımlamak ve ilk değeri vermek. Bir kere tanımladıktan sonra da gerektikçe değer ataması  (ya da ayarlaması) yapılır. 

Tanımlama

Tanımlama, bir değişkenin mevcut olduğunu JavaScript'e bildirir. Şu raf hayalimize dönersek, koskoca bir depoda boş bir raf bulup üzerine isim yazmaya benzer. 

Tanımlama var komutuyla yapılır (variable - değişken kelimesi kısaltılmışı). Şöyle ki:

var soyadı;
var yaşı:

Her satırın sonundaki ";" işaretleri dikkatinizi çekmiştir. JavaScript ve daha bir çok programlama dilinde satırın bittiğini ifade eden noktalı virgül işaretini programcılar çok kullanır. Ne yazık ki programcılıkta çok yaygın olarak kullanılan karakterler İngilizce klavyede tek tuşla erişilirken Türkçe klavyede Shift ya da Alt tuşlarıyla kombinasyon yapmak gerekir (; : [ ] { } gibi karakterler). Alın size yazılımın Türkiye'de yavaş ilerlemesine bir sebep daha.

İlk değer

Değişkene ilk değer verilen andır. Daha sonra değişkene değer atamaları yapılabilir ama ilk değerin bir farkı var, bu ilk verilen değer değişkenin içinde ne tip bir değer barındırdığını belirler. 

Tanımlama ve ilk değer aynı satırda verilebilir (çoğunlukla da böyle yapılır)

var isim = "Ümit";

Ümit harflerin dizilmesinden  oluşan bir değer olduğuna göre isim değişkeni tipi de string olarak başlatılmış olur. String değerler programlamada tırnak içinde ifade edilir.

var yaşı = 54;

54 bir sayı olduğuna göre yaşı değişkeni de sayı tipindedir ve sayılarda tırnak içine alım yapılmaz, direk yazılır.

Değer atamak

Yukarıda bahsettiğimiz gibi değişkeni tanımladıktan sonra program içinde gerek duydukça yeni değer verebiliriz. Buna değer ataması denir , aynı ilk değer verir gibi = işareti ile yapılır. Örneğin yukarıdaki tanımlanan değişkenlere daha sonra yeni değer atamamız şu şekilde olur.

isim = "Hasan";
yaşı = 25;

Bu atama işlemini yapabilmek için değişken daha önce var kelimesi kullanarak tanımlanmış olmalıdır yoksa JavaScript çalışırken hata verecektir. 

Biraz matematik

Değişkenler yazıları, sayıları ve başka bir sürü şeyi saklamakta kullanılır. Fakat biz şimdi sayılara odaklanacağız. 

Kaç tane meyve?

Konsolda iki tane değişken tanımlayalım. Birine elimizde kaç tane Elma olduğunu , diğerine de elimizde kaç tane Armut olduğunu yazalım. 

var elmalar = 5, armutlar = 10;

Burada 2 tane değişkeni tek bir var kelimesi kullanarak tek satırda tanımladık. Bu birden çok değişkeni aynı anda tanımlamak için bir kısa yoldur. en başta var kelimesi kullanılır sonra değişken tanımlamaları aralarına virgül koyarak yapılır, en sona da noktalı virgül konarak satır bitirilir.

Şimdi bu iki değişkeni kullanarak toplamda kaç tane meyvemiz olduğunu hesaplayalım.

var toplamMevye = elmalar + armutlar;

Şimdi kosolda toplamMeyve yazıp enter basarsak bize toplam kaç tane meyve olduğunu bildirir. Aynen belediğimiz gibi iki değişkenin değeri "+" işareti ile toplandı ve oluşan değer eşitliğin sol tarafındaki değişkene atandı. Burada toplam meyve olarak bir isim kullanmadık. Çünkü değişken isimleri içinde boşluk kullanılamaz. Bu yüzden çok kelimeden oluşan değişken isimleri bitişik yazılır. Kelimeleri birbirinden ayırmak için sonraki kelimelerin ilk harflerini büyük yapmak ve değişken isimlerinin küçük harfle başlaması ise JavaScript programcılarının gene teamülüdür (mesela Ruby dili kullananlar bu değişkene toplam_meyve adını verirlerdi).

JavaScript'çilerin kullandığı tekniğe Camel Casing denir (deve hörgüçleri gibi olduğu için). Bunun yerine tOpLAmMEyve de diye isim verebilirdik, sıkıntı olmazdı ama pek okunabilir olmazdı herhalde.

Meyveleri bölüştürmek

Diyelim elimizdeki meyleleri 3 kişiye paylaştırmak istiyoruz. Kişi başı kaç meyve düşecek? 

var kişiBaşıMeyve = toplamMevye / 3;

Rabbime şükürler olsun ki JavaScript var. Yoksa kaç meyve düşeceğini bulmak için hesap makinası kullanmak zorunda kalacaktık. Bölme işlemi için "/" işaretini kullanıyoruz ve işaretin solundaki değeri işaretin sağındaki değere bölüyor.

İşlemler ve öncelikleri

Matematik işlemler yapmak için temel dört işlemde toplama için + , çıkarma için - , çarpma için * ve bölme için / işaretleri kullanılır. 

Hepimiz ileri seviye matematikçiler olduğumuz için bu işlemlerin birlikte kullanıldıklarında öncelikleri olduğunu gayet iyi biliriz. Parantez içindeki işlemler ilk önce yapılır, sonra çarpma ve bölmeler yapılır, en son toplama ve çıkarma işlemleri yapılır.

Şu örneğe bakalım

(10 + 2) / 2 + 4 * 2

Önce parantez içi işlenir ve şu hale gelir.

12 / 2 + 4 * 2

Sonra çarpma ve bölmeler işlenir.

6 + 8

En son garibim toplama işlemi de yapılarak 14 sonucuna ulaşılır. Tabi ki bunları anlatmama gerek yoktu eşitliğe bakar bakmaz anladık zaten sonucu.

Lojik

Geldik programcıyla normal insanı ayıran en önemli özelliğe, 1'ler 0'lar yada doğrular yanlışlar meselesi. Bir işlemin sonucunda doğru ya da yanlış  şeklinde bir değer çıkıyorsa bu değere ikili sistem değer denir. true - doğru , false - yanlış , boolean - ikili sistem kelimeleri programcılıkta çok yaygın kullanılır. 

Matematik işlemleri gibi ikili sistem için de değişik işlemler vardır. Bunlar da işlemcinin iki tarafındaki değerleri işleyip ikili sistem bir değer sonucu çıkarırlar. Şimdi lojik işlemlerini görelim.

Eşitlik (Denklik daha doğru)

İki değerin eşit oldukları === işlemi ile kontrol edilir (bitişik 3 tane eşit işareti). 

Programcılıkta noktalı sayılar nokta ile ifade edilirken Türkçe klavyede nümerik pad'e virgül koyanı da programcılar adına haseten anıyorum

Eşit olmamasını kontrol ederken de !== işlemi kullanılır.

Büyüktür, küçüktür karşılaştırması

Bir derğişkenin değerinin diğerinin değerinden ya da sabit bir değerden büyük ya da küçük olmasını görmek çok kullanılan bir işlem çeşididir. > işareti sol tarafındaki değer sağ tarafındaki değerden büyükse true verecektir. 

Tersi olarak < işareti de sol taraftaki değer sağ taraftakinden küçükse true dönecektir.

Bu iki karşılaştırma işlemi eşit olma durumunu da içine alarak >= (büyüktür ya da eşittir) ve <= (küçüktür ya da eşittir) karşılaştırmaları da yapabiliriz.

Koşullu davranışlar

Yukarıda anlattığımız lojik programlarda karar verme amacıyla çok kullanılır. Bir karşılaştırmanın sonucuna göre bir kısım programın çalışacağı ya da çalışmayacağına hükmedilir. Bunları yöneten yapılara koşullu davranışlar denir. Bir çok koşullu davranış komutu var ama biz özellikle if (eğer ..) yapısı üzerinde duracağız. Bazıları derki programcılık kopyala ve yapıştırdan ibarettir, bazıları der ki programcılık if/then/else den ibarettir. Hep beraber görüyoruz neyden ibaret olduğunu. 

if

En yaygın koşullu davranış komutudur. Eğer parantez içinde verilen koşul doğruysa arkasından gelen bloğun içindeki kod çalıştırılır, doğru değilse bloğun sonuna atlanır. Hatırlar mısınız size en başta JavaScript programların eğer biz başka bir şekilde yönlendirmediysek satır satır işleyerek en sona kadar çalışacağını yazmıştım. İşte o yönlendirmelerden biri if komutu, eğer koşul doğru çıkmazsa blok içindeki kod işlenmeyecek. 

En basit if yapısı şöyle olur,

if (10 > 5) {
    // Buradaki kod çalışır, koşul true verir
}

if (10 < 5) {
    // Buradaki kod çalışmaz, koşul false verir
}

if kelimesinden sonra gelen parantezin içindeki işlemin sonucu true değeri dönerse arkasından gelen süslü parantezler içinde sınırları belirlenmiş olan blok program çalışır. Yok false değeri dönerse blok sonuna yani süslü parantezin kapandığı yere atlanır.

JavaScript programlama dilinde "//" ile başlayan yazılar yorum satırlarıdır sadece programcı kendisine ya da programa bakan başkalarına açıklama yapmak için yorum yazar ama JavaScript bu yorumları dikkate almaz, // karakterlerini görünce sonraki satıra atlar.

if-else

Eğer koşul gerçekleşirse bir blok ama gerçekleşmezse de başka bir blok programı çalıştırmak istersek, if bloğunun bittiği yerde else kelimesi kullanarak yeni bir blok açarız. else bloğu içine de koşul gerçekleşmediyse çalışmasını istediğimiz kodu yazarız.

if (koşul) {
    // Burası koşul true olunca çalışır
} else {
    // Burası koşul false olunca çalışır
}

İşte size if koşulunun ve else koşulunun geçerli olduğu iki örnek

Böyle iki sıkıda anladık geçtik ama yazılıma devam ederseniz en çok kullandığınız yapılardan biri olacak bu if/else yapısı.

Döngüler

Döngüler bir bloğun içindeki kodu tekrar tekrar çalıştırmaya yarar. Örneğin birşeylerin içinde arama yaparken, bir tablodaki verileri satır satır incelerken, bir array'in tüm elemanları üzerinde işlemler yaparken (panik yok array konusu da bir gün gelir elbet).

En çok kullanılan döngü yapıları while döngüleri ve for döngüleridir. Bu kelimelerin arkasından parantez içinde verilen koşullar geçerli olduğu müddetçe süslü parantezler içindeki kod sürekli çalıştırılır. Bir başka bitirme yolu da blok içinde bir karşılaştırmaya bağlı olarak JavaScript'in döngüden çıkmasını emretmektir.

while döngüsü

while kelime anlamında ".. olduğu sürece" demek. Kelimeden sonra gelen parantez içindeki koşul doğru olduğu müddetçe blok içindeki kodu çalıştırır. Örnek

var i = 1;
while (i < 10) {
    alert(i);
    i = i + 1;
}
// i şimdi 10 oldu

Yukarıdaki kod i = 1 değeri ile çalışmaya başlıyor i değeri 10'dan küçük olduğu için blok çalışıyor i değerini alarm popup'ında gösteriyor sonra i değeri bir arttırılıyor. En son i değeri 9 iken blok içine giriliyor ve alarm penceresi açılıyor sonra i değeri bir artıp 10 olunca while kelimesi yanındaki koşul artık geçerli olmadığı için blok işlenmeden döngüden çıkılıyor. Yani 10 değeri pencereye çıkarılmıyor.

Burada i = i + 1; satırı da kafa karıştırabilir. Şöyle açıklayayım önce eşitliğin sağ tarfındaki işlem gerçekleştirilir ve bir değer bulunur sonra bu değer sol taraftaki değişkene atanır. Mesela i = 2 iken bu satıra gelince önce 2 + 1 işlemi yapılır 3 sonucu bulunur, sonra bu değer i değişkenine atanır. Sanki soldaki yeni i sağdaki eski i değeri gibi oluyor.

For döngüsü

for döngüsü biraz karışık gelebilir. Parantez içinde sadece koşul olmaz döngü başında ve döngü boyunca her seferinde yapılacak işlemler de parantez içinde ";" ile ayrılmış olarak belirtilir. Yukarıda while döngüsünde i değişkenine döngüye başlamadan evvel bir değer verdik, sonra blok içinde her döngü sonunda değeri bir arttırdık. for döngüsünde bu iş şöyle yapılır.

for (var i = 1; i < 10; i++) {
    alert(i);
}

Parantez içindeki ilk işlem döngü başlarken yapılır (var i = 1;) ve bir daha yapılmaz. Parantezin içindeki ikinci grup ise döngünün koşulunu oluşturur (i < 10) i değeri 10'dan küçükse blok içindeki komutlar işlenir. Blok sonuna gelindiğinde de parantez içindeki üçüncü grubun gösterdiği işlem yapılır. Buradaki i++ işlemi i değerini bir arttırır yani i = i +1 ile aynı işi yapar. 

JavaScript konuları biraz daha ağır geçiyor. Yeni başlayanlara anlatacak çok şey var.

Fonksiyonlar

Fonksiyonlar bir programlama dilini programlama dili yapan ana yapı taşlarından biridir. Diğer dillerde prosedürler ya da metodlar olarak da adlandırıldıkları olur. Programları bize ömrü hayatımızda bir kere lazım olacak bir işi yapmak için yazmayız. Bize sürekli lazım olan işleri yapmak , bir çok yere erişmek için yazarız. Programların içinde de sürekli tekrarlanan aynı ya da benzer işi yapacak kod gruplarını sürekli diğerinden kopyalamak yerine fonksiyonlar kullanılır. Fonksiyonlar kendilerine tanımladığımız bir görevi yapmak üzere yazılmış kod bloklarıdır. 

Fonksiyonlar programımızı daha düzenli ve anlaşılabilir yapmak için de çok faydalıdır. Mesela bir mesajlaşma sitemiz olsa kullanıcının giriş yapma işlemleri için bir fonksiyon, mesajlaşacağı kişiyi seçmesi için bir fonksiyon , mesaj göndermesi için bir fonkiyon vs. programı parçalara ayırarak hem anlaşılabilirliğini hem de üzerinde hakimiyetimizi arttırırız. 

Tanımlanan bir fonksiyonun içindeki kodları çalıştırmak için bu fonksiyon çağırılır (call işlemi).  Fonksiyona yapacağı işlemde kullanmak üzere bazı veriler de gönderebiliriz, bunlara argümanlar denir. Fonksiyonlar işleri bitince istersek bize yaptıkları işin sonucuna göre bilgi de dönebilirler buna da dönüş değeri (return value) denir.  

Fonksiyon tanımlaması değişken tanımlamasına benzer ama eşitliğin sağ tarafında bir değer değil fonksiyonun tanımı verilir. Daha sonra bu fonksiyon çağırılırken adının yanına parantez açma-kapatması eklenir. Eğer fonksiyona argüman değeri gönderilecekse bu parantezin içine argüman değerleri konur. Tanımlama function kelimesi arkasından parantez içinde argüman listesi ve bir komut bloğu ile yapılır. Örnek,

var topla = function (a, b) {
    return a + b;
};

Bu kodda function kelimesi topla'nın bir değişken değil bir fonksiyon olduğunu belirtir. Parantez içinde verilen (a, b) ise fonksiyona gönderilen 2 argüman değeri temsil eder. Mesela daha sonra fonksiyonu çağırırken topla(3, 5) diye çağırdığımızda a=3 ve b=5 olarak fonksiyona bildirilecektir. Daha sonra süslü parantez içinde her zaman olduğu gibi bir kod bloğu veriyoruz. Buradaki gibi tek satır kod olmak zorunda değil sadece basit göstermek için böyle yapılmış blok içinde istersek 1550 satır kod da koyabiliriz. Blok içinde örnek fonksiyonumuz ne yapıyor? a + b işlemi sonucunu return komutuyla geri dönüyor. JavaScript return kelimesini gördükten sonra fonksiyonu bitirir, arkasında başka satır varsa onları işlemez.

Konsolda bu fonksiyonu deneyelim

En temel konulardan birini de inceledikten sonra daha da temel bir konuya geçelim.

Nesneler (objects)

JavaScript nesneleri gerçek hayat nesnelerine benzer , özellikleri ve kabiliyetleri vardır. (Herkes de kendi programlama dilini böyle anlatır gerçek hayattaki nesneler gibi.. Gerçek hayat nesnelerinin duyguları da var, hasta oluyorlar , çürüyorlar, paslanıyorlar, öğreniyorlar , unutuyorlar falan-filan). 

Nesnelerin özellikleri ve metodları vardır. Bir nesneyi bir değişken içine atadığımızda özelliklerine ve metodlarına değişken adının arkasından bitişik bir nokta ekledikten sonra özellik ya da metod adını yazarak o nesneye ait olanlara erişiriz. 

Basite indirgenmiş bir insan nesnesini örnek verelim. Bu insanın adı, yaşı, cinsiyeti gibi şeyler özelliklerini oluşturur. Konuşması, hareket etmesi, öğrenmesi ise metodlarını oluşturur. 

Nesneleri değişkene atayabiliriz demiştik. Bu atamayı yaparken süslü parantez içinde bir blok gireriz. Örnek,

var jedi = {
    isim: "Yoda",
    yaş: 899,
    konuş: function () { alert("haydi... Sky... walk..."); }
};

Bu Jedi'nin ismi ve yaşı özellikleri, konuş ise Jedi'ye ait bir metod. Bunu konsolda deneyelim,

Ayrıca nesnenin özelliğini değiştirebiliriz de.

jedi.isim = "Mace Windu";

Ya da yeni bir özellik ekleyebiliriz.

jedi.ışınkılıcı = "Mor";

Özellikler nesne ya da array de dahil olmak üzere her türlü veri olabilir. Bir nesnenin özelliğine başka bir nesne eklediğimizde içiçe nesne (nested object) oluşur. Örnek,

var insan = {
    yaş: 122
};

insan.isim = {
    ad: "Ümit",
    soyad: "Kayacık"
};

Boş bir nesne oluşturup içine sonradan ekleme yapmak da mümkün,

var köpek = {};

köpek.havla = function () { alert("Hrr hav hav!!"); };

Array

Geldik başlangıç seviye son adıma. Array'ler herhangi bir çeşit verilerden oluşan listelerdir. Listelerin içindeki değerlere  elemanlar denir, bunlar her türlü veri olabileceği gibi başka array'ler de olabilir. Array içindeki her elemanın bir sıra numarası vardır, buna index denir. Bu sıra numarasıyla array eleman değerlerine ulaşılabilir. 

Sıra numaraları 0'dan başlar. Array yazımında en sol başta yazdığımızz elemanın index'i 0'dır. Arkasından gelen elemanlar 1,2,3,4 diye gider. En son elemanın numarası array uzunluğunun (yani eleman sayısının) bir eksiğidir. 

JavaScript ve diğer bir çok programlama dillerinde array köşeli parantez içine girilmiş değerler ve aralarında virgül ile ayırarak ifade edilir. Şöyle ki,

var boşArray = [];

var alacakListesi = ['Süt', 'Ekmek', 'Fasulye'];

Array elemanlarından birine ulaşmak için köşeli parantez kullanırız.

alacakListesi[0];
=
"Süt"

Aynı şekilde köşeli parantez ve index kullanarak istediğimiz elemanın değerini de değiştirebiliriz.

alacakListesi[1] = "Kurabiye";
alacakListesi;
=
["Süt", "Kurabiye", "Fasulye"]

Array uzunluğunu length özelliğinden öğrenebiliriz.

alacakListesi.legth;
=
3

push ve pop metodları kullanarak listenin en sonuna ekleme yapabilir ya da son elemanı silebiliriz.

Böylece yeni araba alma hayalimizden de çabucak vazgeçmiş olduk.

Aşağıdaki scripti script.js dosyamıza yazalım ve index.thml sayfamızı yenileyelim.

script.js

var merhabaDe = function (kişiAdı) {
    return "Merhaba " + kişiAdı;
}

var insanlar = ['Ümit', 'Yoda', 'Bego'];

insanlar.push('Aptullah');
insanlar.push('Dr Evil');

insanlar.pop();

for (var i=0; i < insanlar.length; i++) {
    var selam = merhabaDe(insanlar[i]);
    alert(selam);
}

Sırasıyla alarm popupları açıp "Merhaba Ümit" , "Merhaba Yoda" , "Merhaba Bego" ve  "Merhaba Aptullah" yazacaktır.

JavaScript'in de başlangıç seviye kursunu bitirdik. Artık kısmet orta seviye kurslara. Kalın sağlıcakla..