Burak Orçun Özkablan 06104403 Javascript`te Sayılar Javascript`te

Burak Orçun Özkablan 06104403 Javascript`te Sayılar Javascript`te

Burak Orçun Özkablan
06104403
Programlama Dilleri Sunum ( Javascript )
Javascript'te Sayılar
Javascript'te sadece bir sayı tipi vardır: Double
Double tipi her zaman beklediğimiz gibi çalışmaz. Örneğin, double tipinde 0.1 0.2 =
0.30000000000000004'tür. Bu yüzden para ile ilgili hesaplar yapılırken çok dikkatli
olmak gerekir. Double tipi ile ilgili bu problem bütün programlama dillerinde
mevcuttur, javascript'e özel bir problem değildir.
NaN Değeri
NaN diye özel bir değer vardır. “Not a Number” (sayı değil) demektir. Tanımsız veya
hatalı işlemlerin sonucu NaN olur. Herhangi bir işlemde sayılardan biri NaN ise, sonuç
da NaN olur.
NaN hiçbir şeye eşit değildir. NaN'a da eşit değildir.
Pek mantıklı değil ama, typeof(NaN) = “number”dır.
Number(deger) şeklinde bir fonksiyon vardır. String tipli değeri sayıya çevirir. Eğer
çevirme işleminde bir problem varsa sonuç NaN olur. Aynı işlem öneki ile de yapılabilir.
parseInt Deyimi
Sadece tamsayıları ayrıştırmak (parse etmek) için parseInt isimli bir fonksiyon vardır.
Bu fonksiyon sayı olmayan ilk karakterde durur. parseInt kullanılırken taban mutlaka
yazılmalıdır. Çünkü;
• parseInt(“08”) = 0
• parseInt(“08”, 10) = 10
String Tipi
String tipi mevcuttur. Char tipi mevcut değildir. Char için 1 karakter uzunluğunda
string kullanılır.
String'ler sabittir. Oluşturulduktan sonra değiştirilemez. Örneğin 2. karakter “c”
olsun veya 3. karakter'den sonra araya “sinan” ekle denilemez. Bu tür işlemler için yeni
bir string oluşturulur.
String'lerde tek tırnak da çift tırnak da kullanılabilir. Bu ikisinin hiçbir farkı yoktur.
String(deger) şeklinde bir fonksiyon vardır. Verilen değeri string'e çevirir.
String'ler birer nesnedir ve charAt, concat, indexOf, ... gibi metotları vardır.
Boolean Tipi
2 adet boolean değer vardır: true ve false.
Boolean(deger) şeklinde bir fonksiyon vardır. Verilen değeri boolean'a çevirir. !! öneki
ile de aynı işlem yapılabilir.
null Değeri
null değeri vardır. null hiçbir şey demektir.
undefined Değeri
undefined değeri vardır. Değişken ve parametrelerin varsayılan değeri undefined'dır.
Değişken tanımlanırken başlangıç değeri verilmezse başlangıç değeri undefined olur.
Nesnelerin olmayan bir üyesinin değeri istendiğinde sonuç undefined olarak döner.
False ve True kabul edilen değerler
Aşağıdaki değerler false kabul edilir:
•
•
•
•
•
•
false
null
undefined
"" (Boş string)
0
NaN
Yukarıdakiler hariç diğer tüm değerler (tüm nesneler dahil) true kabul edilir. “0” ve
“false” tırnak içinde yazıldığı için birer string'dir ve dolayısıyla true kabul edilir.
Büyük/Küçük Harfler
Tüm anahtar kelimeler (keywords) küçük harftir. Bazı metotlar (fonksiyonlar)
camelCase'tir.
Javascript büyük/küçük harfe duyarlıdır.
Nesneler ve Üyelerine Erişim
new Object() denilerek boş bir nesne oluşturulabilir. Daha önceden oluşturulmuş bir
nesneye sonradan yeni üyeler (değişkenler, fonksiyonlar, vs.) eklenebilir.
Üyelere nesne.uye şeklinde veya nesne[“uye”] şeklinde erişilebilir.
Değişkenler
Herhangi bir tip, değişkende saklanabilir, fonksiyonlara parametre olarak
gönderilebilir, fonksiyonlardan return ile döndürülebilir.
Değişkenlere değer olarak fonksiyon atanabilir.
var a = function() {
alert("merhaba");
};
Değişken adları harf, _ veya $ ile başlar, harf, rakam, _ veya $ ile devam eder.
Tüm değişken, parametre, üye ve fonksiyonlar gelenek üzere küçük harfle başlar.
Kurucu fonksiyonlar (constructor'lar) büyük harfle başlar.
Öneki
öneki string'leri sayıya çevirmek için kullanılabilir.
•
•
•
•
”42” = 42
Number(“42”) = 42
parseInt(“42”, 10) = 42
”3” ( ”4”) = 7
== ve != Operatörlerinin Yerine === ve !== Operatörleri
== ve != operatörleri karşılaştırma için kullanılır. Ancak bunların yerine === ve !==
kullanılması tavsiye edilir. Çünkü bu operatörler hem değerleri hem de tipleri
karşılaştırır:
•
•
•
•
“4” == 4 işleminin sonucu: true
“4” === 4 işleminin sonucu: false
“4” != 4 işleminin sonucu: false
“4” !== 4 işleminin sonucu: true
&& Operatörü
Mantıksal && operatörü şu şekilde çalışır: a && b işleminde, a true kabul edilen bir
değerse ise sonuç b'dir. a false kabul edilen bir değerse ise sonuç a'dır. Burada a ve
b'nin boolean olması şart değildir. Dolayısıyla bu işlemin sonucu a veya b olacağı için,
sonuç boolean olmak zorunda değildir.
if (a) {
return a.uye;
}
else {
return a;
}
Bu mantıkla, yukarıdaki ifade şu şekilde de yazılabilir:
return a && a.member;
|| Operatörü
Mantıksal || operatörü şu şekilde çalışır: a || b işleminde, a true kabul edilen bir
değerse ise sonuç a'dır. a false kabul edilen bir değerse ise sonuç b'dir. Aynı şekilde,
burada a ve b'nin boolean olması şart değildir. Dolayısıyla bu işlemin sonucu a veya b
olacağı için, sonuç boolean olmak zorunda değildir.
var sayi;
if (girilen_sayi) {
sayi = girilen_sayi;
}
else {
sayi = eleman_sayisi;
}
Bu mantıkla, yukarıdaki ifade şu şekilde de yazılabilir:
var sayi = girilen_sayi || eleman_sayisi;
! Operatörü ve !! Şeklinde Kullanımı
!a işleminde, a false kabul edilen bir değerse sonuç true, true kabul edilen bir değerse
sonuç false olur. Bu mantıkla !!a işlemi, ya da başka bir deyişle !(!a) işlemi, a değerini
boolean tipine dönüştürmek için kullanılabilir. !!”” = false, !!”sinan” = true olur.
Bitwise Operatörleri
Bitwise operatörleri &, |, ^, >>, >>> ve << kullanılırken, operand 32-bit işaretli tamsayıya
dönüştürülür, sonra da tekrar 64-bit ondalıklı sayıya dönüştürülür. Bu yüzden, daha
hızlı çalışır düşüncesiyle, örneğin sayıyı 2 ile çarpmak yerine bitleri kaydırma işlemi
yapılırsa, tahmin edilenin aksine, bu işlem daha yavaş çalışır.
Deyimlere Etiket Verme
Deyimlere etiket verilebilir.
dongu: for (;;) {
...
if (...) {
break dongu;
}
...
}
Yukarıdaki kod parçasında görüldüğü gibi break deyiminin hangi döngüyü kıracağı
belirtilebilir. Böylece, iç içe döngüler varsa, gerektiği takdirde, en dıştaki döngü
kırılabilir.
switch Deyimi
switch deyiminde, switch değeri sayı olmak zorunda değildir. String de olabilir. Ayrıca,
case değerleri sabit olmak zorunda değildir, ifade de olabilir.
Değişken Kapsamları
{ bloklar } değişkenler için kapsam belirtmez. Sadece fonksiyonlar kapsam belirtir.
Yani bir fonksiyonun içinde tanımlanmış değişkenler fonksiyonun dışında
kullanılamazlar. Ama fonksiyonun içindeki herhangi bir blokta tanımlanmış değişkenler,
o fonksiyonun içinde her yerde (o bloğun dışında dahi olsa) kullanılabilir.
function f() {
for (var i = 0; i < 1; i ) {
var a = 5;
}
return a; // Hata vermez, 5 döndürür
}
Varolan Değişkenlerin Yeniden Tanımlanması
Aynı isimle 2 kez değişken tanımlanırsa, değişken sadece 1 kez oluşturulur ve bunun
için hata üretilmez.
var a = "sinan";
var a = "ilyas"; // Hata vermez, önceden oluşturulmuş a değişkenine “ilyas” değerini
atar
return Deyimi
return deyimi mutlaka bir değer döndürür. return'den sonra bir ifade yazılmamışsa
(return;) undefined değeri döndürülür. Bunun bir istisnası vardır: Kurucu
fonksiyonlarda varsayılan return değeri this'tir.
Nesneler
Javascript'te nesneler birer isim/değer koleksiyonudur. Veri ve metotlar içerebilir,
başka nesnelerden miras alabilirler. İsim/değer koleksiyonundaki isim herhangi bir
string olabilir. Değer ise herhangi bir tip, hatta başka bir nesne olabilir. İsim tırnak
içinde yazılabilir, ama bu isteğe bağlıdır.
var nesne = {
isim: "Sinan",
'varisYeri': 'Trabzon',
harf: 'A',
seviye: 3
}
var a = nesne.isim;
var b = nesne.varisYeri;
var c = nesne["harf"]; // nesne.harf yazmak yerine bu şekilde de yazılabilir
Nesne oluşturmak için aşağıdaki gibi bir fonksiyon da yazılabilir:
function nesneOlustur(isim, varisYeri, sinif, seviye) {
var n = {}; // Boş nesne
n.isim = isim;
n["varisYeri"] = varisYeri;
n.sinif = sinif;
n.seviye = seviye;
return n;
};
var nesne = nesneOlustur("Sinan", "Ankara", "A", 3);
Nesne İçinde Nesne
Nesnelerin içindeki değerler başka nesneler de olabilir:
var nesne = {
isim: "Sinan",
format: {
genislik: 1920,
yukseklik: 1080
}
};
Parametre Olarak Nesneler
Fonksiyonlar çağrılırken parametre olarak nesne gönderilebilir:
yazdir( {isim: "Sinan", yer: "Ankara"} );
Yukarıda görüldüğü gibi, yeni bir nesne oluşturmak için { } parantezleri yeterlidir.
Herhangi bir kurucu fonksiyon çağırmaya gerek yoktur.
Fonksiyonlara çok fazla parametre göndermek gerektiğinde, bunun yerine bir tek
nesne göndermek çok daha kullanışlıdır.
function superDiv(genislik, yukseklik, sol, ust, zIndeks, pozisyon, renk, gorunurluk,
html, cssSinifi)
function superDiv(divOzellikleri)
Nesnelere Yeni Üyeler Ekleme
Basit bir atama işlemiyle, nesnelere sonradan yeni üyeler ilave edilebilir.
nesne.gorunum.renk = 'red';
nesne["isim"] = 'sinan';
Nesneler Arasındaki Gizli Bağ
Nesneler oluşturulurken başka bir nesneye gizli bir bağ kurulabilir.
var yeniNesne = object(eskiNesne);
1.var a = yeniNesne.seviye; // 3 değeri atanır
Bu bağ sadece tek yönlü çalışır. Yeni oluşturulan nesnenin üyelerinin değerleri
değiştirildiğinde, eski nesnenin üyelerinin değerleri değişmez.
yeniNesne.ad = 'ahmet';
yeniNesne.seviye = 1;
yeniNesne.sehir = 'trabzon';
Yeni bir nesne oluştururken, dinamik bir bağ oluşturmak yerine, eski nesneyi
kopyalayarak bağımsız yeni bir nesne oluşturmak mümkün değildir.
Yeni Nesne Oluşturma Şekilleri
Yeni nesne oluşturmanın 3 yolu vardır:
var a = new Object();
var b = { };
var c = object(Object.prototype);
Bunlardan { } parantezlerinin kullanılması önerilir.
Nesnelerin Referans Olarak Gönderilmesi
Fonksiyonlara parametre olarak gönderilen nesneler ve fonksiyonlardan return ile
döndürülen nesneler, değer olarak değil referans (hafızada saklandığı adres) olarak
gönderilir.
=== operatörü değerleri değil referansları karşılaştırır.
Nesnelerin Üyelerinin Silinmesi
delete operatörü ile nesnelerin üyeleri silinebilir.
delete nesne[ad];
delete operatörünün aslında yaptığı şey, ilgili üyenin değerini undefined olarak
değiştirmektir.
Diziler
Diğer dillerden farklı olarak, Javascript'te Array'ler Object'ten miras alır.
Dizilere [ ] parantezleri kullanılarak ilk değer verilebilir.
var dizi = ['sinan','ahmet','mehmet'];
length İsimli Üye
Dizilerin length isimli bir üyesi vardır ve her zaman en büyük indeksin bir fazlasını
verir.
Yeni Dizi Oluşturma
Yeni dizi oluştururken new Array() ve [ ] kullanılabilir. Bunlardan [ ] parantezlerinin
kullanılması tavsiye edilir.
delete Operatörü ve splice Metodu
delete operatörü ile dizilerin elemanları silinebilir.
delete dizi[5];
Ancak bu şekilde silindiğinde numaralandırmada bir boşluk kalır. Çünkü aslında yapılan
şey dizinin belirtilen elemanının değerini undefined olarak değiştirmektir. Bunun
yerine splice kullanılırsa, eleman silindikten sonra, numaralandırma yeniden düzenlenir.
dizi.splice(5,1);
Dizilerden Miras Alma
Dizilerden düzgün bir şekilde miras alınamaz. Bu yüzden dizilerin prototip olarak
kullanılması tavsiye edilmez. Çünkü bu şekilde oluşturulan nesneler dizi özelliği
taşımaz. Dizinin değerlerini ve metotlarını miras alır, ama örneğin length üyesini almaz.
Dizilere Metot Ekleme
Dizilere sadece değerler değil, metotlar da eklenebilir. Çünkü diziler de aslında birer
nesnedir.
Fonksiyonlar
Fonksiyonlar herhangi bir değer gibi değişkenlerde saklanabilir, diğer fonksiyonlara
parametre olarak gönderilebilir ve return ile döndürülebilir.
Fonksiyonlar Object'ten miras alır ve isim/değer çiftleri barındırabilir.
Aşağıdaki iki ifade tamamen aynı anlama gelmektedir.
function yaz() { }
var yaz = function() {};
Fonksiyonlar, herhangi bir deyimin yazılabileceği her yerde (örneğin, başka bir
fonksiyonun içinde) tanımlanabilirler.
İç içe fonksiyonlar yazıldığında, içteki fonksiyon, dıştaki fonksiyonun tüm
değişkenlerine ve parametrelerine erişebilir.
Dıştaki fonksiyonun işletilmesi tamamlandıktan sonra dahi, içteki fonksiyon dıştaki
fonksiyonun üyelerine erişebilir. Örneğin;
function fade(id) {
var dom = document.getElementById(id), level = 1;
function step() {
var h = level.toString(16);
dom.style.backgroundColor = '#FFFF' h h;
if (level < 15) {
level = 1;
setTimeout(step, 100);
}
}
}
setTimeout(step, 100);
Yukarıdaki fade isimli fonksiyon id'si parametre olarak gönderilen nesnenin arkaplan
rengini sarıdan beyaza çevirir. Bu fonksiyon çalıştığında, önce dom ve level isimli iki
değişken tanımlanır, sonra step isimli fonksiyon tanımlanır (çalıştırılmaz, sadece
tanımlanır), daha sonra setTimeout deyimi ile 100 milisaniye sonra step fonksiyonunun
çalıştırılması gerektiği sisteme bildirilir. Sonra da fade isimli fonksiyonun çalışması
sona erer. Ancak, 100 milisaniye sonra sistem step isimli fonksiyonu çalıştırmaya
başlar. Bu fonksiyon çalışmaya başladığında fade fonksiyonunun çalışması çoktan sona
ermiş olmasına rağmen, fade fonksiyonunun level ve dom isimli değişkenler step
fonksiyonunun içinde kullanılır.
Fonksiyonlar değer olarak kullanılabildiği için, nesnelerin fonksiyonları olabilir.
Nesnelerin içindeki fonksiyonlara metot denir.
Fonksiyonlara gerektiğinden fazla parametre gönderilirse (örneğin, 3 parametreli bir
fonksiyona 5 parametre gönderilirse), fazladan gönderilen parametreler görmezden
gelinir. Gerektiğinden az parametre gönderilirse, eksik kalan parametrelere undefined
değeri verilir. Her iki durumda da hata oluşmaz.
Fonksiyonların Çağrılma Biçimleri
Fonksiyonlar 4 farklı biçimde çağrılabilir:
• Fonksiyon biçimi
fonksiyonNesnesi(parametreler)
• Metot biçimi
nesne.metotAdi(parametreler)
nesne[“metotAdi”](parametreler)
• Kurucu (constructor) biçimi
new fonksiyonNesnesi(parametreler)
• Apply biçimi
fonksiyonNesnesi.apply(nesne,[parametreler])
this
Bir fonksiyon, fonksiyon biçiminde çağrıldığında this, global nesnedir (Bundan daha
sona bahsedilecektir).
Bir fonksiyon metot biçiminde çağrıldığında this, fonksiyonun sahibi olan nesnedir.
Bir fonksiyon kurucu biçiminde (new operatörü ile) çağrıldığında, yeni bir nesne
oluşturulur ve bu nesne this'e atanır. Eğer return ile bir değer döndürülmüyorsa,
undefined yerine this döndürülür.
Özetle, this, fonksiyona gönderilen gizli bir parametredir. Bu parametrenin değeri ise
fonksiyonun çağrılış şekline göre değişir:
Arguments
Bir fonksiyon çağrıldığında, fonksiyonun parametreleri haricinde, arguments isminde
başka bir gizli parametre daha vardır. Bu parametre, çağrılırken gönderilen tüm
parametreleri içeren, dizi benzeri bir nesnedir.
function topla() {
var i, n = arguments.length, toplam = 0;
for (i = 0; i < n; i = 1) {
toplam = arguments[i];
}
return toplam;
}
Prototiplere Ekleme Yapma
•
•
•
•
•
•
Object.prototype
Array.prototype
Function.prototype
Number.prototype
String.prototype
Boolean.prototype
Javascript'te string'lerin başındaki ve sonundaki beyaz boşlukları silmek için herhangi
bir fonksiyon yoktur. Ancak bunu biz yazabiliriz.
String.prototype.trim = function() {
return this.replace(/^\s*(\S*(\s \S )*)\s*$/, “$1”);
}
Böylece artık tüm string'ler trim isimli bir fonksiyona sahip olur.
var ad = ' Sinan ', soyad = ' İlyas ';
var yeniAd = isim.trim();
var yeniSoyad = soyad.trim();
Typeof
Değerlerin tiplerini öğrenmek için başına typeof operatörü koyulabilir.
if (typeof deger === 'string') { ... }
New
new Boolean(), new String(), new Number() deyimlerinin kullanılması tavsiye edilmez.
Çünkü örneğin, new Boolean() denildiğinde, boolean değer içeren yeni bir nesne
oluşturulmuş olur. “Boolean değer” ile “boolean değer içeren nesne” birbirinden farklı
şeylerdir. Bunun nasıl bir hataya yol açabileceği aşağıdaki örnekten görülebilir:
var nesne = new Boolean(false);
document.write(nesne);
if (nesne) {
document.write('true');
}
else {
document.write ('false');
}
Bu örnekte önce false, sonra true yazar. Çünkü document.write(nesne) denildiğinde
nesnenin içindeki değer (false) yazdırılır. Ama if (nesne) denildiğinde, nesnenin
içerdiği değer ne olursa olsun, tüm nesneler true kabul edildiği için, true yazdırılır.
Global Nesne
Global nesne, tüm global değişkenlerin ve javascript'in kendi nesnelerinin sahibidir.
Web tarayıcılarında global nesne window'dur.
Global değişkenlerin kullanılması tavsiye edilmez. Çünkü bir uygulamanın içindeki
fonksiyonlar birbiriyle çakışabilir, ya da birlikte çalışan uygulamalar birbiriyle
çakışabilir. Global namespace'in kullanımı en aza indirilmelidir.
Düzgün bir şekilde tanımlanmamış tüm değişkenler global kabul edilir. Bu durum,
encapsulation hakkında bilgi sahibi olmayan veya önemsemeyen kişiler için işleri
kolaylaştırabilir, ama uygulamaları daha az güvenilir hale getirir.
Global değişkenleri ve uygulamaların diğer zayıf yönlerini bulma konusunda
http://www.JSLint.com adresindeki JSLint programı kullanılabilir.
Namespace
Her nesne ayrı bir namespace'tir. Değişken ve fonksiyonlarınızı düzenlemek için bir
namespace olarak nesne kullanınız. Böylece kendi yazdığınız kodların, kullandığınız
hazır script'lerle vs. çakışması ihtimalini ortadan kaldırmış olursunuz. Namespace
olarak kullanacağınız nesnenin adını büyük harflerle yazmanız tavsiye edilir, çünkü bu
kazara diğer nesnelerle karıştırılarak kullanma ihtimalinizi azaltır.
var YAHOO = {}; // Namespace
YAHOO.Popup = function () {
// Popup ile ilgili global değişkenler ve fonksiyonlar
...
};
Fonksiyonlar değişkenler için kapsam belirlediği için, YAHOO.Popup fonksiyonunun
içinde tanımlanan hiçbir değişken ve fonksiyon, bu fonksiyonun dışında geçerli değildir.
Kod Yazım Standartları
Javascript çok esnek bir dil olduğundan dolayı, kodlama stili konusunda disiplinli olmak
gerekir. Douglas Crockford’un tavsiye ettiği Javascript kod yazım standartlarına şu
adresten ulaşabilirsiniz:
http://javascript.crockford.com/code.html (İngilizce)
Noktalı Virgül
Derleyici bir hata gördüğünde hemen hata vermez. Önce en yakındaki satır sonuna
gider, oraya bir noktalı virgül yerleştirir ve tekrar dener. Eğer yine hata varsa, o
zaman hata verir. Ancak yine de gerekli olan her yere noktalı virgülleri koymak
gerekir.
JSLint
JSLint Javascript ile yazılmış bir programdır. Yazdığınız Javascript kodlarını inceler
ve yazdığınız kodların sağlamlığını ve taşınabilirliğini arttırmanız için size tavsiyelerde
bulunur, yaptığınız hataları bulmanıza yardımcı olur. JSLint’e aşağıdaki adresten
ulaşabilirsiniz: