İnternet Programlama-I

İnternet Programlama-I
JAVASCRİPT -NESNELER VE DİZİ İŞLEMLERİ-

Javascript Nesneleri JavaScript programlama dilinde nesneler önemli bir yer tutar. JavaScript nesneleri özellikler (properties) ve yöntemlerden oluşan bir topluluktur. Yöntem, nesnenin elemanı olan bir işlevdir. Özellik ise, nesnenin bir özniteliği (attribute) olarak bilinir. Özellikler, nesnenin boyutu, rengi, ekrandaki konumu ve bunun gibi nitelikler olarak bilinir.

For..in Deyimi Bir nesnenin her bir özelliği için, döngü içinde belirlenen deyimlerin çalıştırılmasını sağlar. Bu deyim şu şekilde tanımlanıyor : for (değişken in nesne ) { deyimler } değişken: Her bir özellik için ardışık işlem görecek değişken nesne: Özellikleri kullanılacak nesnenin adı deyimler Her bir özellik için işlem görecek deyimler

For..in Deyimi Örnek: Bir dizinin içini O ile 9 arasındaki rakamlarla dolduran ve daha sonra bu dizi elemanlarını görüntüleyen bir program yazalım

For..in Deyimi <SCRIPT language="Javascript"> // Dizinin oluşturulması. var dizi = new Array(); for (i = 0; i < 10; i++) { dizi [i] = i; } // Dizi içeriğinin yazdırılması.. for (var i in dizi ) { document.write(i + "<br>");} </SCRIPT>

This Deyimi O anda üzerinde çalışılmakta olan nesneyi belirtmek üzere This deyiminden yararlanılabilir. Bu deyim, nesne özelliklerinin tanımlanması esnasında, nesne adının belirtilmeden kullanılmasında yararlı olacaktır. Söz konusu deyim aşağıda belirtildiği biçimde tanımlanmaktadır: this.özellik

This Deyimi Örnek: Bir otomobil nesnesinin tanımlandığını varsayalım. Otomobil nesnesinin renk, motor ve model gibi özellikleri bulunabilir. Bu nesnenin özelliklerini bir işlev içinde aşağıda gösterildiği biçimde tanımlayabiliriz. function otomobil(renk, motor, model){ this.renk = renk; this.motor =motor; this.model = model;

Nesnenin Ortak Kullanımı - With Deyimi
Varsayılan bir nesne üzerinde uygulanacak deyim gruplarını belirlemek üzere With deyiminden yararlanılabilir. Bu deyim aşağıda belirtildiği biçimde tanımlanır: with (nesne)-f deyimler } nesne: Deyimlerin uygulanacağı nesne deyimler: Söz konusu nesne için geçerli olacak deyimler

Nesnenin Ortak Kullanımı - With Deyimi
Örnek: üç ayrı işlem için Math nesnesinin kullanılması gerektiğini varsayalım. Bu üç işlem için söz konusu nesneyi ayrı ayrı tanımlamak yerine, With deyimi ile aşağıda gösterildiği biçimde tanımlayabiliriz. var x, y, z var r=10 with (Math) { x = pi * r * r y = r * cos(pi) z = r * sin(pi/2)

Nesne Özellikleri Hakkında Bilgi Edinme
Nesneyi yaratan işlev hakkında bilgi edinilmek söz konusu ise, nesnelerin constructor özelliğinden yararlanılır. Bu özellik, hem nesneyi yaratan işlev, hem de nesne özelliklerinin neler olduğu hakkında bilgi sağlar. Söz konusu özellik aşağıda gösterildiği biçimde kullanılır: nesne.constructor Bu özellik kullanıcı tarafından yaratılan nesnelere uygulanabileceği gibi, hazır nesnelere de uygulanabilir.

Örnek: müşteri adındaki bir nesneyi göz önüne alarak, hangi işlev tarafından yaratıldığını ve özelliklerinin neler olduğunu listelemek istiyoruz.

<SCRIPT LANGUAGE="JavaScript"> musteri = new musteri_islev(); // Nesne işlevi ve özellikleri tanımlanıyor, değer atanıyor.. function musteri_islev() { this.adi = "Okan" this.soyadi = "Özkan" this.dogum_yili = "1982“ } document.write(musteri.constructor) ; </SCRIPT>

Hazır JavaScript Nesneleri
JavaScript programcılara iki tür nesne tanımlama olanağı sunar. Bunlardan birincisi, programcının kendi yarattığı nesnelerdir. İşlevler yardımıyla bu tür nesneler tanımlanır. Bir diğer nesne türü ise, JavaScript tarafından hazır olarak sunulan nesnelerdir. Bu tür nesneler sistemin yerleşik nesneleridir ve doğrudan doğruya tanımlanarak kullanılır.

Nesnelere bir Özellik Eklenmesi
Kullanıcı tarafından yaratılan nesnelere yeni bir özelliğin nasıl ilave edilebileceğini ncelemiştik. Eğer hazır bir Javascript nesnesi söz konusu ise bu kez daha farklı bir yol izlenebilir. Böyle bir amaca ulaşabilmek için prototype özelliğinden yararlanılabilir. Söz konusu özellik şu şekilde kullanılır: nesne adı.prototype Program içinde nesneye verilen isim ile birlikte bu özellik kullanılır.

Örnek: Dizi nesnesine yeni bir özellik eklemek istiyoruz. Bu özellik, nesnenin içerdiği elemanların en büyüğünün elde edilmesi üzerinedir. Yani nesneye bu özelliği bir kez kazandırdıktan sonra, söz konusu özellik ile programın herhangi bir yerinde nesne elemanlarının sayısını doğrudan öğrenmek mümkün olacaktır.

<SCRIPT LANGUAGE="JavaScript"> // Nesnelerin tanımlanması.. var dizi1 = new Array(45,12,20,80,66,43); var dizi2 = new Array(211,342,333,747,399,260,70,390); // Nesne özelliğinin tanımlanması.. Array.prototype.enBuyuk = enBuyuk_bul; // Dizilerin en büyük değerinin listelenmesi.. document.write("Birinci dizinin en büyük elemanı=" + dizi1.enBuyuk( ) + "<br>"); document.write("İkinci dizinin en büyük elemanı=" + dizi2.enBuyuk( ));

// Bir dizinin en büyük değerini bulan işlevin tanımlanması., function enBuyuk_bul( ){ var i, buyuk = this[0]; for (i = 1; i < this.length; i++) { if (buyuk < this[i]) buyuk = this[i]; } return buyuk ; </SCRIPT>

Dizilerin Kullanılması - Array Nesnesi
Javascript’ de dizileri kullanmak gerektiğinde array nesnesine başvurulur. Diziler, değişkenlerden farklıdır. Değişken sadece bir değeri saklayabilen bir ortamdır. Örneğin, adi = “Burak” biçiminde bir değişken tanımlandığında, adi değişkeni program boyunca sadece bir değeri taşıyacaktır. Buna karşılık, diziler birden fazla değer taşıyan nesneler olarak değerlendirilir. Örneğin, adi isimli bir nesne birden fazla “Burak”, “Begüm”, “Dilay” gibi elemanlara sahip olabilir.

Bu tür bir özelliğe sahip olduğu için array nesnesi programlarda sıkça kullanılır. Bu nesne aşağıda gösterildiği biçimlerde kullanılabilir: nesne = new Array() nesne = new Arrav([boyut]) nesne = new Array(eleman0. eleman1,..,]) nesne Dizi nesnesinin adı boyut Dizinin içerdiği eleman sayısı. Dizinin boyutu eleman 0, eleman 1,.., Dizi elemanları. Dizi elemanları sıfırdan başlayarak numaralandırılır

Yeni bir dizinin tanımlanması için new Array () tanımı yapılabilir. Ancak dizi nesnesini daha kısa biçimde de yaratabiliriz. Bunun için aşağıda gösterilen tanım kullanılabilir: nesne = [elemanO, elemanı,..,] Bunun anlamı, nesne elemanlarını köşeli parantezler içine yerleştirerek program içinde tanımlayabiliriz. Örnek: İsimlerden oluşan bir dizi yaratarak, bu diziyi tarayıcı penceresinde görüntüleyeceğiz.

<SCRIPT LANGUAGE="JavaScript"> // Nesnenin tanımlanması.. var isimler = new Array("Burak","Begüm","Dilay","Selin","Seray"); // Dizinin içerdiği elemanların listelenmesi.. for (i = 0; i < 5; i++) { document.write (isimler[i] + "<br>"); } </SCRIPT>

Diziye değer yerleştirme işlemi, dizi boş olarak yaratıldıktan sonra da tek tek yapılabilir. <SCRIPT LANGUAGE="JavaScript"> var isimler = new Array(); // Dizi içine isimlerin yerleştirilmesi.. isimler[0] = "Burak" isimler[1] = "Begüm" isimler[2] = "Dilay" isimler[3] = "Selin" isimler[4] = "Seray" // Dizinin içerdiği elemanların listelenmesi.. for (i = 0; i < 5; i++) { document.write (isimler[i] + "<br>"); } </SCRIPT>

Dizi Elemanlarını Birleştirme
Bir dizinin içerdiği tüm elemanları birleştirerek, bir dizgi içine yerleştirmek mümkündür. Bunun için dizi nesnesinin join yönteminden yararlanılır. Bu yöntem aşağıda görüldüğü biçimde tanımlanır: dizi.join("ayıraç ") dizi :Dizi olarak tanımlanmış nesnenin adı Ayıraç :Dizi elemanlarının birleştirilmesi esnasında kullanılacak ayıraç. Eğer herhangi bir tanım yapılmaz ise, virgül işaretinin tanımlandığı varsayılır

Dizi elemanlarını birleştirerek yeni bir dizinin içine yerleştirmenin bir başka yolu daha bulunmaktadır. Böyle bir işlem valueOf () yöntemi yardımıyla yerine getirilir. Bu yöntem ayıraç seçilmesine izin vermez. Ayıraç olarak kendisi virgül işaretini kullanır dizi.valueOf()

Yukarıda anlatılanların bir benzeri toString() yöntemi yardımıyla yerine getirilebilir. Bu işlev, bir dizinin içerdiği değerleri dizgi değere dönüştürdükten sonra, aralarına virgül yerleştirir ve tek bir dizgi değer olarak belirler. Söz konusu yöntem şu şekilde tanımlanır: dizi.toString()

isimler dizisinin içerdiği tüm elemanları, aralarına (-) işaretini yerleştirerek birleştiren programı yazalım… <SCRIPT LANGUAGE="JavaScript"> // Nesnenin tanımlanması.. var isimler = new Array("Burak","Begüm","Dilay","Selin","Seray"); // Dizi elemanlarının yer alacağı değişkenin tanımlanması.. personel = isimler.join("-"); // Dizinin içerdiği elemanların listelenmesi.. document.write (personel); </SCRIPT>

Aynı programı bu kez valueOf () yöntemiyle yapalım… <SCRIPT LANGUAGE="JavaScript"> // Nesnenin tanımlanması.. var isimler = new Array("Burak","Begüm","Dilay","Selin","Seray"); // Dizi elemanlarının yer alacağı değişkenin tanımlanması.. personel = isimler.valueOf(); // Dizinin içerdiği elemanların listelenmesi.. document.write (personel); </SCRIPT> Yukarıdaki sonuca aynen ulaşmak için , personel = isimler.toString(); ifadeside kullanılabilir…

İki Diziyi Birleştirerek Yeni bir Dizi Elde Etmek
Dizi elemanlarının join yöntemi ile nasıl birleştirilebileceğini gördük. Bu kez iki diziyi birleştirerek yeni bir dizinin elde edilmesi olgusu üzerinde duracağız. Böyle bir sonuca ulaşabilmek için concat yönteminden yararlanılır. Bu yöntem şu şekilde tanımlanır: Dizi 1.concat(diğer dizi veva eleman) Bu tanımdan şu anlaşılmaktadır: İki dizi birleştirilebileceği gibi, daha fazla sayıda dizi ya da dizi elemanları birleştirilebilir

