Download Free Designs http://bigtheme.net/ Free Websites Templates
Başlangıç / Programlama / Javascript (Başlıyoruz)

Javascript (Başlıyoruz)

Javascript

Java Script’in bazı genel özellikleri :

  • Javascript kodlarını yazmak için Windows kullanıcıları için NotePad, Mac. kullanıcıları için Simple Text yeterlidir.
  • JavaScript kodları </script> etiketi ile biter.
  • <!- etiketi JavaScript’i anlamayan eski sürüm tarayıcıların bu kısmı geçmeleri içindir.
  • Genellikle yazım tarzı
<script>
<!–
JavaScript kodları
–>
</script>

şeklindedir.

  • İyi bir programcı kod satırlarında açıklama yapar. Bu satır şu işlemi gerçekleştiriyor gibi açıklayıcı bilgiler yazar kodlarının yanına. JavaScript’te bu tür açıklama // ile başlar ve // ile biter. Eğer açıklamanız bir satırdan fazla ise /* ile başlar */ ile biter.

Örnek:

// bu satır kullanılacak değişkenlerin tanımlanması
/* açıklama satırı 1
açıklama satırı 2
açıklama satırı 3 */
  • JavaScript kodları Html kodların arasında yer alır. Veya uzantısı js olan dosyalarda saklanarak yine Html içerisinden çağırılır. Java Appletleri gibi Html’den ayrı bir unsur değildir. Javascript Html’in bir parçasıdır.
  • Kullanılacak yere göre Html’in içerisinde kullanılır. Fakat genelde <head>…</head> etiketleri arasında kullanılır.
  • Javascript kodları bittiğinde elinizde asla kendi başına çalışan uzantısı exe veya com olan bir dosya olmaz. Her zaman için tarayıcı tarafından yorumlanması gerekir. Yorumlanması demek Javascript kodunun çalışması anlamındadır.
  • Nesne ve buna uygulanan olaylar ile ilgili bir takım görevleri vardır. Javascript kullandığı her unsuru nesne olarak algılar. Siz bu nesneleri tıklamak, üzerine gelmek, üzerinde çıkmak gibi olaylar ile çalıştırırsınız ki bu da Javascript’in ziyaretçi ile etkileşmesi demektir.
  • Genel öğrenim yapımız diğer programlama dillerine nazaran biraz farklı olacaktır. Bu Javascript’in bir script dili olmasında ileri gelir.

Değişkenler

1.1 Genel Değişken Özellikleri

Değişkenler Javascript’te ve diğer programlama dillerinde olduğu gibi bilgi depolamak bu bilgiyi kullanmak amacıyla kullanılırlar. Değişkenler “var” komutu ile oluşturulurlar. Karakter olarak kullanıldıklarında işlem yapılamazlar. Nümerik olarak kullanıldıklarında ancak işlem yapabilirler. Kullanımına bir örnek verelim.

Örnek:

var sayi;
var sayi1=10;
var yazi1=”10″;

 

Burada birinci satırdaki “sayi” değişkeni script kodunun herhangi bir yerinde kullanılmak üzere oluşturulmuştur. İkinci satırda “sayi1″ adındaki değişkenin değeri hemen o satırda = ifadesinden sonra verilmiştir. Böyle değişken tanımıda yapılabilir. Üçüncü satırda ise değişkenin karakter ifadesi olarak kullanımını görüyoruz. Burada önemli olan karakter değişkenlerin alıntı ” ” ifadesinin arasında kullanılmasıdır. Her değişkenden sonra ; işareti konulmalıdır. Tarayıcı, bir başka komut satırına geçtiğini bu yol ile anlar.

Şimdi değişkenlerle ilgili matematik işlemlerinin nasıl olacağını görelim. Bunu daha iyi açıklayabilmek için örnekler üzerinde çalışalım.

Örnek:

var sayi1=10;
var sayi2=20;
var sayi3=sayi1+sayi2;

 

Birinci ve ikinci satırlarda değişkenler oluşturduk. Üçüncü satırdaki ise sayi3 değişkeni ile diğer iki değişkeni topladık. Burada önemli olan işlem yapmak istediğimizde değişken değerinin alıntı ” ” işaretlerinin arasına konmamasıdır. Üçüncü satırı – ileride göreceğimiz write () fonksiyonu ile – tarayıcıda yazdırırsak göreceğimiz değer 30’dur.

Şimdi de değişkenleri karakter olarak tanımladığımızda neler olduğuna bakalım.

var sayi1=”10″;
var sayi2=”20″;
var sayi3= sayi1+sayi2;

 

Bir önceki örnekten farklı olarak değişken değerlerinin alıntı işaretleri içerisinde yazdık. Eğer sayi3 adlı değişkeni tarayıcıda bastırırsak göreceğimiz ifade 1020 ifadesidir. Yani tarayıcı karakter olarak tanımladığımız değişkenleri ardada ekledi. Burada unutulmaması gereken şey bunun sadece + işleminde geçerli olmasıdır. Diğer işlem türlerinde bu tür bir sonuç alınamaz.

Değişkenlere ad verirken uymamız gereken kurallar.

  1. Değişken isimleri harf veya _ karakteri ile başlayabilir. Rakam kullanmak istersek 2. karakterden sonra kullanabiliriz. Yani değişkenin ilk karakteri rakam olamaz.

Değişken isimlerine örnekler;

var url=”webteknikleri”; doğru
var _rakam=12; doğru
var a1=123; doğru
var 3uzler=”üçüzler” yanlış

 

  1. Değişken tanımlarken bir veya birden fazla boşluk bırakmak tanımlama açısından herhangi bir sorun teşkil etmez.
  2. Değişken adı verirken kullandığımız harflerin büyük veya küçük olması bazı tarayıcılarda fark etmezken çoğu tarayıcıda farklı bir değişken anlamındadır.
var say=1;
var Say=1;

Farklı değişkenler olarak algılanır.

 

1.2 Değişkenlerin işlem operatörleri ile kullanımı

Değişkenlere işlem yaptırabilecek operatörleri ve özelliklerini inceleyelim. Operatörleri birkaç kısıma ayırarak inceleyelim;

  • Aritmetik operatörler
  • Karşılaştırmak operatörleri
  • Mantıksal operatörler
  • Özel operatörler

 

1.2.1 Aritmetik Operatörler

Her zaman kullandığımız bu operatörler + , – , * , / , % ‘dir.Değişkenlerin çeşitli aritmetik operatörlerle kullanımına bir örnek verelim.

var i=10;
var j=11;
var k=12;
var m,n;
m=i*j+k;
n=i*(j+k);

 

Şimdi örneğimizi inceleyelim:

İlk üç satırda değişkenlerimizi hem tanımlayıp hem de değer atadık. Dördüncü satırda ise m ve n değişkenlerini tanımlayıp değer atamdık. Diğer satırlarda ise m ve n değişkenlerinden istenen işlemleri tanımladık. Buna göre son iki satırın sonuçları farklıdır. Çünkü parantezlerin işlem önceliği vardır.

Beşinci satırın cevabı (10*11)+12 = 122 şeklinde olacaktır. Son satırda ise sonuç 10*(11+12) = 230 olacaktır. Diğer bir işlem operatörü olan % ‘nin yaptığı işlemi şu şekilde anlatabiliriz.% operatörü % işaretinin solundaki değişkeni sağındaki değişkene böler ve kalanı verir. Örnek olarak;

var a=100; var b=9; var c=100%9;

 

Burada c değişkenin değeri 100/9’un kalanı 1’dir. Yani c değişkeninin değeri 1 olacaktır. Diğer -(eksi) ve / (bölme) operatörlerinin işlemleri kendilerine atanan çıkartma ve bölme işlemidir.Bu operatörlerin kısa kullanımı içinde Javascript bize kolaylık sağlar. Bu operatörleri sıralamak istersek;

-= : *= : /= : %= : ++ : —

Bu operatörlerin kısa uzun şekilde yazılışları ise;

x+=y x=x+y
x-=y x=x-y
x*=y x=x*y
x/=y x=x/y
x%=y x=x%y
x++ x=x+1
x– x=x-1

şeklindedir.

Bu operatörlerin nasıl işlem yaptığını bir örnekte görelim.

var x,y,z;
x=10; y=20; z=30;
x++; x+=y; z–; y*= z;

 

Şimdi her zamanki gibi işlem satırlarının cevaplarını birlikte bulalım.

x++ satırı x=x+1 işleminin yapılmasını söyler. Buna göre x değişkeni 11 değerini alır.İkinci satıra geldiğimizde x+=y satırı x=x+y işleminin yapılmasını söyler. Bir önceki satırdaki x’in değeri 11 idi. Böylelikle yeni x’in değeri 11+20=31 olacaktır. Diğer satırda z– işlemi sonucunda z’nin değeri 29 olacaktır. Son satırda ise y=y*z işlemi ile y değişkeni 20*29= 380 değerini alacaktır.

 

1.2.2 Karşılaştırma operatörleri

Bu operatörler değişkenlerin birbirleri ile karşılaştırılmak istendiğinde kullanılır.

== operatörü iki değişkenin birbirine eşitliğini kontrol eder.
!= operatörü iki değişkenin birbirine eşit olmadığı durumlarda kullanılır.
< operatörü bilindiği üzere küçüktür operatörüdür. Soldaki değişkenin sağdakinde küçüklüğünü kontrol eder.
<= soldaki değişkenin sağdaki değişkene küçük eşitliğini kontrol eder.
> soldaki değişkenin sağdaki değişkene göre büyük olup olmadığını kontrol eder.
>= soldaki değişkenin sağdaki değişkene büyük eşitliğini kontrol eder.

 

1.2.3 Mantıksal Operatörler

Bu tip operatörler iki değişkene bağlı karşılaştırılmaların yapılmak istendiği durumlarda kullanılır.

Operatörler && , || , ! operatörleridir.

