Lütfen
giriş yapın
veya
üye olun
.
Haberler:
Sitemiz Tekrar Açılmıştır. Çalışmalar Devam Edecektir Saygılarımızla
Ana Sayfa
Forum
Yardım
TinyPortal
Ara
Takvim
Giriş Yap
Kayıt Ol
www.Aradigim.net
»
BiLiM&TEkNoLoJİ
»
Webmaster Bilgiler
»
Javascript Nedir? Javascript Kodları
« önceki
sonraki »
Yazdır
Sayfa:
1
[
2
]
Aşağı git
Gönderen
Konu: Javascript Nedir? Javascript Kodları (Okunma sayısı 677 defa)
HaşR
!
S|YöNetiCi
SüPeR üye
Üye Puanl +6/-1
Ynt: Javascript Nedir? Javascript Kodları
«
Yanıtla #15 :
14 Aralık 2011, 00:57:03 »
Örnek: O an ki zamanı "saat:dakika:saniye" cinsinden veren bir JavaScript yazalım.
<html>
**********
function saat()
{
var zaman,saat,dakika,saniye
zaman = new Date()
saat = zaman.getHours()
dakika = zaman.getMinutes()
saniye = zaman.getSeconds()
********.form1.T1.value = saat+":"+dakika+":"+saniye
setTimeout('saat()',100)
}
</script>
<body onload=saat()>
<center>
<p>Date() Nesnesi Örneği</p>
<form name="form1">
<input name="T1">
</form>
</body>
</html>
Not: Yukarıda da belirttiğimiz gibi Date() nesnesi, kullanıcının zaman ve tarih ayarlarına göre çalışır. Yani kullanıcının bilgisayarında saat ve tarih ne ise, sayfada o değerleri görür. Okunan değerin server saati ile alakası yoktur. Bu durum bir iyi bir de kötü sonuç doğurur.
- Kullanıcının gördüğü değerler kendi ayarları olduğu için, kullanıcı hangi ülkede olursa olsun kendi saat ve tarih ayarlarını görecektir.
- Kullanıcının bilgisayarındaki tarih ve saat değerleri yanlışsa, sayfada da yanlış değerler görülür
SetTimeout() Komutu :
SetTimeout() komutu JavaScripte zamanlama işlemleri için kullanılır. Örneğin belli zaman periyotlarında belli komut kümelerini çalıştırmak yada işlem akışında zamansal gecikme sağlamak için kullanılır.
Komut belirilen komutların, milisaniye cinsinden verilenen zaman sonunda çalıştırılması mantığı ile çalışır. Genllikle kullanılacak komutlar bir function içine yerleştirilir ve setTimeout() komutu ile bu function çağrılır. Kullanım formatı aşağıdaki gibidir.
setTimeout('komutlar',zaman)
Örnek: 0,5 saniyelik peryotlarla sonsuza doğru 1'er 1'er sayan scripti yazalım.
<html>
**********
var x = 0
function say()
{
********.form1.T1.value=x
x=x+1
setTimeout('say()',500)
}
</script>
<body onload=say()>
<center>
<p>setTimeout() Komutu Örneği</p>
<form name="form1">
<input name="T1">
</form>
</body>
</html>
clearTimeout() Komutu : clearTimeout() komutu, setTimeout() komutu ile başlatılan zamanlamayı sıfırlamak ve zaman periyodu ile çalışan komutları iptal etmek için kullanılır.
Bu komutlar bir arada kullanılırken genellikle setTimeout() komutu bir değişkene atanır ve clearTimeout() komutu ile bu değişken ile birlikte kullanılır. setTimeout() komutunun atandığı değişken var komutu ile tanımlanmadan da çalışır.
Örnek: Yukarıdaki örnekte yaptığımız scripte buton kontrolü ile çalıştırılıp, durdurulabilme özelliği ekleyelim.
<html>
**********
var x = 0
function say()
{
********.form1.T1.value=x
x=x+1
sayac=setTimeout('say()',500)
}
function dur()
{
clearTimeout(sayac)
}
</script>
<body>
<center>
<p>clearTimeout() Komutu Örneği</p>
<input type="button" value="Başlat" onclick=say()>
<input type="button" value="Durudur" onclick=dur()>
<form name="form1">
<input name="T1">
</form>
</body>
</html>
String Nesnesi:
String nesnesi, JavaScripte metinler üzerinde işlem yapmak için kullanılır. Yazı formatındaki yada değişkene atanmış bir metinin font, punto ve link gibi bir çok özelliği string nesnesinden faydalanılarak değiştirilebilinir.
Aşağıdaki tabloda String nesnesinin bazı özellikleri verilmiştir
Metot Açıklama
fontsize([span style='color:blue']x)[/span] String nesnesinin font büyüklüğünü ayarlamak için kullanılır.
bold() String nesnesine bold özelliği vermek için kullanılır.
italics() String nesnesine italic özelliği vermek için kullanılır.
sub() String nesnesini ' örnek ' şekline çevirmek için kullanılır.
sup() String nesnesini ' örnek ' şekline çevirmek için kullanılır.
anchor([span style='color:blue']link)[/span] String nesnesine link vermek için kullanılır.
charAt([span style='color:blue']x)[/span] String nesnesinin x 'inci karakterini verir
substring([span style='color:blue']x,y)[/span] String nesnesinin x 'inci karakterinden y 'inci karakterine kadar olan kısmını verir.
toLowerCase() String nesnesini küçük harfe çevirir.
toUpperCase() String nesnesini büyük harfe çevirir.
split([span style='color:blue']x)[/span] String nesnesini x 'inci karakteri ayraç olarak kabul edip parçalara ayırır.
indexOf([span style='color:blue']x,y)[/span] y' inci karakterden başlayarak string içinde x metnini arar.
Örnek: Küçük harflerle girilen metni büyük harflere çeviren bir script yazalım.
<html>
**********
function cevir()
{
var a
a=********.form1.T1.value
********.form1.T2.value=a.toUpperCase()
}
</script>
<body>
<center>
<p>String Nesnesi Örneği</p>
<p>Lütfen küçük harflerle bir metin giriniz.</p>
<form name="form1">
<input name="T1">
<input type="button" value="Tıklayın!" onclick=cevir()>
<input name="T2">
</form>
</body>
</html
Kayıtlı
Ey Rahmeti Bol Pahişah Cürmüm iLe GeLdim Sana
www.Aradigim.net
Ynt: Javascript Nedir? Javascript Kodları
«
Yanıtla #15 :
14 Aralık 2011, 00:57:03 »
HaşR
!
S|YöNetiCi
SüPeR üye
Üye Puanl +6/-1
Ynt: Javascript Nedir? Javascript Kodları
«
Yanıtla #16 :
14 Aralık 2011, 00:57:38 »
Örnek: Sağ ve sol isminde iki frameden oluşan ve sol frameden sağ framenin ardalan rengini değiştire bilen basit bir script hazırlayalım.
- Framelerin tanımlanacağı ana Html, Bu sayfa hazırlandıktan sonra herhangi bir isimle kaydedin. Biz bu sayfaya "index.htm" ismini vereceğiz
<html>
<head>
<frameset cols="25%,*">
<frame src="sol.htm" name="sol">
<frame src="sag.htm" name="sag">
</frameset>
</head>
<body>
</body>
</htm>
-"sağ.htm" ana sayfamızın sol kısmını oluşturan html sayfası. Bizim örneğimizde üzerinde değişiklik yapacağımız sayfa.
<html>
<body bgcolor="blue">
<center>
</body>
</html>
- "sol.htm" örneğimizde bizi asıl olarak ilgilendiren sayfa bu. JavaScriptimizi bu sayfaya yazacağız.
<html>
**********
function ayar(a)
{
parent.sag.********.bgColor=a
}
</script>
<body>
Renk
<form name="form1">
<select onchange="ayar(value)">
<option value="blue">Mavi</option>
<option value="yellow">Sarı</option>
<option value="red">Kırmızı</option>
<option value="green">Yeşil</option>
<option value="white">Beyaz</option></select>
</form>
</body>
</htm>
Not: Scripin çalışması için yukarıdaki üç html dosyasını belirtilen isimlerle kaydedip, aynı klasör altına koyunuz.
JavaScript Komutlarını Kullanma Formatları
İlk dersimizde de bahsettiğimiz gibi JavaScript üç farklı formatta kullanılabilir. Bu kullanım formatlarını görmek için basit bir örnek ele alalım ve üç değişik formatla yazalım.
Format 1: JavaScriptimizi script tagları açmaya gerek duymadan direk "Html" komutlarının arasında kullanabiliriz. Bu format çok basit bir yapıya sahiptir fakat büyük scriptlerde karışıklığa neden olabilir.
Örnek:
<html>
<body>
<center>
<p>JavaScript Format 1 Örneği </p>
<input type="button" value="Tıklayın!.." onclick="alert('JavaScrip formatı 1')">
</body>
</htm>
Format 2: JavaScript yazımında en çok başvurulan yöntem function kullanımıdır. Bu format karışık scriptlerde çok büyük kolaylıklar sağlamsının yanında bazı scriptlerede kullanmak zorunlu hale gelmektedir.
Örnek:
<html>
**********
function mesaj()
{
alert("JavaScrip formatı 2")
}
</script>
<body>
<center>
<p>JavaScript Format 2 Örneği </p>
<input type="button" value="Tıklayın!.." onclick="mesaj()">
</body>
</htm>
Format 3: Bu format daha çok yazılan Html kodunun sade görünmesi için kullanılır. Bu formatta script komutları farklı bir dosyaya kaydedilir ve Html içerisinde script tanımlandıktan sonra bu dosya çağrılarak içerdiği komutlar kullanılır. Komutların kaydedildiği bu dosyalara genellikle "js" uzantısı verilir.
<script src="deneme.js"> 'satırı ile komutların bulunduğu js dosyası çağrılır.
Örnek:
- Bu Html dosyası ile aşağıda içeriğini verdiğimiz, "mesaj.js" dosyasını çağıracağız.
<html>
<center>
<script src="mesaj.js">
</script>
<body>
<p>JavaScript Format 3 Örneği </p>
<input type="button" value="Tıklayın!.." onclick="mesaj()">
</body>
</htm>
- "mesaj.js" Aşağıdaki komutları "mesaj.js" ismi ile kaydedip yukarıdaki Html dosyası ile aynı klasör altına atın.
function mesaj()
{
alert("JavaScrip formatı 3")
}
Kayıtlı
Ey Rahmeti Bol Pahişah Cürmüm iLe GeLdim Sana
www.Aradigim.net
Ynt: Javascript Nedir? Javascript Kodları
«
Yanıtla #16 :
14 Aralık 2011, 00:57:38 »
HaşR
!
S|YöNetiCi
SüPeR üye
Üye Puanl +6/-1
Ynt: Javascript Nedir? Javascript Kodları FARKLI ANLATIM JAVA SCRİPT
«
Yanıtla #17 :
14 Aralık 2011, 01:00:31 »
FARKLI ANLATIM JAVA SCRİPT
JavaScript ile VBScript arasında işlev ve yapı bakımından fark yoktur. Kod yazmak için ikisini birden öğrenmeniz şart değil elbette. Ama başkalarının kodlarını araştırmak ve bir şeyler öğrenmeye çalışmak gibi harika bir hobiniz varsa, neden ikisini birden öğrenmeyesiniz? Bazı sayfalarda “Şöyleyse VBScript, böyleyse JavaScript öğrenmenizi tavsiye ederim” gibilerinden laflar ediliyor. Ben böyle bir tavsiyede bulunamam açıkçası. Ama şunu bilin, VBScript biraz daha kolay öğreniliyor gibi. Bununla birlikte JavaScript’in çok daha yaygın olduğu da bir gerçek. Visual Basic bilenler VBScript’i daha kolay, C veya Java bilenler, JavaScript’i daha kolay öğrenecektir. Son söyleyeceğim şey, ikisi de basit, dilerseniz her ikisini birden rahatlıkla öğrenebilirsiniz.
JavaScript (VBScript) HTML’in bir parçasıdır aslında; derleyici bir programa ihtiyaç duymaz, HTML kodlarıyla beraber yazılır ve gözatıcı (browser) tarafından yorumlanır.
JavaScript’in (VBScript’in) işlevleri yazmakla bitmez ya, ben aklıma geldiğince listeledim:
HTML tasarımcılarına bir programlama desteği sağlar, bünyesinde değişkenler, fonksiyonlar, döngüler, yordamlar bulundurur.
HTML sayfalarına hareketli HTML nesneleri (metin, resim, vb.) koyabilmemizi sağlar.
Olaylara tepki verir. (Olaydan kastettiğim şey: tıklamak, tuşa basmak, sayfa açmak gibi şeyler.)
HTML elemanlarını okuyabilir veya yazabilir.
Kullanıcı ile bilgi alışverişinde bulunmamızı sağlar. Zira HTML formları JavaScript (VB Script) olmadan pek bir işe yaramaz. (Ayrıca ASP derslerinde de kullanacağız.)
HTML’e JavaScript Kodlarını Tanıtma
JavaScript HTML kodları arasında nasıl kullanılır? JavaScript kodlarını HTML’e tanıtmak için Java Script kodlarını <script language=”JavaScript”>…</script> HTML kodları arasına yazarız. Not: VBScript için language=“VBScript” parametresi kullanılır.
Aşağıdaki uygulama ilk JavaScript örneğimiz:
<html>
<head>
<title>JavaScript Uygulaması</title>
</head>
<body>
<script language=”JavaScript”>
document.write(“Merhaba”)
</script>
</body>
</html>
Burada <script language=”JavaScript”>…</script> arasında yazılı olan bir tane JavaScript kodu bulunmakta: document.write(“…”). Bu kod, parantez içine yazılan HTML kodlarını uygular. Tabi bu uygulama için JavaScript koduna ihtiyacımız yok aslında, doğrudan Merhaba deseydik, yine Web Sayfamız saygıda kusur etmez, bize Merhaba derdi. Ama ileriki konularda bu koda ihtiyacımız olacak. Bu uygulamada HTML kodu olarak düz bir metin kullandık. Parantez içindeki HTML kodunu biraz daha zenginleştirebiliriz:
<html>
<head>
<title>JavaScript Uygulaması 2</title>
</head>
<body>
<script language=”JavaScript”>
document.write(“<font size=6 color=blue>”)
document.write(“Merhaba”)
document.write(“</font>”)
</script>
</body>
</html>
JavaScript’in en sevmediğim özelliğini anlatmadan geçemem. JavaScript’te (VBScript’te herşeyi illâ ki harfi harfine yapacaksın. Küçücük bir hata, sayfanızın çıkmamasına ve pencerenin alt kısmında JavaScript hatası belirmesine neden olur. Bu zamana kadar HTML gibi esnek bir dille çalışıyorduk; bu nedenle bu sayfalarla ilgili örnekler yaparken biraz yorulabilirsiniz.
JavaScript kodlarının HTML’deki Konumu
JavaScript yukarıdaki uygulamalarda olduğu gibi <body>…</body> kodları arasında yer alabileceği gibi; fonksiyon halinde, <head>…</head> arasında da yer alabilir:
<html>
<head>
<title>JavaScript Uygulaması</title>
<script language=”JavaScript”>
function selam()
{
alert(“Merhaba”)
}
</script>
</head>
<body onload=”selam()”>
</body>
</html>
Bu örnek hiçbir programlama dili bilmeyen birisi için anlaşılması biraz zor. Kabaca anlatayım; anlamayanlar için ileriki sayfalarda genişçe anlatacağım: Bu uygulamada JavaScript kodu <head> bölümünde fonksiyon halinde yer alıyor. function selam() ifadesi ile selam() isimli bir fonksiyon tanımlıyoruz. Bu fonksiyonun ne yaptığını süslü parantezler arasına yazarız. Örneğin selam() fonksiyonunun içeriğinde alert(“…”) kodu vardır. Bu JavaScript kodu, tırnak içindeki ifadeyi mesaj kutusuyla göstermeye yarar. Demek ki selam fonksiyonu, mesaj kutusuyla “Merhaba” demeye yarıyormuş. Dikkat ederseniz <body> koduna onload=”…” (İngilizce’de “yüklendiği takdirde” demek) durumu atanmış. Yani sayfa yüklenildiğinde selam() mesajı veriliyor.
JavaScript kodu; CSS’de olduğu gibi, dış bir dosyayla da HTML’e tanıtılabilinir. CSS dosyası .css uzantılıydı. Dış JavaScript dosyası ise .js uzantılıdır. Aşağıdaki metin dosyasını selam.js ismiyle kaydettim:
document.write(“<center>”)
document.write(“<h1>Merhabalar!</h1>”)
document.write(“</center>”)
Şimdi bu dış JavaScript dosyasını HTML sayfasına tanıtıyorum:
<html>
<head>
<title>JavaScript Uygulaması</title>
</head>
<body>
<script src=”selam.js”>
</script>
</body>
</html>
Kayıtlı
Ey Rahmeti Bol Pahişah Cürmüm iLe GeLdim Sana
HaşR
!
S|YöNetiCi
SüPeR üye
Üye Puanl +6/-1
JAVA SCRIPT Değişkenler
«
Yanıtla #18 :
14 Aralık 2011, 01:01:17 »
Değişken, içinde değerler saklayabileceğiniz bir programlama aracıdır. Değişkenlerin sakladığı değer kod sayfaları boyunca değişebilir, birbirine aktarılabilir. Değişkene başka bir değer atayabilirsiniz veya değişkenin sakladığı değeri program içinde kullanabilirsiniz. Değişkenler genellikle programın başlangıcında isimlendirir; böylece bu isimlerle değişkeni çağırabilir, değişkenin taşıdığı değeri kullanabilirsiniz. Not: Değişkenin ismi program boyunca değişmez, ancak taşıdığı değer değişebilir.
Değişken İsimleri
Değişkenleri isimlendirirken dikkat etmemiz gereken bazı kurallar vardır:
Değişken ismi harf, rakam veya “_” (altçizgi) karakterlerinden oluşabilir.
Değişken isminin ilk karakteri bir harf veya “_” (alt çizgi) işareti olmalıdır. (vol_html23 gibi)
JavaScript küçük harf, büyük harf ayrımı yapar. Mesela değişken isminiz DIAZ ise, bu değişkeni hep böyle büyük harflerle yazmak zorundasınız. diaz yazarsanız, gözatıcı bunu farklı bir değişken olarak okur.
Değişken isimlerinin uzunluğu 255 karakter kadar olabilir.
Değişken isimleri içinde diğer semboller ( , -, /, boşluk, vb.) yer alamaz.
Değişken isimlerinde İngilizce’de olmayan karakterleri (ş, ç, ö, vb.) kullanmayınız. (Genellikle yeni kullanıcılar bu kuralı her zaman anımsamıyorlar.
Değişkenlere Değer Verme
Değişkenlere değer verirken, değişken her zaman sol tarafta yer alır. Mesela sayi değişkenine 15 değerini vereceksek, şöyle yazarız:
sayi= 15
Değişkenler birbirinin değerini de alabilir. Her zaman sola yazılan ifade, sağdaki değeri alır. Örneğin şu iki değişkene bakalım:
sayı1= 5
sayı2= 10
sayı1= sayı2
Burada sayi1 ve sayi2 isimli iki değişken söz konusu. Önce sayi1 isimli değişkene 5 değeri veriliyor. Sonra sayi2 değişkenine 10 değeri veriliyor. Sonra sayi1 değişkenine sayi2‘nin değeri verilerek, sayi1‘in değeri değiştiriliyor. Böylece sayi1= 10, sayi2= 10 oluyor. Eğer sayi2 = sayi1 ifadesi olsaydı (sayi2 solda yeralsaydı), sayi1‘in değeri sayi2‘ye verilmiş olacaktı. Bu durumda sonuç değişik olurdu: sayi1= 5, sayi2= 5
Yukarıdaki yazdıklarımızı bir uygulamayla gösterelim:
<html>
<head>
<title>JavaScript Uygulaması</title>
</head>
<body>
<script language=”JavaScript”>
sayi1=5
sayi2=10
sayi1= sayi2
document.write(sayi1)
document.write(“
”)
document.write(sayi2)
</script>
</body>
</html>
Dikkat ederseniz document.write(…) kodunun parantez arasına değişkenleri yazarken, tırnak işareti kullanmadık. Çünkü değişkenler HTML elemanı değil, JavaScript elemanı. Bu üç kod yerine şöyle yazabilirdik: document.write(sayi1 “
” sayi2). İsterseniz değişkenlerin yerini değiştirelim (sayi2 = sayi1 yapalım):
<html>
<head>
<title>JavaScript Uygulaması</title>
</head>
<body>
<script language=”JavaScript”>
sayi1=5
sayi2=10
sayi2= sayi1
document.write(sayi1 “
” sayi2)
</script>
</body>
</html>
Değişken Tanımlama ve Değişken Türleri
Yukarıdaki uygulamalarımızda değişkenlere değer verdik ama onları tanımlamadık, tanımlamak zorunda da değiliz. Ancak bu değişkenleri var kodu ile baştan tanımlamak doğru bir yaklaşımdır. (Başka program bilenlere not: Eğer baştan tanımlamazsak, değişkenler global olur. Başka program bilmeyenlere not: Önceden tanımlamakta büyük kerametler var.) Aşağıdaki üç durum da aynı şeyi ifade ediyor:
var sayi1
var sayi2
sayi1=5
sayi2=10
veya,
var sayi1, sayi2
sayi1=5
sayi2=10
veya,
var sayi1=10, sayı2=5
Bu şekillerde değişkenleri tanımlayabiliyoruz. Şimdiye kadar değişkenlere hep sayısal değerler verdik. Oysa JavaScript değişkenleri 5 çeşit değer alabiliyor:
Sayısal Değerler Aritmetik işlemler yapılabilen her türlü sayısal değer: tam sayı, ondalık sayı, negatif sayı.
sayi = 32
Alfanümerik Değerler Aritmetik işlemler yapılmayan, metinsel özellikler taşıyan değerler.
sev = “Cameron Diaz”
Onay Değerleri Sadece doğru veya yanlış değerlerini kabul eden değerler. Doğru ifadesi 1 ile, yanlış ifadesi 0 ile ifade ediliyor. (Ecnebiler boolean diyor.)
cevap = 1
Fonksiyon Değeri Değişkenler tıpkı sayılar ve metinler gibi fonksiyonları da saklayabilmektedir.
yap = selam()
Nesne Değeri Değişkenler HTML nesnelerini (düğme, metin, resim, vb.) değer olarak saklayabilmektedir. (Özellikle gelişmiş JavaScript örneklerimizde çok kullanacağız.) Unutmayalım ki JavaScript nesneye dayalı programdır.
eleman = dugme
Değişkenler gerek yapısal gerek nesneye dayalı programlarda büyük önem taşır. Daha önce hiç programcılıkla uğraşmamışlar kişileri düşünerek anlattım
Kayıtlı
Ey Rahmeti Bol Pahişah Cürmüm iLe GeLdim Sana
HaşR
!
S|YöNetiCi
SüPeR üye
Üye Puanl +6/-1
Ynt: Javascript Nedir? Javascript Kodları
«
Yanıtla #19 :
14 Aralık 2011, 01:02:01 »
JAVA SCRIPT Aritmetik İşlemler
VB Script ile Java Script’in işlem işaretleri biraz farklı. Bu farklar Visual Basic ile Java (veya C) arasında da aynı şekildedir. Daha önce programcılık yapmamış arkadaşlar için kısaca işlem önceliğini de anlatmak zorundayım. Özetle bu sayfada aritmetik işlemler ve öncelik sıraları yeralacak.
Aritmetik İşlem İşaretleri ve Öncelik Sıralaması
JavaScript’te yer alan aritmetik işaretlerin bir kısmını zaten biliyorsunuz. Ama ben kısaca sıralayım:
Toplama işlemini yapar.
sayi = 10 5 (Not: sayi=15 olur)
- Çıkartma işlemini yapar.
sayi= 10 – 5 (Not: sayi=5 olur)
* Çarpma işlemini yapar.
sayi = 10 * 3 (Not: sayi=30 olur)
/ Bölme işlemi yapar.
sayi= 10 / 3 (Not: sayi=3.3333333333333335 olur)
% Tamsayılı bölme işlemi yapar ve kalanı verir.
sayi=10 % 3 (Not: sayi=1 olur)
Bu işlemlerde çarpma, bölme ve kalanlı bölme işlemlerinin toplama ve çıkarma işlemine göre önceliği vardır. Bir işlemde eğer hiç parantez yoksa, soldan sağa doğru sırasıyla çarpma ve bölme işlemleri yapılır. Bu prensip her bilgisayar dilinde ve hesap makinelerinde de geçerlidir. Aşağıdaki örneklere bakalım.
sayi = 5 * 6 – 10 / 5
Bu işlemde çarpma önceliği – işaretine göre daha fazla olan * ve / işlemleri yapılır. (* ve / işlemlerinin önceliği aynıdır.) Bu durumda sayi = 30 – 2 = 28 olur.
sayi = 5 * 6 / 10 * 2 4 * 3
Bu işlemde önceliği aynı olan çarpma ve bölme işlemleri birarada yer alıyor. Bu durumda işlemler sırayla yapılır. Önce 5 ile 6 çarpılır, çıkan sonuç 10′a bölünür ve çıkan sonuç 2 ile çarpılır. Ve sayi = 6 12 = 18 sonucuna ulaşılır.
sayi = ((5 * 6) / (10 * 2) 4) * 3
Bu işlemde parantezler söz konusu. Ve her zaman parantezlerin önceliği vardır. İlk önce iki iç parantez içindeki işlemleri, sonra büyük parantez içindeki işlemleri yaparız. Böylece sayi = (30 / 20 4) * 3 = (5.5 4) * 3 = 9.5 * 3 = 28.5 sonucunu elde ederiz.
Değişken Değerini Taşıdığı Değere Göre Değiştirme
Bazen değişkenlerin değerini, kendisiyle işlem yaparak değiştirebiliriz. Örneğin:
var sayi = 5
sayi = sayi 1
Bu durumda sayi = 5 1 = 6 olur.
var sayi = 4
sayi = sayi – 1
Bu durumda sayi = 4 – 1 = 3 olur.
var sayi = 6
sayi = sayi * 5
Bu durumda sayi = 6 * 5 = 30 olur.
var sayi = 10
sayi = sayi / 2
Bu durumda sayi = 10 / 2 = 5 olur.
var sayi = 10
sayi = sayi % 4
Bu durumda sayi = 10 % 4 = 2 olur.
Bu işlemleri şu işaretlerle de yapabiliriz: “ =”, “-=”, “*=”, “/=” ve “%=”. Aşağıdaki işlemler birbiriyle aynı sonucu verir.
sayi = 5 eşittir sayi = sayi 5
sayi -= 4 eşittir sayi = sayi – 4
sayi *= 6 eşittir sayi = sayi * 6
sayi /= 2 eşittir sayi = sayi / 5
sayi %= 4 eşittir sayi = sayi % 4
Bu aritmetik işlemler C ve Java’da da aynı şekilde kullanılmaktadır. Bu işaretlerin yanında, özelleşmiş iki işaret daha vardır: , –.
sayi eşittir sayi = sayi 1
sayi– eşittir sayi = sayi – 1
Aritmetik işlemlerle ilgili bir uygulama yapalım. (Çıkan sonuca bakmadan önce tahmin etmeye çalışın.)
<html>
<head>
<title>JavaScript Uygulaması</title>
</head>
<body>
<script language=”JavaScript”>
var en1=5, boy1=10, dortgen1
var en2, boy2, dorgen2
dortgen1= en1 * boy1
boy1
en1
boy2 = boy1
en2 = en1
dortgen2= en2 * boy2
document.write(“Eni 5, boyu 10 cm olan bir dörtgenin alanı = ” dortgen1 ” cm<sup>2</sup> ‘dir.
”)
document.write(“Eni ve boyu 1′er cm artırılırsa dörtgenin alanı = ” dortgen2 ” cm<sup>2</sup> oluyor.”)
</script>
</body>
</html>
İşlem önceliğini daha iyi anlatan bir başka uygulama yapalım. Aşağıdaki değerleri tahmin etmeye çalışın.
<html>
<head>
<title>JavaScript Uygulaması</title>
</head>
<body>
<script language=”JavaScript”>
var gelir=25000, maliyet=12000
var vergiorani=0.15, amortismanorani=0.10
var amortisman, vergi
vergi = (gelir – maliyet) * (1 – amortismanorani) * vergiorani
amortisman = (gelir – maliyet) * amortismanorani
document.write(“Şirketimizin yıllık vergisi = ” vergi ” TL’dir.
”)
document.write(“Şirketimizin yıllık amortismanı = ” amortisman “TL’dir.”)
</script>
</body>
</html>
Kayıtlı
Ey Rahmeti Bol Pahişah Cürmüm iLe GeLdim Sana
HaşR
!
S|YöNetiCi
SüPeR üye
Üye Puanl +6/-1
Ynt: Javascript Nedir? Javascript Kodları
«
Yanıtla #20 :
14 Aralık 2011, 01:03:03 »
Bu sayfamızda JavaScript’in yazım kuralları üzerinde duracağız. JavaScript’te hata yapmanın bedeli çok ağırdır. Nerede hata yaptığınızı bulmak uzun zaman alır. (Bunun için JavaScript editörleri vardır, siteden çekebilirsiniz.)
JavaScript tıpkı HTML gibi bırakılan boşlukları dikkate almaz. Yani sayi=5 ile sayi = 5 arasında fark gözetmez.
JavaScript’te komutlar ; (noktalı virgül) işareti konularak yanyana yazılabilir. Aynı satırda olmasa da her komuttan sonra ; işareti koymak yararlıdır, kodlar arasında ayıraç vazifesi görür. Gerçi ben pek yapmıyorum ama istiyorsanız siz yapın.
JavaScript Nesnelerine İsim Koyma
JavaScript nesnelerine isim koyarken aklımızdan çıkarmamamız gerekenlerin başında, JavaScript’in küçük harf, büyük harf ayrımı yaptığıdır. Mesela AritmetikOrtalama() isimli bir fonksiyonu daha sonra aritmetikortalama() ismiyle çağıramayız. JavaScript bu durumu iki ayrı fonksiyon gibi değerlendirir.
JavaScript nesnelerinin (değişken, fonksiyon vb.) ismi bir sayıyla başlamaz ama sonraki karakterler sayı olabilir; arada boşluk bırakılmaz, boşluk yerine _ işareti kullanılır. Bunları değişkenler konusunda anlatmıştık. JavaScript nesneleri bu kurallara uygun her kelimeyi isim olarak alması da söz konusu değil, JavaScript komutlarını, nesne ismi olarak kullanamayız. Bazı isimlerde daha sonra komut olarak JavaScript’e girer diye ayrılmıştır ve onlarda nesne ismi olarak kullanılamaz. Nesne ismi olarak kullanılamayan bu kodları aşağıda listeledim:
abstract
alert
arguments
Array
blur
boolean
Boolean
break
byte
callee
caller
captureEvents
case
catch
char
class
clearInterval
clearTimeout
close
closed
confirm
const
constructor
continue
Date
debugger
default
defaultStatus
delete
do
document
double
else
enum
escape
eval
export
extends
FALSE
final
finally
find
float
focus
for
frames Function
function
goto
history
home
if
implements
import
in
infinity
innerHeight
innerWidth
instanceof
int
interface
isFinite
isNaN
java
length
location
locationbar
long
Math
menubar
moveBy
moveTo
name
NaN
native
netscape
new
null
Number
Object
open
opener
outerHeight
outerWidth
package
Packages
pageXOffset
pageYOffset
parent
parseFloat
parseInt
personalbar print
private
prompt
protected
prototype
public
RegExp
releaseEvents
resizeBy
resizeTo
return
routeEvent
scroll
scrollbars
scrollBy
ScrollTo
self
setInterval
setTimeout
short
static
status
statusbar
stop
String
super
switch
synchronized
this
throw
throws
toolbar
top
toString
transient
TRUE
try
typeof
unescape
unwatch
valueOf
var
void
watch
while
window
with
JavaScript’te Özel İşaret Gösterimi
JavaScript’te HTML nesnesini ifade ederken bazı özel işaretlerin önlerine \ işareti koymalıyız.
<html>
<head>
<title>JavaScript Uygulaması</title>
</head>
<body>
<script language=”JavaScript”>
document.write (“Ali’nin köpeği “Hav hav!” dedi.”);
</script>
</body>
</html>
Bu uygulama çalışmaz ve JavaScript hatası verir. Bu kodda JavaScript içiçe tırnakları, ayrı ayrı tırnak işareti olarak görür. Doğrusu şöyle yazılır:
<html>
<head>
<title>JavaScript Uygulaması</title>
</head>
<body>
<script language=”JavaScript”>
document.write (“Ali’nin köpeği \”Hav hav!\” dedi.”);
</script>
</body>
</html>
JavaScript’te ‘ (tek tırnak) işareti ile “ (çift tırnak) işareti arasında işlevsel bakımdan bir fark yoktur. Ancak içiçe tırnak kullanılan durumlarda içtekini başka, dıştakini başka tırnak işaretiyle göstermek yararlıdır. Örneğin:
<input type=”button” value=”Bas” onclick=”alert(‘Düğmeye Bastınız!’);”>
Burada “ (çift tırnak) işaretiyle JavaScript ifadesi HTML parametresine tanıtılmış oluyor. ‘ (tek tırnak) ifadesi ile JavaScript kodunun yazdırdığı metin belirtilmiş oluyor. Böylece hangi tırnağın nerede bittiği konusunda herhangi bir karışıklık olmuyor.
Yorum Kodları
JavaScript ile yapacağımız programlar bazen o kadar büyük ve karmaşık olur ki, neler yaptığımızı biz bile unuturuz. Gerek sonradan hatırlamak için, gerekse bizden başka kodları okuyacak olanlara yardımcı olmak için, kodların arasına bazı notlar düşeriz. Bu tür notları doğrudan yazarsanız JavaScript hatasına sebep olur veya programınızın işlevini değiştirirsiniz. Bu notları düşmek için not satırı önüne // işaretini koyarız. Bu işaret bir satırlık not bırakmamızı sağlar ve JavaScript kodlarını etkilemez:
<html>
<head>
<title>JavaScript Uygulaması</title>
</head>
<body>
<script language=”JavaScript”>
//Bu uygulama JavaScript yazım kuralları üzerinedir.
document.write (“Ali’nin köpeği \”Hav hav!\” dedi.”);
</script>
</body>
</html>
Bazen düşeceğimiz not birkaç satırdan oluşabilir. Bu durumda not /*…*/ işaretleri arasına yazılır.
<html>
<head>
<title>JavaScript Uygulaması</title>
</head>
<body>
<script language=”JavaScript”>
/*Bu uygulama JavaScript yazım kuralları üzerinedir.
İtiraf edeyim ki pek iyi bir uygulama olmadı,
Ali’ymiş, yok efendim köpeği hav hav dermiş.
İlkokul uygulamalarına benzedi.*/
document.write (“Ali’nin köpeği \”Hav hav!\” dedi.”);
</script>
</body>
</html>
JavaScript’in gözatıcı (browser) tarafından derlendiğini daha önce söylemiştim. Ancak bazı kişisel gözatıcılar ve eski sürüm gözatıcılar JavaScript’i desteklemiyor ve sayfada hatalar veriyor. Bu tip gözatıcıların JavaScript kodlarını tanıması için elimizden gelen birşey yok. Ama hiç olmazsa sayfada hataya neden olmamak için HTML’in <!– yorum kodu kullanılır. Ayrıca yeni sürümlerin kodu görebilmesi için // yorum kodları da gereklidir. Eski sürüm gözatıcılar veya JavaScript’i desteklemeyen kişisel gözatıcılar JavaScript kodlarını HTML yorumu olarak görür ve sayfada bozulmaya neden olmaz; kullanıcı JavaScript’in faydalarından yararlanamasa da, sayfayı düzgün bir şekilde görür. Aşağıda bunun nasıl yapıldığını görüyorsunuz.
<html>
<head>
<title>JavaScript Uygulaması</title>
</head>
<body>
<script language=”JavaScript”>
<!– Eski sürüm gözatıcılardan JS kodlarını saklayalım.
//Şimdi normal kodları yazabiliriz.
document.write (“Ali’nin köpeği \”Hav hav!\” dedi.”);
//–>
</script>
</body>
</html>
Evet, JavaScript’in yazımı bazı sıkı kurallara bağlı ve çok karmaşık gibi görünüyor. Aslında bu JavaScript’in gelişmiş ve kolaylaşmış hali. Evel-i zamanda kodları satırlara bölmek için neler yapardık, neler. Üstelik artık JavaScript editörler de var.
Kayıtlı
Ey Rahmeti Bol Pahişah Cürmüm iLe GeLdim Sana
HaşR
!
S|YöNetiCi
SüPeR üye
Üye Puanl +6/-1
Ynt: Javascript Nedir? Javascript Kodları
«
Yanıtla #21 :
14 Aralık 2011, 01:03:39 »
En iyi yazılımcı, az kodla çok şey yapabilendir. Acemi yazılımcıların sayfalarca kod yazarak yaptığı programları, usta yazılımcılar yarım sayfada yapabilir. Bunun inceliklerini hem bu sayfada, hem de ileride yapacağımız ileri uygulamalarda göstereceğim.
Diyelim ki programda bir sürü işlem yapacağız ama öyle bir işlem var ki 50 defa yapacağız. (Mesela “Ali gel.” yazdıracağız.) Programa bu işlemi 50 defa yaptırmak için o işlem kodunu 50 defa yazdırmak zorunda kalırız ve programımız sayfalarca sürebilir. Üstelik bu işlem kodlarının birkaç satır değil de yarım sayfa sürmesi söz konusu da olabilir. Bu durumda 50 defa o yarım sayfalık kodu yazmak zorunda mı kalacağız?
Hayır. O yarım sayfalık işlem kodunu bir fonksiyon haline getiririz ve 50 defa o fonksiyonu tek kelime olan fonksiyon ismi ile çağırırız. Bu durumda 30-40 sayfalık bir kodu 3-4 sayfaya indirmiş oluruz.
Peki bir işlem nasıl fonksiyon haline getirilir? İşte sayfamızın konusu bu.
Fonksiyon Yapısı
Fonksiyonlar <head>…</head> bölümünde yer alır. Bir fonksiyonun genel yapısı aşağıdaki gibidir:
function fonksiyonun adı (argüman1, argüman2,….,argümanN)
{
İŞLEMLER
}
Fonksiyonlara koyduğumuz isim, fonksiyonu çağırmak için gereklidir. Her fonksiyonun adı olmalıdır, zira fonksiyonlar bir olay (durum) karşısında çağrılabilsin diye yapılır. Bu olay bir düğmenin tıklanması, bir radyo veya kontrol kutusunun seçilmesi, bir HTML nesnesinin üzerine fare ile gelinmesi olabilir. (HTML’de form nesnelerini unutan arkadaşlarımıza tekrar bakmalarını salık veririm. Bu olaylara ilerdeki Olaylar sayfasında ayrıntılı olarak değineceğim. Ama şimdilik onclick (tıklanıldığı takdirde) olay parametresini kullanacağız. Bu parametre form araçlarına olduğu gibi, hiperlink, resim gibi diğer HTML nesnelerine de atanabilir. onclick = Fonksiyon Adı() şeklinde kullanılır.
Argümansız Fonksiyonlar
Fonksiyonlar çeşitli argümanları kullanarak işlem yapabilirler. Bu argümanlar değişken, nesne veya değer ifadesi olabilir. Bunun yanısıra fonksiyonların argüman kullanma zorunluluğu yoktur; aşağıdaki uygulama argümansız bir fonskiyon içermektedir.
<html>
<head>
<title>Argümansız Fonksiyon</title>
<script language=”JavaScript”>
//Fonksiyonu hazırlıyoruz.
function mesaj()
{
alert(“Hiç bir mesajınız yok.”);
document.write(“Mesaja baktınız…”);
}
</script>
</head>
<body>
<form>
Mesaja bakmak istiyorsanız, düğmeye basın.
<!–Düğmeye basıldığında fonksiyon çağrılır.–>
<input type=”button” onclick=”mesaj()” value=”Mesaj Kontrol”>
</form>
</body>
</html>
Kendinizi programcı gibi hissetmeye başladınız mı? Daha neler yapacağız, neler. Bu uygulamamızda mesaj() isimli argümansız bir fonksiyon kullandık. Bu fonksiyonu kullanmamız şart değildi elbette. Fonksiyon yaratmak yerine, kodları <body> bölümüne yazabilirdik. Ancak bu fonksiyonu buradaki gibi bir defa değil de beş-on yerde kullansaydık, fonksiyon sayesinde bir sürü kod yazmaktan kurtulacaktık. (Bunu bir defa daha açıklamaya kalkarsam, okuyucuların zekasını küçümsemiş olacağım.)
Argümanlı Fonksiyonlar
Şimdi de argümanlı bir fonksiyon yapalım. Aşağıdaki uygulamada iki argümanlı bir fonksiyon göreceksiniz:
<html>
<head>
<title>Argümanlı Fonksiyon</title>
<script language=”JavaScript”>
//Fonksiyonu hazırlıyoruz.
function puan(a, b)
{
alert(“Verdiğiniz notu göndermek için basın.”);
document.write(a ” isimli aktriste ” b ” notunu verdiniz.”);
}
</script>
</head>
<body>
<form>
<input type=”button” value=”Notu Gönderin” onclick= “puan(‘Cameron Diaz’, ’100′)”>
</form>
</body>
</html>
Bu uygulamada fonksiyonumuzun iki tane argümanı var. Bunlar: ‘Cameron Diaz’ ve ’100′. Yanlarındaki ‘ işaretleri bu argümanların bir metin ifadesi olduğunu anlatıyor.
Değer Atamalı Fonksiyonlar
Bir başka tür fonksiyon yapısı daha vardır. Buna değer atamlı fonksiyon diyoruz. Bu fonksiyon türü argümanlı veya argümansız olabilir. Ayırtedici özelliği yaptığı işlemleri bir değere dönüştürüp, bu değeri değişkenlere veya HTML nesnelerine aktarması. Bu fonksiyonun yapısı şöyledir:
function fonksiyonun adı (argüman1, argüman2,….,argümanN)
{
İŞLEMLER
return değer
}
Buradaki return kodu, işlemlerle bulunan bir değeri fonksiyona atamakta kullanılır. Aşağıdaki uygulamayla daha iyi anlayacaksınız.
<html>
<head>
<title>Değer Atamalı Fonksiyon</title>
<script language=”JavaScript”>
//Fonksiyonu hazırlıyoruz.
function ustubes(x)
{
x = x * x * x * x * x;
return x
}
</script>
</head>
<body>
<script language=”JavaScript”>
var a1, a2, a3, a4, a5, a6, a7, a8, a9;
//Dokuz değişkeni ustubes() fonksiyonunu kullanarak değer atanıyor.
a1 = ustubes(1);
a2 = ustubes(2);
a3 = ustubes(3);
a4 = ustubes(4);
a5 = ustubes(5);
a6 = ustubes(6);
a7 = ustubes(7);
a8 = ustubes(8);
a9 = ustubes(9);
document.write
(“1,2,3,4,5,6,7,8 ve 9 sayılarının üstü beş hali sırasıyla aşağıda yazılmıştır.
”);
document.write
(a1 ”, ” a2 ”, ” a3 ”, ” a4 ”, ” a5 ”, ” a6 ”, ” a7 ”, ” a8 ”, ” a9);
</script>
</body>
</html>
Bu sayfadaki uygulamalarda; öğretme amacıyla tasarlandığı için, fonksiyonlar çok az işlemden oluşuyor. Fonksiyonların önemini JavaScript derslerinin sonlarına doğru geliştireceğimiz ileri projelerde çok daha iyi göreceksiniz.
Kayıtlı
Ey Rahmeti Bol Pahişah Cürmüm iLe GeLdim Sana
HaşR
!
S|YöNetiCi
SüPeR üye
Üye Puanl +6/-1
Ynt: Javascript Nedir? Javascript Kodları
«
Yanıtla #22 :
14 Aralık 2011, 01:04:33 »
Her programda olduğu gibi, JavaScript’te de koşul deyimleri vardır. Bu deyimler Java ve C’de aynen kullanılmakta olan if…else deyimi ve switch deyimi. Bu deyimleri bilmeyen arkadaşlarımız için bu sayfayı hazırladım.
“if… else…” Koşul Deyimi
İlk koşul deyimimiz: if…else… (Türkçesi: eğer öyleyse…değilse…). Yazılımda veriler değerlendirilirken bir yol ayrımına, elemeye gidilebilir. Mesela belli bir değerin altındakiler için başka işlemler, üstündekiler için başka işlemler yapılabilir. Verileri böyle bir elemeye tabi tutmak için if…else… koşul deyimini kullanabiliriz. Bu deyimin genel yapısı şöyledir:
if (koşul ifadesi) işlem
else işlem
birden fazla işlem söz konusuysa,
if (koşul ifadesi)
{
İŞLEMLER
}
else
{
İŞLEMLER
}
Koşul İfadeleri
Koşul ifadesi parantez içine yazılır. Koşul ifadesi verilerin izleyeceği akışı belirler. Bu koşula uyan verilere koşul ifadesinden sonraki işlemler, bu koşula uymayan verilere ise else ifadesinden sonraki işlemler uygulanır. Koşul ifadelerini belirtirken aşağıdaki işaretlerden yararlanırız:
== Eşitlik koşulunu sorgular.
degisken == 5
!= Eşit olmama koşulunu sorgular.
degisken != 5
> Büyük olma koşulunu sorgular.
degisken > 5
>= Büyük veya eşit olma koşulunu sorgular.
degisken >= 5
< Küçük olma koşulunu sorgular.
degisken < 5
<= Küçük veya eşit olma koşulunu sorgular.
degisken <= 5
Koşul deyimleri, koşul ifadesine uyanlara işlem yapar. Uymayanlara ise else kodundan sonraki işlem yapılır. else kodu kullanma zorunluluğu yoktur, kullanılmıyorsa koşul ifadesine uymayanlar, koşul deyimine nasıl girmişlerse öyle çıkarlar.
<html>
<head>
<title>Koşul Deyimleri</title>
<script language=”JavaScript”>
//İlk fonksiyonu hazırlıyoruz.
function kabul()
{
alert(“İçeri girebilirsin.”);
document.write(“<h1>Barımıza Hoşgeldiniz!</h1>”);
}
//İkinci fonksiyonu hazırlıyoruz.
function red()
{
alert(“Hoop ufaklık. Bas geri!”);
document.write(“<h1>18 yaşından küçükler giremez!</h1>”);
}
</script>
</head>
<body>
<script language=”JavaScript”>
var yas=13;
if (yas >= 18) kabul()
else red()
</script>
</body>
</html>
Bu uygulamada iki fonksiyon var: kabul() ve red(). <body> bölümündeki JavaScript kodları arasında yas değişkenini ve if…else… koşul deyimini göreceksiniz. Koşul deyimi yas değişkeni 18′e eşit veya 18′den büyükse kabul() fonksiyonunu, değilse red fonksiyonunu çağırıyor. Burada yas değişkenini kod içinde 13 olarak tanımladık, bu durumda red() fonksiyonu çağrılır ve barın kapısından geri çevrilirsiniz.
“switch” Koşul Deyimi
if…else… koşul deyiminde yol ayrımı söz konusudur ve akış ikiye ayrılır. Şimdi göreceğimiz switch kodu ise akışı ikiden fazla sayıya ayırır. Yani birden fazla koşul sözkonusudur. switch koşul deyiminin genel yapısı şöyledir.
switch (ifade)
{
case değer1: işlem1
break
case değer2: işlem2
break
…
case değerN: işlemN
break
default: işlem
}
birden fazla işlem söz konusuysa,
switch (ifade)
{
case değer1 :
{
işlemler
}
break
case değer2 :
{
işlemler
}
break
…
case değerN :
{
işlemler
}
break
default:
{
işlemler
}
}
Bu koşul eyleminde değişken switch(…) kısmına yazılır. Sonra değişkenin alabileceği değerler case: (durum) kodlarının yanlarına yazılarak koşul ifadesi yaratılır ve alttaki işlemler uygulanır. Eğer case: kodlarından hiçbiri değişkenin taşıdığı değeri tutmuyorsa, default: kodunun altındaki işlemler uygulanır. (default kodunun yazılması zorunlu değildir; else kodunun yazılmasının zorunlu olmadığı gibi) Buradaki break (kes) komutu önemlidir. İşlemlerin altına break kodu yazmazsak, bir alttaki case (durum) koşuluna ait işlemler de yapılır. break kodunu işlemlerin altına koyarsak, işlemler bitince bir alttaki case koşulunun işlemlerine geçilmez ve program switch deyiminin sonundan devam eder. Buradan hareketle aynı işlemlere tabi tutulacak koşul ifadelerini alt alta yazın ve bu ifadelerden en altında olanın işlemlerine break komutunu uygulayın. Aşağıdaki uygulama konunun anlaşılmasına yardımcı olacaktır.
<html>
<head>
<title>Koşul Deyimleri</title>
<script language=”JavaScript”>
//Fonksiyonu hazırlıyoruz.
function karne(x)
{
switch(x)
{
case 10:
case 9: harf=”A”
break
case 8: harf=”B”
break
case 7:
case 6: harf=”C”
break
case 5: harf=”D”
break
default: harf=”E”
}
return harf
}
</script>
</head>
<body>
<script language=”JavaScript”>
var isim = “Ali”, puan = 8, y
y = karne(puan)
document.write(isim ” adlı öğrencinin aldığı not: ” y)
</script>
</body>
</html>
Kayıtlı
Ey Rahmeti Bol Pahişah Cürmüm iLe GeLdim Sana
HaşR
!
S|YöNetiCi
SüPeR üye
Üye Puanl +6/-1
Ynt: Javascript Nedir? Javascript Kodları
«
Yanıtla #23 :
14 Aralık 2011, 01:05:19 »
Bu sayfamızda döngü denetimini ve bu döngü oluşturan döngü deyimlerinin üzerinde duracağız. Bunlar while…, do…while… ve for….
“while” Döngü Deyimi
Öğreneceğimiz ilk döngü deyimi: while (Türkçesi: öyleyken). Bu deyimin yapısı şöyledir:
while (koşul ifadesi) işlem
birden fazla işlem söz konusuysa,
while (koşul ifadesi)
{
İŞLEMLER
}
Bu deyimdeki koşul ifadesi sağlandığı sürece deyimdeki işlemler sürekli; bir döngü oluşturacak şekilde, kendisini tekrarlar. Bu işlemler öyle olmalıdır ki belli bir sayıda çevrimden sonra bu koşul ifadesini sağlamasın ve döngüden çıksın, aksi takdirde döngü sonsuza kadar devam eder. Örnek mi?
<html>
<head>
<title>Döngü Deyimleri</title>
<script language=”JavaScript”>
//Fonksiyonu hazırlıyoruz.
function mesaj()
{
document.write(“<h1>Cameron Diaz</h1>”)
}
</script>
</head>
<body>
<script language=”JavaScript”>
var a=1
while (a == 1) mesaj()
</script>
</body>
</html>
Heh he. Kötü şakaydı, kabul ediyorum. Öyle birşey yapmalısınız ki sonunda döngü sona ermeli ve kendini tekrar etmeyi bırakmalı. Mesela beş defa Cameron Diaz yazalım.
<html>
<head>
<title>Döngü Deyimleri</title>
<script language=”JavaScript”>
//Fonksiyonu hazırlıyoruz.
function mesaj()
{
document.write(“<h1>Cameron Diaz</h1>”)
}
</script>
</head>
<body>
<script language=”JavaScript”>
var a=1
while (a < 6)
{
a
mesaj()
}
</script>
</body>
</html>
Bu uygulamadaki while döngüsünü yakın plana alalım. Döngünün koşul ifadesi a değişkeninin 6′dan küçük olmasıdır. Yani a değişkeninin değeri 6′dan küçük olduğu sürece süslü parantez içindeki işlemler birbirini tekrar edip duracak. Ama bu sonlu bir döngü, bilgisayarımızı kilitleme tehlikesi yok. Çünkü işlemin içinde a’nın değeri her çevrimde 1 artıyor. Ayrıca her çevrimde bir kez “Cameron Diaz” yazılıyor. Beş çevrim sonunda a değişkeni 6 değerine ulaştığı için, 6. çevrim yapılmaz ve döngü sona erer.
“do… while” Döngü Deyimi
do…while deyimi ile while deyimi arasında işlevsel olarak fark yok gibi görünür, ancak do…while deyiminde koşul ifadesi altta bulunur; ve koşul değerlendirmesi işlemi çevrimden önce değil, sonra yapılır. Deyiminin yapısı şöyledir:
do
İŞLEMLER
while (koşul ifadesi)
birden fazla işlem söz konusuysa,
do
{
İŞLEMLER
}
while (koşul ifadesi)
Şu birden fazla işlem söz konusuysa, deyimini devam ettirmenin sanırım gereği kalmadı. Zekasına sonsuz saygı duyduğum okuyucular anlamıştır ki süslü parantez birden fazla işlemi; tek komutla harekete geçirmek için, bir araya toplamaya yarar.
<html>
<head>
<title>Döngü Deyimleri</title>
<script language=”JavaScript”>
//Fonksiyonu hazırlıyoruz.
function kare(sayi)
{
y = sayi * sayi
return y
}
</script>
</head>
<body>
<script language=”JavaScript”>
var a=1
do
{
document.write(“
” a “
sayısının karesi =
” kare(a) “
”)
a
}
while (a < 101)
</script>
</body>
</html>
Yukarıdaki uygulama 1′den 100′e kadar tüm sayıların karesini buluyor. Sizler bu yazılımı hem görsel hem de işlevsel olarak geliştirebilirsiniz.
“for” Döngüsü
Şimdi sıra for… döngü deyimine geldi. Bu deyimin yapısı aşağıdaki gibidir:
for ( başlama noktası; koşul ifadesi; adım ifadesi)
{
İŞLEMLER
}
for döngüsünü belirleyen üç ifade var: başlama noktası, koşul ifadesi, adım ifadesi. Başlama noktası, döngünün hangi sayıdan başlayacağını belirler: i = 0 gibi. Koşul ifadesini daha önceki deyimlerden biliyoruz; koşul ifadesi aracılığıyla döngü devam eder: i <= 10 gibi. Adım ifadesi ise döngünün kaçar kaçar sayacağını belirleriz. Örneğin birer birer saymasını istiyorsak i değerini, ikişer ikişer saymasını istiyorsak i =2 değerini kullanırız. Bu adımlar artırma (pozitif) yönlü olmak zorunda değil, azalma (negatif) yönlü de olabilir: i– gibi.
Örneğin 75′den 1000′e kadar 25′er adımlı sayan bir yazılım geliştirelim.
<html>
<head>
<title>Döngü Deyimleri</title>
</head>
<body>
<script language=”JavaScript”>
var i
for (i = 75; i <= 1000; i = 25)
{
document.write(“Sayı = ” i “
”)
}
</script>
</body>
</html>
Şimdi de 1000′den geriye doğru 10′ar 10′ar -100′e kadar sayalım.
<html>
<head>
<title>Döngü Deyimleri</title>
</head>
<body>
<script language=”JavaScript”>
var i
for (i = 1000; i >= -100; i -= 10)
{
document.write(“Sayı = ” i “
”)
}
</script>
</body>
</html>
Koşul deyimlerini kullanarak bir döngü yaratmak da mümkün. Ama bunun için etiket kullanmalıyız. Etiketler yazılım kodları içindeki çeşitli başlama noktalarıdır. Etiketin ismi ve “:” işaretinden oluşur, örneğin BASLA: gibi. Yazılımın BASLA: ifadesine gitmesi ve oradan devam etmesini istiyorsak goto BASLA komut ve ifadesini kullanırız. Bir koşul deyimi ve etiketle nasıl döngü oluşturulduğunu aşağıdaki uygulamayla gösterebiliriz.
<html>
<head>
<title>Döngü,</title>
</head>
<body>
<script language=”JavaScript”>
var i=75
DONGU:
if (i <= 1000)
{
document.write(“Sayı = ” i “
”)
i = 25
goto DONGU
}
</script>
</body>
</html>
Kayıtlı
Ey Rahmeti Bol Pahişah Cürmüm iLe GeLdim Sana
HaşR
!
S|YöNetiCi
SüPeR üye
Üye Puanl +6/-1
Ynt: Javascript Nedir? Javascript Kodları
«
Yanıtla #24 :
14 Aralık 2011, 01:05:46 »
Akış denetimi ve döngü denetimi derslerimizde koşul ifadelerinin kullanıldığını gördük. Koşul deyimleri bu koşul ifadesine göre eleme yapıyor, döngü deyimleri bu koşul ifadesine göre çevrim oluşturuyordu. Ancak bu koşul ifadesi tek bir koşuldan oluşuyordu, acaba birden fazla koşulun sorgulanması mümkün müdür?
Elbette. Bunun için ilk yol, deyim içinde deyim kullanmaktır. Örneğin aşağıdaki uygulamada if koşul deyimi içiçe kullanılarak, sayının 25 ile 60 arasında olduğunu sorgulamaktadır:
<html>
<head>
<title>İkili Sorgulama</title>
<script language=”JavaScript”>
//İlk fonksiyonu hazırlıyoruz.
function onay()
{
document.write(“<h1>Sayı 25 ile 60 arasındadır.</h1>”)
}
//İkinci fonksiyonu hazırlıyoruz.
function red()
{
document.write(“<h1>Sayı 25 ile 60 arasında değildir.</h1>”)
}
</script>
</head>
<body>
<script language=”JavaScript”>
var x=38
if (x < 60)
{
if (x > 25) onay()
else red()
}
else red()
</script>
</body>
</html>
Burada içiçe if koşul deyimi kullanılmış ve önce sayının 60′dan küçük olması sorgulanıyor. Sayının 60′dan küçük olması halinde, bu sefer de sayının 25′ten büyük olması sorgulanıyor. Yani 60′tan küçük olan sayıların 25′ten büyük olması sorgulanıyor. Böylece sayının 60′dan küçük ve 25′ten büyük olması sorgulanmış oluyor.
JavaScript’te “ve” Operatörü: “&&”
İçiçe deyim kullanmak da güzel bir yol ama daha kısa bir yolumuz var: Mantıksal İşlemler. Sayının hem 25′ten büyük olmasını, hem de 60′tan küçük olmasını istiyorsak ve anlamına gelen && mantıksal işlem işareti ile iki koşulu tek bir koşul ifadesi haline dönüştürebiliriz:
<html>
<head>
<title>Mantıksal İşlemler</title>
<script language=”JavaScript”>
//İlk fonksiyonu hazırlıyoruz.
function onay()
{
document.write(“<h1>Sayı 25 ile 60 arasındadır.</h1>”)
}
//İkinci fonksiyonu hazırlıyoruz.
function red()
{
document.write(“<h1>Sayı 25 ile 60 arasında değildir.</h1>”)
}
</script>
</head>
<body>
<script language=”JavaScript”>
var x=65
if (x < 60 && x > 25) onay()
else red()
</script>
</body>
</html>
Bu sefer && (ve) işaretini kullanarak sayının 60′tan küçük olmasını ve sayının 25′ten büyük olmasını sorguladık. Buradaki ve kavramını Matematik konusunun mantık (logic) dersinden hatırlıyorsunuzdur. (Matematiği anlamakta zorlananlar programcılığa hiç başlamasınlar.) Özetle ve ifadesinin sorgulama sonuçları şöyleydi:
Doğru && Doğru = Doğru
Doğru && Yanlış = Yanlış
Yanlış && Doğru = Yanlış
Yanlış && Yanlış = Yanlış
&& operatörüyle yapılan sorgulamanın onaylanması için, her iki koşulun da sağlanması gerekir. Aksi takdirde sorgulama onaylanmayacaktır.
JavaScript’te “veya” Operatörü: “||”
Bir başka mantıksal işlem operatörü: || (veya anlamındadır; bu işareti oluşturmak için iki defa ALTGR “tire” tuşuna basın. “tire” tuşu backspace (geri al) tuşunun solunda bulunur. Eminim matematik bilgilerinden hiç kuşku duymadığım okuyucular bu operatörün sorgulama sistemini hemen hatırlamışlardır ama ben yine de yazayım.
Doğru || Doğru = Doğru
Doğru || Yanlış = Doğru
Yanlış || Doğru = Doğru
Yanlış || Yanlış = Yanlış
|| (veya) operatörünün && (ve) operatöründen farkı görülüyor. Bir sorgulamada || operatörü kullanılmışsa, koşullardan bir tanesinin gerçekleşmesi onay için yeterlidir. Son uygulamamızda 65 sayısını && operatörü ile sorgulamıştık:
(65 < 60) && (65 > 25)
Bu koşulun ilk kısmı yanlış, ikinci kısmı ise doğruydu. Yanlış && doğru = yanlış olduğundan sorgulama sonucu red fonksiyonuna gönderilmişti. Aynı koşul ifadelerini || operatörü ile sorgulasaydık sonuç başka olacaktı:
(65 < 60) || (65 > 25)
Buradaki işlem: Yanlış || doğru = doğru işlemidir. Ve koşul ifadesi kabul görür. Bu nedenle && ile || ifadelerini ne zaman kullanacağımıza dikkat etmeliyiz. Şimdi || operatörü için başka bir uygulama geliştirelim: Bu uygulamamız öncekiyle aynı sonucu versin. Yanlız bunun için koşul ifadesini ve koşul işlemlerini değiştireceğim, aradaki farka dikkat ediniz.
<html>
<head>
<title>Mantıksal İşlemler</title>
<script language=”JavaScript”>
//İlk fonksiyonu hazırlıyoruz.
function onay()
{
document.write(“<h1>Sayı 25 ile 60 arasındadır.</h1>”)
}
//İkinci fonksiyonu hazırlıyoruz.
function red()
{
document.write(“<h1>Sayı 25 ile 60 arasında değildir.</h1>”)
}
</script>
</head>
<body>
<script language=”JavaScript”>
var x=65
if (x > 60 || x < 25) red()
else onay()
</script>
</body>
</html>
Aradaki farkı anlayanlar bu işi kapmış demektir.
JavaScript’te “değil” Operatörü: “!”
Bir diğer mantıksal işlem operatörü: ! (değil) operatörüdür. Bu operatör koşul ifadesinin solunda yer alır ve o ifadenin olmamasını sorgular. Uygulamayla gösterelim:
<html>
<head>
<title>Mantıksal İşlemler</title>
<script language=”JavaScript”>
//İlk fonksiyonu hazırlıyoruz.
function negatif()
{
document.write(“<h1>Negatif sayı.</h1>”)
}
//İkinci fonksiyonu hazırlıyoruz.
function pozitif()
{
document.write(“<h1>Pozitif sayı.</h1>”)
}
</script>
</head>
<body>
<script language=”JavaScript”>
var x=12
if (!(x >= 0)) negatif()
else pozitif()
</script>
</body>
</html>
Uygulamamızda 12 değeri verilen x değişkeninin 0′dan küçük olup olmadığı sorgulanmakta. Eğer sıfırdan büyük değilse negatif(), aksi takdirde pozitif() fonksiyonları çağrılmaktadır.
Değişkenlere Mantıksal Değer Atama
Sayfamızda aynı koşul ifadelerini birçok kez sorguluyorsak veya koşul ifadesi çok uzunsa, değişkenlere atamayı tercih edebiliriz. Yapı olarak değişkene normal bir değer vermekten farkı yoktur. Örneğin üstteki uygulamayı şu hale dönüştürebiliriz:
<html>
<head>
<title>Değişkenlere Mantıksal Değer Atama</title>
<script language=”JavaScript”>
//İlk fonksiyonu hazırlıyoruz.
function negatif()
{
document.write(“<h1>Negatif sayı.</h1>”)
}
//İkinci fonksiyonu hazırlıyoruz.
function pozitif()
{
document.write(“<h1>Pozitif sayı.</h1>”)
}
</script>
</head>
<body>
<script language=”JavaScript”>
var x=12
var y=((x > 0) || (x == 0))
if (!y) negatif()
else pozitif()
</script>
</body>
</html>
Bu uygulamamızda ((x > 0) || (x == 0)) mantıksal değerini y değişkenine atadık.
Kayıtlı
Ey Rahmeti Bol Pahişah Cürmüm iLe GeLdim Sana
HaşR
!
S|YöNetiCi
SüPeR üye
Üye Puanl +6/-1
Ynt: Javascript Nedir? Javascript Kodları
«
Yanıtla #25 :
14 Aralık 2011, 01:06:20 »
Bu sayfaya kadar JavaScript’in temellerini öğrenmek için alert(…) ve document.write(…) komutlarıyla idare ettik. Artık JavaScript’in kodlarına ve inceliklerine ağırlık vereceğiz. Bu sayfanın konusu pencere komutları. Birçok öğretici site pencere komutlarını sonlara doğru anlatmış. Ama bence bu konu çok zevkli ve daha önce anlatarak okuyucuları JavaScript’in renkli dünyasına daha kolay çekmek mümkün. Hem neler yapabileceklerini zihinlerinde düşünmeye başlattırabilecek bir konu bu. Sanırım konuyu yeterince övdüm. Sayfamız bir sürü örnekle dolu. Seveceğinizi umarım
Uyarı Kutusu
İlk pencere komutumuz alert(…) kodu. Bu kodu daha önceki sayfalarda da kullanmıştık ve biliyoruz ki uyarı kutusu yapmaya yarar. JavaScript değişkenlerini ve tırnak içinde olmak şartıyla HTML kodlarını uyarı kutusuyla gösterebiliyorduk ve “ ” işareti ile bunları birleştirebiliyorduk. Şimdi küçük bir tekrar uygulaması yapalım.
<html>
<head>
<title>Uyarı Kutusu</title>
<script language=”JavaScript”>
//Fonksiyonu hazırlıyoruz.
function kup()
{
var y
y = 59 * 59 * 59
alert(“59 sayısının kübü = ” y)
}
</script>
</head>
<body>
<form>
59 sayısının kübünü öğrenmek istiyorsanız düğmeye basın.
<!–Düğmeye basıldığında fonksiyon çağrılır.–>
<input type=”button” onclick=”kup()” value=”Sayının kübünü al!”>
</form>
</body>
</html>
Onay Kutusu
Uyarı kutusu haricinde kullanabileceğimiz bir başka pencere aracı da onay kutusudur. Bu kutu ile kullanıcının onayı alınır. Bu kutuyu yaratmak için confirm(…) komutunu bir değişkene eşitleriz. Kullanıcının onayı true, onay vermemesi ise false şeklinde ifadelendirilir. Uygulamamıza bakalım.
<html>
<head>
<title>Onay Kutusu</title>
<script language=”JavaScript”>
//Fonksiyonu hazırlıyoruz.
function bomba()
{
var onay
onay = confirm(“Mars gezegenine doğrulttuğunuz nükleer bombalar hazır. Gezegeni yok etmek için onay verin.”)
if (onay == true) document.write(“Koskoca gezegeni yok ettin de eline ne geçti?”)
else document.write(“Yok etme operasyonu iptal edildi, tüm Marslılar size teşekkür ediyor.”)
}
</script>
</head>
<body>
<form>
Nükleer bombaları ateşlemek için düğmeye basınız.
<!–Düğmeye basıldığında fonksiyon çağrılır.–>
<input type=”button” onclick=”bomba()” value=”ATEŞ!”>
</form>
</body>
</html>
Yazı Kutusu
Hemen bir başka pencere komutuna geçiyorum. Kullanacağımız pencere aracı yazı kutusu. Yazı kutusu sayesinde kullanıcıyla program arasında bir veri alışverişi yapılır. Kullanıcı kutusu, tıpkı onay kutusu gibi bir değişkene eşitlenir ve prompt(…,…) komutu ile ifade edilir. Görüldüğü üzere prompt komutu iki değer alır. İlk değer yazı kutusunda yer alan bilgi verici yazıyı belirler, ikinci değer ise yazı kutusunun yazma yerinde yer alan yazıyı belirler, bu yazı genellikle girdi bilgisi içerir. Kullanıcının yazdığı yazı, prompt komutunun eşitlendiği değişkene değer olarak atanır. Yazı kutusunda Cancel (iptal) düğmesi yer almaktadır. Kullanıcı bu düğmeye bastığında değişken null (sıfır yani) değeri alacaktır.
<html>
<head>
<title>Yazı Kutusu</title>
<script language=”JavaScript”>
//İlk fonksiyonu hazırlıyoruz.
function kabul()
{
alert(“İçeri girebilirsin.”)
document.write(“<h1>Barımıza Hoşgeldiniz!</h1>”)
}
//İkinci fonksiyonu hazırlıyoruz.
function red()
{
alert(“Hoop ufaklık. Bas geri!”)
document.write(“<h1>18 yaşından küçükler giremez!</h1>”)
}
//Üçüncü fonksiyonu hazırlıyoruz.
function geri()
{
alert(“Cevap veremiyorsun değil mi?”)
document.write(“<h1>Evine dön!</h1>”)
}
</script>
</head>
<body>
<script language=”JavaScript”>
var yas= prompt(“Yaşınız kaç acaba?”,”Lütfen yaşınızı rakam ile yazınız…”)
if (yas >= 18) kabul()
if (yas < 18 && yas > 0) red()
if (yas == null || yas == “”) geri()
</script>
</body>
</html>
Yeni Pencere Açma
Yeni bir pencerede sayfa açmak için window.open(…) kodundan yararlanılır. Parantez içine açılacak sayfanın adresi yazılır.
<html>
<head>
<title>Yeni Pencere, yeni sayfa.</title>
<script language=”JavaScript”>
//Fonksiyonu hazırlıyoruz.
function pencere()
{
//Açılacak sayfanın dosya ismi: dersjscr.asp
window.open(“dersjscr.asp”) }
</script>
</head>
<body>
<form>
JavaScipt’e giriş sayfasını açmak için düğmeye basın.
<!–Düğmeye basıldığında fonksiyon çağrılır.–>
<input type=”button” onclick=”pencere()” value=”JavaScript’e Giriş”>
</form>
</body>
</html>
Bu uygulamayı çok rahat anlamışsınızdır, bu uygulamada kod varsayılan değerleriyle biçimlendiriliyor. Ama şimdiki uygulamayı çok dikkatli inceleyin, uygulamadan sonra gerekli açıklamayı yapacağım.
<html>
<head>
<title>Yeni Pencere, yeni sayfa.</title>
<script language=”JavaScript”>
//Fonksiyonu hazırlıyoruz.
function pencere()
{
//Açılacak sayfanın dosya ismi: dersjscr.asp
window.open(“dersjscr.asp”, “Yeni_Sayfa”, “toolbar=no,location=no,directories=no, status=no, menubar=yes,scrollbars=yes,resizable=no,copyhistory=yes,width=760, height=460″) }
</script>
</head>
<body>
<form>
JavaScipt’e giriş sayfasını açmak için düğmeye basın.
<!–Düğmeye basıldığında fonksiyon çağrılır.–>
<input type=”button” onclick=”pencere()” value=”JavaScript’e Giriş”>
</form>
</body>
</html>
Bu uygulamadaki pencere açma komutu biraz daha değişik: open.window(dosya adresi, pencere ismi, pencere özellikleri). Aşağıdaki listede pencere özelliklerini ve açıklamalarını görüyorsunuz:
menubar Pencerenin üst bölümünde yer alan gözatıcı (browser) menü çubuğunu ifade eder.
menubar=yes
status Pencerenin alt bölümünde yer alan küçük mesajları ifade eder.
status = no
scrollbars Kaydırma çubuklarını ifade eder.
scrollbars = yes
resizable Pencerenin büyüklüğünün fare ile değiştirilebilirliğini ifade eder.
resizable = no
width Pencere genişliğini piksel cinsinden ifade eder.
width = 600
heigth Pencere yüksekliğini piksel cinsinden ifade eder.
heigth = 400
toolbar Pencerenin üstünde, menü çubuğunun altında yer alan gözatıcı araç çubuğunu ifade eder.
menubar = no
location Pencerenin adres kutusunu ifade eder.
location = 600
directories Netscape gözatıcılarının “What’s new!”, “What’s cool!” isimli dizinlerini ifade eder.
directories = no
left Pencerenin ne kadar solda yer alacağını belirler; Netscape göz atıcıları desteklemiyor.
left = 100
screenX Pencerenin ne kadar solda yer alacağını belirler; Internet Explorer göz atıcıları desteklemiyor.
screenX = 100
top Pencerenin ne kadar üstte yer alacağını belirler; Netscape göz atıcıları desteklemiyor.
top = 50
screenY Pencerenin ne kadar üstte yer alacağını belirler; Internet Explorer göz atıcıları desteklemiyor.
screenY = 50
NOT1: Internet Explorer ve Netscape Navigator pencereyi konumlandırmak için farklı özellikler kullanılıyor. Her ikisinin desteklediği özellikleri beraber kullanırsanız sorun kalmaz.
NOT2: Evet/hayır tipi değer alan (boolean) özellikleri yes/no veya 1/0 gibi değerler alır.
Çok Sayıda Pencere Açma
Birden fazla pencereyi tek tıklamayla nasıl açarız? Her pencere açma komutunu bir değişkene eşitleyen fonksiyon kurarız:
<html>
<head>
<title>Yeni pencereler.</title>
<script language=”JavaScript”>
//Fonksiyonu hazırlıyoruz.
function pencere()
{
//Sayfalar açılıyor.
a1 = window.open(“dersjscr.asp?DersNo=1″, “Ders1″, “toolbar=no,location=no,directories=no, status=no, menubar=no,scrollbars=yes,resizable=no,copyhistory=yes,width=760, height=460″)
a2 = window.open(“dersjscr.asp?DersNo=2″, “Ders2″, “toolbar=no,location=no,directories=no, status=no, menubar=no,scrollbars=yes,resizable=no,copyhistory=yes,width=760, height=460″)
a3 = window.open(“dersjscr.asp?DersNo=3″, “Ders3″, “toolbar=no,location=no,directories=no, status=no, menubar=no,scrollbars=yes,resizable=no,copyhistory=yes,width=760, height=460″)
a4 = window.open(“dersjscr.asp?DersNo=4″, “Ders4″, “toolbar=no,location=no,directories=no, status=no, menubar=no,scrollbars=yes,resizable=no,copyhistory=yes,width=760, height=460″)
a5 = window.open(“dersjscr.asp?DersNo=5″, “Ders5″, “toolbar=no,location=no,directories=no, status=no, menubar=no,scrollbars=yes,resizable=no,copyhistory=yes,width=760, height=460″)
}
</script>
</head>
<body>
<form>
JavaScipt derslerinin ilk beş sayfasını açmak için düğmeye basın.
<!–Düğmeye basıldığında fonksiyon çağrılır.–>
<input type=”button” onclick=”pencere()” value=”JavaScript Dersleri”>
</form>
</body>
</html>
Sayfa Yönlendirme
JavaScript kullanarak mevcut pencerede kullanıcının istenen sayfaya yönlendirilmesi için location = “adres“ komutunu kullanırız:
<html>
<head>
<title>Sayfa yönlendirme.</title>
<script language=”JavaScript”>
//Fonksiyonu hazırlıyoruz.
function yonlendir()
{
//Yönlendirilecek adres: dersjscr.asp?DersNo=1
location = “dersjscr.asp?DersNo=1″
}
</script>
</head>
<body>
<form>
Pencerenizi “JavaScipt’e Giriş” sayfasına yönlendirmek için düğmeye basın.
<!–Düğmeye basıldığında fonksiyon çağrılır.–>
<input type=”button” onclick=”yonlendir()” value=”JavaScript’e Giriş”>
</form>
</body>
</html>
Sayfayı Yeniden Yükleme
JavaScript kullanarak sayfanın yeniden yüklenmesini (refresh) sağlamak için location.reload() komutundan yararlanılır.
<html>
<head>
<title>Sayfa yönlendirme.</title>
<script language=”JavaScript”>
//Fonksiyonu hazırlıyoruz.
function tazele()
{
//Yönlendirilecek adres: derjsct1.html
location.reload()
}
</script>
</head>
<body>
<form>
Sayfayı yeniden yüklemek için aşağıdaki düğmeye basınız.
<!–Düğmeye basıldığında fonksiyon çağrılır.–>
<input type=”button” onclick=”tazele()” value=”Sayfayı yeniden yükle”>
</form>
</body>
</html>
Çok Sayfalı Uygulama Geliştirme
Buraya kadar hep önceden hazırlanmış sayfaları açmayı inceledik. Peki daha önce olmayan bir sayfayı açabilir miyiz? Soruyu daha doğru bir şekilde sorayım: JavaScript ile yazıların bir kısmını yeni bir pencerede yazdırabilir miyiz? Elbette. open.window(“…”,”…”,”…”) komutundaki ilk yere sayfa adresi yazıyorduk; eğer yazmazsak yeni bir sayfa açılmış olur. Bu kodu bir değişkene eşitleyerek, yeni sayfanın ismini belirlemiş oluruz ve o sayfaya yazılması gerekenleri, o isimle tanımladığımız nesnelere yazarız. Uygulamayı inceleyince anlayacaksınız.
<html>
<head>
<title>Dokümanları başka sayfada gösterme.</title>
<script language=”JavaScript”>
//Fonksiyonu hazırlıyoruz.
function yenipencere()
{
//Yepyeni bir sayfa açıyoruz.
yenisayfa = window.open(“”, “Yeni_Sayfa”, “toolbar=no,location=no,directories=no, status=no, menubar=no,scrollbars=no,resizable=no,copyhistory=no,width=280, height=50, left=200, screenX=200, top=100, screenY=100″)
yenisayfa.document.write(“<font color= blue>Yeni bir pencere açmak ve o pencereye yazı yazmak.</font>”)
yenisayfa.document.write(“
İşte bütün mesele bu!”)
yenisayfa.document.write(“
Bu yöntemle daha neler yapılır, neler!”)
}
</script>
</head>
<body>
<form>
Başka bir sayfa yaratmak için düğmeye basın.
<!–Düğmeye basıldığında fonksiyon çağrılır.–>
<input type=”button” onclick=”yenipencere()” value=”Yeni Pencere”>
</form>
</body>
</html>
Pencere Kapatma
Bu ders konumuz gereği bir sürü sayfayı JavaScript ile açtık ama hepsini elimizle kapattık. İsterseniz bir de JavaScript’le kapatalım. Komutumuz çok basit: window.close().
<html>
<head>
<title>Sayfayı kapatmak.</title>
<script language=”JavaScript”>
//Fonksiyonu hazırlıyoruz.
function kapat()
{
//Sayfa kapatılıyor.
window.close()
}
</script>
</head>
<body>
<form>
Sayfayı kapatmak için aşağıdaki düğmeye basınız.
<!–Düğmeye basıldığında fonksiyon çağrılır.–>
<input type=”button” onclick=”kapat()” value=”Sayfayı kapat”>
</form>
</body>
</html>
Pencere Kutusu
Son olarak window.status komutu üzerinde duralım. Pencerenin altında linklerin yazılı olduğu kutucuğa yazı yazmaya yarar. Örneğin “Doğum günün kutlu olsun Banu” yazdıralım.
<html>
<head>
<title>Sayfayı kapatmak.</title>
<script language=”JavaScript”>
//Fonksiyonu hazırlıyoruz.
function kutlama()
{
//Sayfa kapatılıyor.
window.status = “Doğum günün kutlu olsun Banu”
}
</script>
</head>
<body>
<form>
Düğmeye basarsanız pencerenin alt kısmında bir mesaj göreceksiniz.
<!–Düğmeye basıldığında fonksiyon çağrılır.–>
<input type=”button” onclick=”kutlama()” value=”Banu’ya mesaj”>
</form>
</body>
</html>
Bu bölümde pencerelerle ilgili windows. başlangıçlı bazı kodlar gördük.
Kayıtlı
Ey Rahmeti Bol Pahişah Cürmüm iLe GeLdim Sana
HaşR
!
S|YöNetiCi
SüPeR üye
Üye Puanl +6/-1
Ynt: Javascript Nedir? Javascript Kodları
«
Yanıtla #26 :
14 Aralık 2011, 01:07:00 »
Şu ana kadar document. başlangıçlı tek kod gördük: document.write şimdilik bu kodla devam edeceğiz ve metinsel yöntemler üzerinde duracağız. DHTML sayfalarında document. başlangıçlı kodların hepsini ayrıca ele alacağız.
Karakter Sayısı Belirleme
Bu sayfadaki metinsel kodlar, metinsel değerleri şekillendirme yöntemleridir. Örneğin değişken.length yöntemiyle metinsel bir ifadenin kaç karakterden oluştuğunu bulabiliriz. Not: Boşluklar da karakter ifade eder.
<html>
<head>
<title>Karakter sayısı</title>
<script language=”JavaScript”>
function bul()
{
var metin
metin = prompt(“Metinsel bir ifade yazın.”, “Buraya lütfen…”)
if (metin == null || metin == “”) alert(“Yazı kutusuna birşey yazmadınız.”)
else
{
document.write(“Yazılan metin: ” metin “
”)
document.write(“Karakter sayısı: ” metin.length)
}
}
</script>
</head>
<body>
<form>
<p>Aşağıdaki düğme yazılan bir ifadenin karakter sayısını bulmaya yarar:</p>
<input type=”button” value=”Karakter Sayısı” onclick=”bul()”>
</form>
</body>
</html>
Uygulamamız da metin isimli değişkene length yöntemi uygulanıyor. (Kalın harflerle yazdım.)
Metin İçinde Metin Arama
Aynı yapıda başka bir yöntem koduna geçelim: indexOf(“…”). indexOf yöntem kodu ile metinsel bir ifadeyi, başka metinlerin arasında ararız. (Arama motoru yapmak isteyenler iyi okusun.) Mesela i değişkenin değeri “Cameron Diaz” olsun. Biz “Diaz” metinsel ifadesinin bu metin içinde bulunup bulunmadığını bu kodla şöyle anlarız: j = i.indexOf(“Diaz“). “Diaz” metinsel ifadesi “Cameron Diaz” metin değerli i içinde var. Bu durumda j pozitif bir tamsayı değeri alır. Olmasaydı -1 değeri alacaktı. Aşağıdaki uygulama herşeyi anlatıyor:
<html>
<head>
<title>Karakter Bulma</title>
<script language=”JavaScript”>
function bul()
{
var metin = prompt(“Öyle bir şey yazın ki içinde küçük \”a\” harfi olmasın.”)
var karakter=metin.indexOf(“a”)
if (karakter >= 0)
{
document.write(“
\”" metin “\”
ifadesinde \”a\” harfi var.”)
}
else
{
document.write(“
\”" metin “\”
ifadesinde \”a\” harfi yok.”)
}
}
</script>
</head>
<body>
<form>
<p>Aşağıdaki düğmeye basın…</p>
<input type=”button” value=”Karakter Arama” onclick=”bul()”>
</form>
</body>
</html>
indexOf koduna çok benzeyen bir başka yöntem koduna geçelim: match. Kullanım şekli indexOf() ile aynıdır. Tek farkı, eğer ifade aranan metnin içinde yoksa null (yok) değerini, varsa ifadenin metinsel değerini alır:
<html>
<head>
<title>Karakter Bulma</title>
<script language=”JavaScript”>
function bul()
{
var metin = prompt(“Öyle bir şey yazın ki içinde küçük \”a\” harfi olmasın.”)
var karakter=metin.match(“a”)
if (karakter == “a”)
{
document.write(“
\”" metin “\”
ifadesinde \”a\” harfi var.”)
}
else
{
document.write(“
\”" metin “\”
ifadesinde \”a\” harfi yok.”)
}
}
</script>
</head>
<body>
<form>
<p>Aşağıdaki düğmeye basın…</p>
<input type=”button” value=”Karakter Arama” onclick=”bul()”>
</form>
</body>
</html>
Yukarıdaki uygulama bir öncekiyle aynı sonucu veriyor ancak match kodu kullanılmakta.
Metin İçinde Bölüm Belirleme
Bir başka yöntem koduna geçiyorum: substr(…,…). substr kodu metinin belli bir bölümünü ifade etmeye yarar. Örneğin met = “Cameron Diaz” şeklindeki metinsel değerlikli bir değişkene kodu şöyle uygularsak: met.substr(7,4), “Diaz” metinsel değerini elde ederiz. Buradaki 7 sayısı, alıntı bölümünün 8. harften başladığını (ilk harf 0. sırada sayılıyor) ve 4 sayısı alıntının 4 harften oluştuğunu belirtiyor. Aşağıdaki uygulamaya bakalım:
<html>
<head>
<title>Karakter Alıntısı</title>
<script language=”JavaScript”>
function al()
{
var metin = prompt(“Yazılım buraya yazacağınız metnin 3. harfinden itibaren 5 harflik kısmını yazdırır.”)
var karakter=metin.substr(2,5)
document.write(“
\”" metin “\”
ifadesindeki 3. harften itibaren 5 harflik kısım şöyledir:”)
document.write(“
\”" karakter “\”")
}
</script>
</head>
<body>
<form>
<p>Aşağıdaki düğmeye basın…</p>
<input type=”button” value=”Karakter Alıntısı” onclick=”al()”>
</form>
</body>
</html>
Uygulama sayesinde kodun işlevi iyice anlaşıldığını sanıyorum. Metin üzerinde tek bir harfi bulmak istiyorsak metin.charAt(Harf Sıra No) kodunu kullanabiliriz. Harf Sıra Nonun 0′dan başladığını belirtmeliyim. “Volkan” metninde 0. sıra nolu harf “V”‘dir. Boşluklarında birer karakter olduğunu tekrar hatırlatayım.
Büyük Harfe veya Küçük Harfe Çevirme
Bu bölümün son yöntem kodları: toLowerCase (küçük harfe çevirir), toUpperCase (büyük harfe çevirir). Bu kodlar da öncekiler gibi değişkenden sonra .toLowerCase(…) veya .toUpperCase(…) şeklinde kullanılır. Anlaşılması çok kolay olduğu için hemen uygulamamıza geçelim.
<html>
<head>
<title>Babalama</title>
<script language=”JavaScript”>
function babala()
{
var metin = prompt(“İsminizi yazın…”,”Buraya lütfen”)
var buyuk=metin.toUpperCase(metin)
var kucuk=metin.toLowerCase(metin)
babalasayfa=window.open(“”,”Yeni_Sayfa”, “toolbar=no,location=no,directories=no, status=no, menubar=no,scrollbars=yes, resizable=no,copyhistory=no,width=480, height=180, left=200, screenX=200, top=100, screenY=100″)
babalasayfa.document.write(“<html><head></head><body bgcolor=#ffffcc>”)
babalasayfa.document.write(“<h1>En büyük ” buyuk “! Başka büyük yok!</h1>
”)
babalasayfa.document.write(“<h4>Sayın ” kucuk “, babalama ücreti 50 milyon! Hemen ödeyin</h4>”)
babalasayfa.document.write(“</body></html>”)
}
</script>
</head>
<body>
<form>
<p>İsmini yazın lütfen…</p>
<input type=”button” value=”Babalama Düğmesi” onclick=”babala()”>
</form>
</body>
</html>
Bu sayfada metinsel yöntem kodlarının bir kısmını inceledik. O kadar çok var ki bu sayfada hepsini incelemenin imkanı yok. Ama hepsi böyle kullanımı basit kodlar. JavaScript Komutlarını anlatan referans sayfalarında tüm metinsel kodları görebilirsiniz.
Kayıtlı
Ey Rahmeti Bol Pahişah Cürmüm iLe GeLdim Sana
HaşR
!
S|YöNetiCi
SüPeR üye
Üye Puanl +6/-1
Ynt: Javascript Nedir? Javascript Kodları
«
Yanıtla #27 :
14 Aralık 2011, 01:07:27 »
Diziler programcılığın temel konularından biridir. Bu sayfada öğrenecekleriniz, diğer programlarda da aynen veya benzer şekilde yer almaktadır. Bu sayfayı hemen değişkenlerden sonra anlatmayı düşünüyordum ama daha önce hiçbir yazılım dili bilmeyen arkadaşlara Pencere ve Metin kodları gibi somut derslerin daha öncelikli olduğuna karar verdim. Şimdi diziler konusuna geçebiliriz.
Dizi Tanımlama
Dizileri değişkenler kümesi şeklinde tanımlayabiliriz. Bellekte aynı isim altında saklanan değerleri ifade eder; değerler new Array(…) kodu kullanılarak girilir. Dizilerin iki yazım türü vardır:
var hafta = new Array(“pazartesi”, “salı”, “çarşamba”, “perşembe”, “cuma”, “cumartesi”, “pazar”)
veya,
var hafta = new Array(6)
hafta[0] = “pazartesi”
hafta[1] = “salı”
hafta[2] = “çarşamba”
hafta[3] = “perşembe”
hafta[4] = “cuma”
hafta[5] = “cumartesi”
hafta[6] = “pazar”
Buradaki hafta isimli değişken 7 değerli bir dizidir. İlk değer 0. sırada sayılmaktadır. hafta[0] değişkeninin değeri “pazartesi”, hafta[3]‘ün değeri “perşembe”‘dir. Değişkenlerden tek farkı, aynı ismi taşımaları. Değerleri yazılım boyunca değişebilir, birbirlerine değerlerini aktarabilirler.
Aşağıdaki uygulamada kullanıcının girdiği 10 sayı küçükten büyüğe doğru sıralanmaktadır.
<html>
<head>
<title>Sıralama</title>
<script language=”JavaScript”>
function sirala()
{
var kelime = new Array(9)
var i, j, k, m, ara
for (i=0; i <=9; i )
{
kelime
= prompt(“Metinsel bir ifade girin lütfen…”,”Buraya,”)
}
//Sayıları sıralıyoruz.
for (j=0; j <=9; j )
{
for (k=0; k <=8; k )
{
if (kelime[k] > kelime[k 1])
{
ara =kelime[k]
kelime[k] = kelime[k 1]
kelime[k 1] = ara
}
}
}
for (m=0; m <= 9; m ) document.write(m 1 “. kelime = ” kelime[m] “
”)
}
</script>
</head>
<body>
<form>
<p>Düğmeye basarak 10 tane yazıyı alfabetik sıraya sokabilirsiniz.</p>
<input type=”button” value=”Sırala” onclick=”sirala()”>
</form>
</body>
</html>
Bu uygulama için söylemek istediğim birkaç şey var. prompt kodunun yazılanları metinsel ifade olarak gördüğünü unutmayalım, bu nedenle bu yazılım alfabetik sıraya sokuyor. Yani “245″ değerini, “3″ değerinden küçük sayıyor. Bir diğer nokta, JavaScript İngilizce karakterleri esas aldığı için Türkçe karakterler sonda yer alıyor. Yani “z” değeri, “ş” harfinden önce geliyor. Sayısal bir sıralama yapmak isterseniz, metinsel ifadeleri sayısal ifadeye çevirmelisiniz ki, bunu henüz öğrenmediniz; yakında öğreneceksiniz.
Çok Boyutlu Diziler
Diziler tek boyutlu olmak zorunda değil. Şu ana kadar tek boyutlu dizileri gördük, oysa çok boyutlu diziler kullanmamız gerekebilir. JavaScript’te çok boyutlu dizi yok aslında ama bu bizim için bir engel değil: Tek boyutlu bir dizinin her elemanını yeni bir dizi haline getirip, iki boyutlu dizi haline getirebiliriz:
var hafta = new Array (6,1)
for(var i=0; i<=6;i ) hafta
= new Array()
hafta[0][0] = “pazartesi sabahı”
hafta[0][1] = “pazartesi akşamı”
hafta[1][0] = “salı sabahı”
hafta[1][1] = “salı akşamı”
hafta[2][0] = “çarşamba sabahı”
hafta[2][1] = “çarşamba akşamı”
hafta[3][0] = “perşembe sabahı”
hafta[3][1] = “perşembe akşamı”
hafta[4][0] = “cuma sabahı”
hafta[4][1] = “cuma akşamı”
hafta[5][0] = “cumartesi sabahı”
hafta[5][1] = “cumartesi akşamı”
hafta[6][0] = “pazar sabahı”
hafta[6][1] = “pazar akşamı”
Burada 7 x 2 = 14 tane değer söz konusudur ve iki değer grubunun (haftanın günleri, gün vakti) aralarında bir ilişki vardır. Bu örneğe 7 x 2′li bir matris de diyebiliriz, zira diziler bir matris ifadesidir. Matris bilgisi olmayan arkadaşlarımız kendi kendilerine yaptıkları denemelerle bazı temel bilgileri edinebilirler. Küçük bir uygulama yapalım:
<html>
<head>
<title>Sıralama</title>
<script language=”JavaScript”>
function rehber()
{
var kayit = new Array()
for (var i=0; i<=100; i )
{
kayit
= new Array()
kayit
[0]=prompt(“Arkadaşınızın ismini girin lütfen”,”İsim”)
if (kayit
[0]==null || kayit
[0]==”") break
kayit
[1]=prompt(kayit
[0] ” isimli arkadaşınızın telefonunu girin lütfen”, “Telefon”)
}
document.write(“Rehbere kaydedilmiş isim ve telefon numaraları:
”)
for (var j=0; j<=i;j )
{
document.write(kayit[j][0] “: ” kayit[j][1] “
”)
}
}
</script>
</head>
<body>
Aşağıdaki düğmeye basarak telefon numaralarını öğrenebilirsiniz.
<form>
<input type=”button” value=”Telefon Rehberi” onclick=”rehber()”>
</form>
</body>
</html>
Diziler Üzerinde İşlemler
Diziyi yazılım içinde değer vermişsek, o dizinin kaç değeri olduğunu biliriz ve değer sayısını bulmaya çalışmayız. Ama eğer diziye girilecek değer sayısını kullanıcıya bırakmışsak, dizinin taşıdığı değer sayısını yazılım içinde ifade etmek isteriz. Dizilerin taşıdığı değer sayısını ifade etmek için length komutu kullanılır.
Kayıtlı
Ey Rahmeti Bol Pahişah Cürmüm iLe GeLdim Sana
HaşR
!
S|YöNetiCi
SüPeR üye
Üye Puanl +6/-1
Ynt: Javascript Nedir? Javascript Kodları
«
Yanıtla #28 :
14 Aralık 2011, 01:08:09 »
Bu sayfada zaman yöntem kodları üzerinde duracağız. Bu kodlar zaman birimlerini ifade etmekte, nesneleri zamana göre sıralamakta ve sorgulamakta kullanılır.
Zaman Değişkeni Tanımlama ve Yürürlükteki Zaman Değerini İfade Etme
İlk kodumuz: new Date(). Bu kod değişkenin zaman değeri taşıdığını belirtiyor. Ve değişkene bilgisayarın saatinde yer alan zaman değerini veriyor. Aşağıdaki kodlarla bu zaman değerini özelleştirebiliriz.
getDate() Ayın kaçı olduğunu gösterir.
tarih.getDate()
getMonth() Hangi ayda olduğumuzu gösterir. Ocak için 0, Şubat için 1, Mart için 2, …, Aralık için 11 değerini verir.
tarih.getMonth()
getFullYear() İçinde bulunduğumuz yılı dört rakamıyla gösterir.
tarih.getFullYear()
getHours() Saat değerini ifade eder. 24′lük sistem kullanılır.
tarih.getHours()
getMinutes() Dakika değerini ifade eder.
tarih.getMinutes()
getSeconds() Saniye değerini ifade eder.
tarih.getSeconds()
getUTCHours() UTC saat değerini ifade eder. UTC bir zaman standardı; NASA falan kullanıyor olsa gerek.
tarih.getUTCHours()
getUTCMinutes() UTC dakika değerini ifade eder.
tarih.getUTCMinutes()
getUTCSeconds() UTC saniye değerini ifade eder.
tarih.getUTCSeconds()
getDay() Haftanın günlerini ifade eder. Pazar için 0, Pazartesi için 1, Salı için 2, …, Cumartesi için 6 değerini verir.
tarih.getDay()
Eğer bu kodların tanımlandığı değişken önceden var değişken = new Date() şeklinde tanımlanmazsa çalışmaz. Şimdi bir uygulamayla tüm bu kodların nasıl sonuç verdiğini görelim. Uygulama sonuçlarını, bilgisayarınızın saatiyle karşılaştırın.
<html>
<head>
<title>Zaman Komutları</title>
</head>
<body>
<h3>Zaman Komutları ve Sonuçları</h3>
<script language=”JavaScript”>
var zaman = new Date()
document.write(“
Zaman
: ” zaman)
document.write(“
getFullYear
: ” zaman.getFullYear())
document.write(“
getDate
: ” zaman.getDate())
document.write(“
getMonth
: ” zaman.getMonth())
document.write(“
getHours
: ” zaman.getHours())
document.write(“
getMinutes
: ” zaman.getMinutes())
document.write(“
getSeconds
: ” zaman.getSeconds())
document.write(“
getUTCHours
: ” zaman.getUTCHours())
document.write(“
getUTCMinutes
: ” zaman.getUTCMinutes())
document.write(“
getUTCSeconds
: ” zaman.getUTCSeconds())
document.write(“
getDay
: ” zaman.getDay())
</script>
</body>
</html>
Uygulamayı dikkatli inceleyen okuyucular, tek rakamlı zaman birimlerinin önüne 0 gelmediğini görmüşlerdir. Yani saniye 08 yerine 8 diye geçer. (Saat yapmak isteyenlerin dikkatine.) Bir başka özellik de, bu kodlarla sadece sayfanın çalıştırıldığı anın zamanı gösteriliyor. Örneğin saniye ifadesi olduğu gibi duruyor ve çalıştırıldığı zamanın saniyesini gösteriyor. (Saat yapmak isteyenlerin bir daha dikkatine.)
Zaman Değeri Atama
İstersek zaman ayarlarıyla oynayabilir, istediğimiz tarihe veya saate kurabiliriz. Bu kurma işlemi için aşağıdaki komutlar kullanılır.
setFullYear() Girilen yılı ayarlar.
tarih.setFullYear(“1963″)
setMonth() Girilen ayı ayarlar.
tarih.setMonth(“5″)
setDate() Ayın gününü ayarlar.
tarih.setDate(“13″)
setHours() Saati ayarlar.
tarih.setHours(“10″)
setMinutes() Dakikayı ayarlar.
tarih.setMinutes(“34″)
setSeconds() Saniyeyi ayarlar.
tarih.setSeconds(“22″)
setUTCHours() UTC saatini ayarlar.
tarih.setUTCHours(“10″)
setUTCMinutes() UTC dakikasını ayarlar.
tarih.setUTCMinutes(“34″)
setUTCSeconds() UTC saniyesini ayarlar.
tarih.setUTCSeconds(“22″)
Dikkat ederseniz zamanı ayarlarken haftanın günlerini ayarlamıyoruz. Bilgisayar ayarlanan yıl, ay ve güne göre haftanın gününü hesaplıyor. Şimdi uygulamamızı inceleyelim; her ayarlamadan sonra zaman yeniden gösteriliyor.
<html>
<head>
<title>Zaman Komutları</title>
</head>
<body>
<h3>Zaman Komutları ve Sonuçları</h3>
<script language=”JavaScript”>
var zaman = new Date()
document.write(“
Zaman
: ” zaman)
document.write(“
getFullYear
: ” zaman.getFullYear())
document.write(“
getDate
: ” zaman.getDate())
document.write(“
getMonth
: ” zaman.getMonth())
document.write(“
getHours
: ” zaman.getHours())
document.write(“
getMinutes
: ” zaman.getMinutes())
document.write(“
getSeconds
: ” zaman.getSeconds())
document.write(“
getUTCHours
: ” zaman.getUTCHours())
document.write(“
getUTCMinutes
: ” zaman.getUTCMinutes())
document.write(“
getUTCSeconds
: ” zaman.getUTCSeconds())
document.write(“
getDay
: ” zaman.getDay())
</script>
</body>
</html>
Zaman Aralığı
Fonksiyonu harekete geçiren olayın oluşmasından belli miktar zaman geçtikten sonra birşey oluşmasını istiyorsak, setTimeout(…, …) komutu kullanılır. Örneğin bir düğmeye basıldıktan sonra uyarı kutusunun çıkmasını istiyorsak:
setTimeout(“alert(‘Bu mesaj 3 saniye sonra çıkar.’)”, 3000)
İlk değer parantez içinde bir JavaScript kodudur, ikinci değer ise ilk değerin ne kadar süre sonra oluşacağını belirleyen, mili saniye cinsinden zaman değeridir. (1 saniye = 1000 mili saniye) Bu komut ile uyarı kutusu 3 saniye bekledikten sonra görünecektir.
setTimeout komutu daha çok zaman aralıklarıyla tekrar eden hareketler oluşturmak için kullanılır. Aşağıdaki uygulamamıza bakalım:
<html>
<head>
<title>setTimeout</title>
<script language=”JavaScript”>
var metin;
function Slogan(n)
{
if(n%2==1) {metin=”EN BÜYÜK”}
else
{metin=”ALTAY!!!”}
katman.innerHTML=metin
setTimeout(“Slogan(” (n 1) “)”, 1000);
}
</script>
</head>
<body onload=”Slogan(1)”>
<div id=”katman” align=”center”>Deneme</div>
</body>
</html>
Bu uygulama ile 1000 milisaniye (1 saniye) arayla “EN BÜYÜK” ve “ALTAY!!!” yazıları birbirinin yerine geçiyor. Bunu yapmak için Slogan() fonksiyonunun içinde tekrar Slogan() fonksiyonu çağrılarak bir döngü oluşturdum. Örnek uygulamalar bölümünde bu kullanım tarzını bolca göreceksiniz.
Kayıtlı
Ey Rahmeti Bol Pahişah Cürmüm iLe GeLdim Sana
Yazdır
Sayfa:
1
[
2
]
Yukarı git
« önceki
sonraki »
www.Aradigim.net
»
BiLiM&TEkNoLoJİ
»
Webmaster Bilgiler
»
Javascript Nedir? Javascript Kodları