İki Diziyi Birleştirerek Yeni bir Dizi Elde Etmek
isimler ve öğrenciler dizilerinin içerdiği değerleri biraya getirerek tum_personel isimli yeni bir dizi yaratalım… <SCRIPT LANGUAGE="JavaScript"> // Dizilerin tanımlanması.. var isimler = new Array("Burak","Begüm","Dilay","Selin","Seray"); var öğrenciler = new Array("Sezin", "Dilara", "Aybike"); // Dizi elemanlarının yer alacağı değişkenin tanımlanması.. tum_personel = isimler.concat (öğrenciler) ; // Dizinin içerdiği elemanların listelenmesi.. document.write (tum_personel); </SCRIPT>

Dizi Elemanlarının Sıralanması
Bir dizinin içerdiği elemanları sıralamak söz konusu olabilir. Bunun için sort yöntemi kullanılabilir. dizi.sort(sıralama işlevi) Parantez içinde herhangi bir şey tanımlanmaz ise, sıralamanın artan sırada olduğu varsayılır. Eğer farklı bir sıra söz konusu ise bu işlev içinde tanımlanır.

Bir dizinin 5,1,7,9,11,0,9 elemanlarını içerdiğini varsayalım. Bu dizinin elemanlarını sıralayarak görüntüleyelim… <SCRIPT LANGUAGE="JavaScript"> // Dizilerin tanımlanması.. var sayilar = new Array(5,1,7,9,11,0,9); // Dizinin içerdiği elemanların sıralanması.. sayilar.sort(); // Dizinin içerdiği elemanların listelenmesi.. document.write (sayilar.join()); </SCRIPT>

<SCRIPT LANGUAGE="JavaScript"> // Dizilerin tanımlanması.. var sayilar = new Array(5,1,7,9,11,0,9); // Dizinin içerdiği elemanların sıralanması.. sayilar.sort(yon); // Dizinin içerdiği elemanların listelenmesi.. document.write (sayilar.join()); function yon(a, b) { return a-b } </SCRIPT>

<SCRIPT LANGUAGE="JavaScript"> // Dizilerin tanımlanması.. var sayilar = new Array(5,1,7,9,11,0,9); // Dizinin içerdiği elemanların sıralanması.. sayilar.sort(yon); // Dizinin içerdiği elemanların listelenmesi.. document.write (sayilar.join()); function yon(a, b) { return b-a } </SCRIPT>

Dizi Elemanlarının Yer Değiştirmesi
Bir dizinin içeriğinin transpozesini elde etmek için reverse() yönteminden yararlanılır. Bu yöntem, dizinin ilk elemanını en son, sondaki elemanını ise birinci eleman haline getirir. Bu yöntem aşağıda gösterildiği biçimde kullanılır: dizi .reverse()

Dizi Elemanlarının Yer Değiştirmesi
Bir dizinin 5,1,7,9,11,0,9 elemanlarını içerdiğini varsayalım. Bu dizinin transpozesini elde edelim… <SCRIPT LANGUAGE="JavaScript"> // Dizilerin tanımlanması.. var sayilar = new Array(5,1,7,9,11,0,9); // Dizinin içerdiği elemanların transpozesi.. sayilar.reverse(); // Dizinin içerdiği elemanların listelenmesi.. document.write (sayilar.join()); </SCRIPT>

Dizinin İçerdiği Eleman Sayısını Bulmak
Bir dizinin içerdiği elemanların sayısını elde etmek mümkündür. Bunun için dizi nesnesinin length özelliğinden yararlanılır. Söz konusu özellik şu şekilde kullanılır: dizi.length