&& And (ve) operatörü iki değişkenin de değeri doğru olması istendiğinde kullanılır.
|| Or (veya) operatörü iki değişkenden en az birinin doğru olması durumu istediğinde kullanılır.
! Not (değil) operatörü değişkenin değeri doğru ise yanlış , yanlış ise doğru olması istendiği durumlarda kullanılır.

 

1.2.4. Özel karşılaştırma Operatörü

Bu operatör iki değişken arasında karşılaştırma yapmanın en sade ve kısa yoludur.

Operatörün kullanım biçimi :

değişken_1 [istenen karşılaştırma operatörü] değişken_2 ? değişken_3 : değişken_4

 

Bunu bir örnekle açıklayalım.

Değişkenleri var ile tanımladığımızı farz ediyorum. Buna göre;

a < b ? c : d

 

Yukarıdaki satırda yapılması istenen işlem;

a değişkeninin b değişkeninden küçük olup olmadığı karşılaştırılıyor. Buna göre cevap doğruysa işlemin sonucu c değişkeninin değeri değilse d değişkeni oluyor.

Şimdi tüm bu öğrendiklerimizi bir Javascript kodunda görelim. Bu bizim ilk Javascript kodumuz olacak.

Örnek :

<script Language=”JavaScript 1.2″>
<!–
var i=1; var j=2;
var k=3; var m=4;
var n=5; var
p=6; var q=7;
i=+j;
j++;
k–;
m=m+k;
n=*j;
i < j ? 3 : 1 ;
k >= n ? 0 : 1 ;
k=2 && j=5 ? p : q ;
i=2 || j=3 ? m : n ;
p!=2 ? k : 10 ;
— >
</script>

 

İlk yedi satırda değişkenlerimizi hem tanımladık hem de değer atadık. Böyle bir yazımı yapabileceğimizi değişkenleri anlatmaya başlarken söylemiştik.

İşlem satırlarına geçtiğimizde ise;

i+=j;

Bu işlem daha da önce gördüğümüz gibi bize i=i+j işlemini yapmamızı söyler. Buna göre i değişkeninin değeri 3 olacaktır. Hemen altındaki satırda bulunan j++ işlemi dolayısıyla da j değişkeni 3 değerini alacaktır. Diğer işlem satırında k–işlemi ile de k değişkeni 2 değerini alır. Bir diğer satırdaki m=m+k işlemi ile m(m=4) değişkeni k(k=2) değişkeni toplanarak 6 değerini alır. n=*j işlemi ile de n(n=5) değişkeni 3*5=15 değerini alacaktır.

Şimdi diğer karşılaştırma işlemlerine geçmeden önce değişkenlerimizin işlem sonrası aldığı değerleri yazalım.

i=3 , j=3 , k=2 , m=6 , n=15 , p=6 , q=7 ; i < j ? 3: 1;

Bu satırın 3 < 3 işleminin cevabı doğru ise 3 değilse 1 değeri alacağını görebiliyoruz. Tabi ki üç üçten küçük olmadığı için cevabımız 1 olacaktır.

k>=n ? 0 : 1;

Bu satırda ise 2>=15 işlemi gerçekleşir ki bunun cevabı da yanlıştır ve ikinci değer işlem satırının cevabıdır yani 1 dir.

Şimdiki karşılaştırma işlemimiz ise mantıksal operatörlerle ilgili. Buna göre;

k=2 && j=5 ? p : q;

İşlem bize ne söylüyor ? k değişkeni ve j değişkeninin kesin olarak bir değere eşit olup olmadığını karşılaştırmamızı söylüyor. Bu iki değer de doğruysa çünkü &&(and) mantıksal operatörünün anlamı bu işlem doğrudur değilse yanlıştır. Buna göre k=2 ‘dir. Fakat buna karşılık j’nin değeri 5 değildir. Bu yüzden karşılaştırmanın cevabı yanlıştır. Dolayısıyla işlem q yani 7 değerini alır.

p!=2 ? k : 10;

İşlemde istenilen p değişkeninin değerinin ikiden farklı olması durumdur. Yani 6!=2 bunun anlamı doğrudur. Gerçektende 6=2 değildir. Bizde bu satırda bunu istiyorduk. O halde cevap doğrudur. Böylelikle işlem k yani 2 değerini alır.

Şimdi biz bu yaptıklarımızla sadece javascript’te bir şeyler hesap etmesini ve karşılaştırmasını söyledik. Tarayıcı da bu işlemleri yapar ve hafızasında tutar. Daha sonra öğreneceğimiz komutlarla bunları istersek tarayıcıya yazdırabilir. Başka bir yerde kullanılmasını söyleyebiliriz.

Hakkında Volkan ŞABAHAT

İlginizi Çekebilir

Scratch Eğitimi

Scratch Eğitimi – Videolu Dersler 4 (Paint Uygulaması)

Scratch programı ile bugün basit bir paint uygulaması yapacağız. Nasıl yapılacağını videoyu izleyerek öğrenebilirsiniz. Ben ...

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

Güvenlik Kodu * Time limit is exhausted. Please reload CAPTCHA.