Dizinin İçerdiği Eleman Sayısını Bulmak
iki farklı dizinin eleman sayılarını bulalım… <SCRIPT LANGUAGE="JavaScript"> // Dizilerin tanımlanması.. var isimler = new Array("Burak","Begüm","Dilay","Selin","Seray"); var öğrenciler = new Array("Sezin", "Dilara", "Aybike"); // Dizinin içerdiği eleman sayılarının listelenmesi.. document.write ("Birinci dizi eleman sayısı = " + isimler.length + "<br>"); document.write ("İkinci dizi eleman sayısı = " + öğrenciler.length); </SCRIPT>

Dizinin İlk veya Son Elemanının Silinmesi
Bir dizinin ilk elemanını ya da son elemanını silmek mümkündür. Bunun için pop() ve shift () yöntemlerinden yararlanılır. Shift () yöntemi dizinin birinci elemanını yok eder. Buna karşılık, pop() yöntemi dizinin en sondaki elemanını siler. Söz konusu deyimler aşağıda gösterildiği biçimde tanımlanır: nesne.shift () nesne.pop() Dizinin içerdiği ilk ve son elemanların silinmesiyle ilgili bu iki yöntemin Netscape 3.0 ve Internet Explorer 5.5 den itibaren kullanılabildiğini göz önünde tutmak gerekiyor.

isimler dizininin beş eleman içerdiğini biliyoruz. Bu dizinin birinci elemanını yok edelim… <SCRIPT LANGUAGE="JavaScript"> // Nesnenin tanımlanması.. var isimler = new Array("Burak","Begüm","Dilay","Selin","Seray"); isimler.shift() // Dizinin içerdiği elemanların listelenmesi.. for (i=0;i<isimler.length;i++) { document.write (isimler[i] + "<br>"); } </SCRIPT>

Bu kez dizinin son elemanını yok edelim… <SCRIPT LANGUAGE="JavaScript"> // Nesnenin tanımlanması.. var isimler = new Array("Burak","Begüm","Dilay","Selin","Seray"); isimler.pop() // Dizinin içerdiği elemanların listelenmesi.. for (i=0;i<isimler.length;i++) { document.write (isimler[i] + "<br>"); } </SCRIPT>

Diziye bir Konumdan İtibaren Eleman Ekleme veya Silme
Bir diziye belirli bir konumda bir elemanın eklenmesi ya da bir elemanının yok edilmesi söz konusu olduğunda splice() yönteminden yararlanılır. dizi.splice(başlama, silinecek eleman sayısı, [eklenecek elemanlar]) Bu deyimin Netscape 3.0 ve Internet Explorer 5.5 ‘den itibaren kullanılabildiğini göz önünde tutmak gerekiyor.

isimler dizisinin 3. ve 4. elemanları arasında “Onur” isimli bir eleman ekleyelim… <SCRIPT LANGUAGE="JavaScript"> // Dizinin tanımlanması.. var isimler = ["Burak","Begüm","Dilay","Selin","Seray"]; document.write ("Dizi : " + isimler.join() + "<br>"); // Yeni dizinin tanımlanması.. isimler.splice(3,0,"Onur"); document.write ("Yeni dizi : " + isimler.join()); </SCRIPT>

Bu kez, dizinin 2. elemanından sonraki elemanını yok edip ve “Onur” ile “Hatice” elemanlarını diziye bu konumdan itibaren ekleyelim... <SCRIPT LANGUAGE="JavaScript"> // Dizinin tanımlanması.. var isimler = ["Burak","Begüm","Dilay","Selin","Seray"]; document.write ("Dizi : " + isimler.join() + "<br>"); // Yeni dizinin tanımlanması.. isimler.splice(2,1,"Onur","Hatice"); document.write ("Yeni dizi : " + isimler.join()); </SCRIPT>

Dizinin Sonuna Eleman Ekleme
Bir dizinin sonuna belirli elemanları ekleme amacıyla push() yönteminden yararlanılır. Bu yöntem, yeni dizinin eleman sayısını döndürür. Yöntem şu şekilde tanımlanmaktadır: dizi.push(yeni elemanlar) Bu deyimin Netscape 3.0 ve Internet Explorer 5.5 ‘den itibaren kullanılabildiğini göz önünde tutmak gerekiyor.

Dizinin Sonuna Eleman Ekleme
isimler dizisinin sonuna “Onur” ve “Hatice” elemanlarını ekleyelim… <SCRIPT LANGUAGE="JavaScript"> // Dizinin tanımlanması.. var isimler = ["Burak","Begüm","Dilay","Selin","Seray"]; document.write ("Dizi : " + isimler.join() + "<br>"); // Yeni dizinin tanımlanması.. eleman = isimler.push("Onur","Hatice"); document.write ("Yeni dizi : " + isimler.join() + "<br>"); document.write ("Yeni dizi eleman sayısı : " + eleman); </SCRIPT>

Dizinin Başına Eleman Ekleme
Dizinin sonuna eleman eklemek için push() yöntemini kullanıyoruz. Ancak dizinin başına belirlenen elemanların eklenmesi söz konusu ise unshift() yöntemi kullanılır. Söz konusu yöntem şu şekilde tanımlanır: dizi.unshift(yeni elemanlar) Bu deyimin Netscape 3.0 ve Internet Explorer 5.5 ‘den itibaren kullanılabildiğini göz önünde tutmak gerekiyor.

Dizinin Başına Eleman Ekleme
<SCRIPT LANGUAGE="JavaScript"> // Dizinin tanımlanması.. var isimler = ["Burak","Begüm","Dilay","Selin","Seray"]; document.write ("Dizi : " + isimler.join() + "<br>"); // Yeni dizinin tanımlanması.. isimler.unshift("Onur","Hatice"); document.write ("Yeni dizi : " + isimler.join() + "<br>"); </SCRIPT>

Dizinin bir Kısmından Yeni bir Dizi Oluşturma
Bir dizinin belirli bir bölümünü kullanarak yeni bir dizi oluşturulabilir. Böyle bir amaç için slice() yönteminden yararlanılır. Bu yöntem şu şekilde tanımlanır: dizi.slice(başlama, [son]) dizi: Dizinin adı Başlama: Bu diziden alınacak elemanların başlama konumu Son: Bu diziden alınacak elemanların bitiş konumu. Tanımlanması zorunlu değildir

Bu yöntem, elemanları sıfırdan başlamak üzere numaralandırır. Yeni dizi başlama konumundan itibaren son konuma kadar olan elemanlardan elde edilir. Ancak son konumdaki eleman dahil edilmez. Bazı durumlarda başlama ya da son konumları negatif bir sayısal değer ile ifade edilebilir. Eger başlama değeri negatif ise, dizinin uzunluğu ile bu sayısal değer toplanarak yeni başlangıç noktası elde edilir. Benzer biçimde, son konumu negatif bir sayısal değer ile ifade ediliyorsa, dizinin uzunluğu ile bu değer toplanarak yeni son konum bilgisi elde edilir.

İsimlerden oluşan isimler dizisinin 2. ve 3. elemanlarından yeni bir dizi oluşturalım… <SCRIPT LANGUAGE="JavaScript"> // Dizinin tanımlanması.. var isimler = ["Burak","Begüm","Dilay","Selin","Seray"]; document.write ("Dizi : " + isimler.join() + "<br>"); // Yeni dizinin tanımlanması.. var yeni=isimler.slice(1,3); document.write ("Yeni dizi : " + yeni.join() + "<br>"); </SCRIPT>

İnternet Programlama-I

Benzer bir sunumlar

... konulu sunumlar: "İnternet Programlama-I"— Sunum transkripti:

Benzer bir sunumlar

Proje hakkında

Geri bildirim

Giriş

Sosyal ağ üzerinden giriş yapmak:

İnternet Programlama-I

Benzer bir sunumlar

... konulu sunumlar: "İnternet Programlama-I"— Sunum transkripti:

Benzer bir sunumlar

Proje hakkında

Geri bildirim