20 Mart 2016 Pazar

Javscript'de Operatörler

Merhaba Webkolog Ailesi!

Bugün JavaScript'in günlük kodlama pratiğimizin vazgeçilmez unsurlarından operatörleri derinlemesine inceleyeceğiz. Operatörler, değişkenler ve değerler üzerinde çeşitli işlemler yapmamızı sağlayan sembollerdir. Matematiksel hesaplamalardan mantıksal karşılaştırmalara, atamalardan özel durumlara kadar birçok alanda karşımıza çıkarlar. Hadi, bu önemli araç setini yakından tanıyalım!


1. Aritmetik Operatörler

Aritmetik operatörler, sayısal değerler üzerinde temel matematiksel işlemleri gerçekleştirmek için kullanılır.

  • + (Toplama): İki sayıyı toplar. String'lerle kullanıldığında birleştirme (concatenation) yapar.
    
                let a = 5;
                let b = 3;
                console.log(a + b); // 8
                console.log("Merhaba" + " Dünya"); // "Merhaba Dünya"
            
  • - (Çıkarma): Bir sayıdan diğerini çıkarır.
    
                let x = 10;
                let y = 4;
                console.log(x - y); // 6
            
  • * (Çarpma): İki sayıyı çarpar.
    
                let p = 6;
                let r = 7;
                console.log(p * r); // 42
            
  • / (Bölme): Bir sayıyı diğerine böler.
    
                let m = 20;
                let n = 5;
                console.log(m / n); // 4
            
  • % (Modül - Kalan Bulma): Bir sayının diğerine bölümünden kalanı bulur.
    
                let bolunen = 17;
                let bolen = 5;
                console.log(bolunen % bolen); // 2 (17 / 5 = 3 kalan 2)
            

2. Atama Operatörleri

Atama operatörleri, bir değişkene değer atamak veya var olan bir değeri bir işlemle güncelleyerek atamak için kullanılır.

  • = (Atama): Sağdaki değeri soldaki değişkene atar.
    
                let yas = 25;
            
  • += (Topla ve Ata): Değişkenin mevcut değerine sağdaki değeri ekler ve sonucu değişkene atar. (x = x + y ile aynıdır.)
    
                let sayac = 5;
                sayac += 3; // sayac = sayac + 3;
                console.log(sayac); // 8
            
  • -= (Çıkar ve Ata): Değişkenin mevcut değerinden sağdaki değeri çıkarır ve sonucu değişkene atar.
    
                let puan = 100;
                puan -= 20; // puan = puan - 20;
                console.log(puan); // 80
            
  • *= (Çarp ve Ata): Değişkenin mevcut değerini sağdaki değerle çarpar ve sonucu değişkene atar.
    
                let fiyat = 15;
                fiyat *= 2; // fiyat = fiyat * 2;
                console.log(fiyat); // 30
            
  • /= (Böl ve Ata): Değişkenin mevcut değerini sağdaki değere böler ve sonucu değişkene atar.
    
                let bakiye = 50;
                bakiye /= 5; // bakiye = bakiye / 5;
                console.log(bakiye); // 10
            
  • %= (Modül Al ve Ata): Değişkenin mevcut değerinin sağdaki değere bölümünden kalanı bulur ve sonucu değişkene atar.
    
                let kalan = 13;
                kalan %= 3; // kalan = kalan % 3;
                console.log(kalan); // 1
            

3. Artırma ve Azaltma Operatörleri

Bu operatörler, bir değişkenin değerini 1 artırmak veya 1 azaltmak için kullanılır.

  • ++ (Increment - Artırma): Değişkenin değerini 1 artırır.
    • Ön Artırma (Pre-increment): ++x — Değeri önce artırır, sonra kullanır.
    • Sonra Artırma (Post-increment): x++ — Değeri önce kullanır, sonra artırır.
    
                let i = 5;
                let j = ++i; // i önce 6 olur, sonra j'ye 6 atanır.
                console.log(i, j); // 6, 6
    
                let k = 5;
                let l = k++; // k önce l'ye 5 olarak atanır, sonra k 6 olur.
                console.log(k, l); // 6, 5
            
  • -- (Decrement - Azaltma): Değişkenin değerini 1 azaltır.
    • Ön Azaltma (Pre-decrement): --x — Değeri önce azaltır, sonra kullanır.
    • Sonra Azaltma (Post-decrement): x-- — Değeri önce kullanır, sonra azaltır.
    
                let m = 5;
                let n = --m; // m önce 4 olur, sonra n'ye 4 atanır.
                console.log(m, n); // 4, 4
    
                let p = 5;
                let r = p--; // p önce r'ye 5 olarak atanır, sonra p 4 olur.
                console.log(p, r); // 4, 5
            

4. Karşılaştırma Operatörleri

Bu operatörler, iki değeri karşılaştırır ve karşılaştırma sonucuna göre true (doğru) veya false (yanlış) bir boolean değeri döndürür.

  • == (Eşittir - Değer Karşılaştırması): Sadece değerlerin eşit olup olmadığını kontrol eder, veri tiplerini dikkate almaz (otomatik tip dönüşümü yapar).
    
                console.log(5 == "5"); // true (String "5" sayı 5'e dönüştürülür)
                console.log(0 == false); // true
            
  • === (Kesin Eşittir - Değer ve Tip Karşılaştırması): Hem değerlerin hem de veri tiplerinin eşit olup olmadığını kontrol eder. Daha sık ve güvenli bir kullanımdır.
    
                console.log(5 === "5"); // false (Tip farkı)
                console.log(0 === false); // false (Tip farkı)
                console.log(5 === 5); // true
            
  • != (Eşit Değil - Değer): Değerlerin eşit olup olmadığını kontrol eder, eşit değilse true döndürür.
    
                console.log(10 != "10"); // false (Değerler eşit)
            
  • !== (Kesin Eşit Değil - Değer ve Tip): Hem değerlerin hem de veri tiplerinin eşit olup olmadığını kontrol eder, eşit değillerse true döndürür.
    
                console.log(10 !== "10"); // true (Tip farkı)
                console.log(10 !== 10); // false
            
  • > (Büyüktür): Soldaki değer sağdaki değerden büyükse true.
    
                console.log(10 > 5); // true
            
  • < (Küçüktür): Soldaki değer sağdaki değerden küçükse true.
    
                console.log(3 < 8); // true
            
  • >= (Büyük veya Eşittir): Soldaki değer sağdaki değerden büyük veya eşitse true.
    
                console.log(7 >= 7); // true
                console.log(9 >= 5); // true
            
  • <= (Küçük veya Eşittir): Soldaki değer sağdaki değerden küçük veya eşitse true.
    
                console.log(4 <= 4); // true
                console.log(2 <= 6); // true
            

5. Mantıksal Operatörler

Mantıksal operatörler, birden fazla koşulu birleştirmek veya bir koşulun mantıksal tersini almak için kullanılır.

  • && (VE - AND): Her iki koşul da true ise true döndürür. Aksi takdirde false.
    
                console.log(true && true); // true
                console.log(true && false); // false
            
  • || (VEYA - OR): Koşullardan herhangi biri true ise true döndürür. Her ikisi de false ise false.
    
                console.log(true || false); // true
                console.log(false || false); // false
            
  • ! (DEĞİL - NOT): Bir koşulun mantıksal tersini alır. true'yu false'a, false'u true'ya çevirir.
    
                console.log(!true); // false
                console.log(!false); // true
            

6. Koşul (Ternary) Operatörü

Koşul operatörü (?:), üç işlenenli tek operatördür ve bir if-else yapısının kısaltılmış halidir. Sözdizimi: koşul ? ifade1 : ifade2.


    let yas = 18;
    let durum = (yas >= 18) ? "Yetişkin" : "Çocuk";
    console.log(durum); // "Yetişkin"

7. Diğer Önemli Operatörler

  • + (String Birleştirme): Sayılarla toplama yaparken, string'lerle birleştirme işlemi yapar.
    
                let metin1 = "Merhaba";
                let metin2 = "Dünya";
                console.log(metin1 + " " + metin2); // "Merhaba Dünya"
            
  • , (Virgül Operatörü): Birden fazla ifadeyi tek bir satırda ayırmak için kullanılır. Genellikle for döngülerinde değişkenleri başlatırken veya güncellerken kullanılır.
    
                for (let i = 0, j = 10; i < j; i++, j--) {
                    console.log(`i: ${i}, j: ${j}`);
                }
            
  • ... (Spread - Yayılma Operatörü): Dizileri veya objeleri "yayarak" elemanlarını kopyalamak veya birleştirmek için kullanılır.
    
                const sayilar = [1, 2, 3];
                const yeniSayilar = [...sayilar, 4, 5]; // [1, 2, 3, 4, 5]
    
                const ogrenci = { ad: "Zeynep", yas: 22 };
                const guncelOgrenci = { ...ogrenci, bolum: "Bilgisayar" };
                console.log(guncelOgrenci); // { ad: "Zeynep", yas: 22, bolum: "Bilgisayar" }
            
  • delete (Silme Operatörü): Bir objenin özelliğini veya bir dizinin elemanını siler. Dizilerde elemanı silse de, uzunluğunu değiştirmez ve boş (empty) bir yer bırakır.
    
                let myObject = { a: 1, b: 2 };
                delete myObject.a;
                console.log(myObject); // { b: 2 }
    
                let myArray = [1, 2, 3];
                delete myArray[1];
                console.log(myArray); // [1, undefined, 3] veya [1, empty, 3]
                console.log(myArray.length); // 3
            
  • in (İçinde Operatörü): Belirtilen bir özelliğin belirtilen bir objede olup olmadığını kontrol eder. Diziler için indeks kontrolünde de kullanılabilir. Boolean değer döndürür.
    
                let araba = { marka: "Ford", model: "Focus" };
                console.log("marka" in araba); // true
                console.log("renk" in araba); // false
    
                let meyveler = ["Elma", "Armut"];
                console.log(0 in meyveler); // true (0. indeks var mı?)
                console.log(2 in meyveler); // false
            
  • instanceof (Örnek Operatörü): Bir objenin belirli bir sınıfın veya kurucu fonksiyonun bir örneği olup olmadığını kontrol eder.
    
                let tarih = new Date();
                console.log(tarih instanceof Date); // true
                console.log(tarih instanceof Object); // true (Date de bir Object'tir)
    
                let sayilarim = [1, 2, 3];
                console.log(sayilarim instanceof Array); // true
                console.log(sayilarim instanceof Object); // true
            
  • new (Yeni Operatörü): Bir kurucu fonksiyonu kullanarak yeni bir nesne örneği oluşturur.
    
                function Kisi(ad, yas) {
                    this.ad = ad;
                    this.yas = yas;
                }
                let yeniKisi = new Kisi("Can", 30);
                console.log(yeniKisi.ad); // "Can"
            
  • this (Bu Operatörü): Fonksiyonun nasıl çağrıldığına bağlı olarak farklı değerleri referans gösterebilen özel bir anahtar kelimedir. Kapsam (scope) konusunda oldukça önemlidir.
    
                const user = {
                    firstName: "Ali",
                    lastName: "Veli",
                    fullName: function() {
                        return this.firstName + " " + this.lastName;
                    }
                };
                console.log(user.fullName()); // "Ali Veli"
            
  • typeof (Tip Operatörü): Bir değişkenin veya ifadenin veri tipini döndürür.
    
                console.log(typeof "Merhaba"); // "string"
                console.log(typeof 123); // "number"
                console.log(typeof true); // "boolean"
                console.log(typeof {}); // "object"
                console.log(typeof []); // "object"
                console.log(typeof undefined); // "undefined"
                console.log(typeof null); // "object" (JavaScript'teki tarihi bir hata)
            
  • void (Geçersiz Operatör): Bir ifadenin değerlendirilmesini sağlar ancak undefined döndürür. HTML'de JavaScript bağlantılarını devre dışı bırakmak için kullanılabilir (javascript:void(0)).
    
                // HTML'de bir bağlantıyı pasif hale getirmek için:
                // <a href="javascript:void(0);">Tıklanamaz Link</a>
    
                console.log(void(1 + 2)); // undefined (1+2 işlemini yapar ama sonuç döndürmez)
            

Sonuç

JavaScript'teki operatörler, kod yazarken kullandığımız temel araç setimizdir. Hangi operatörün ne işe yaradığını bilmek ve bunları doğru yerlerde kullanmak, daha verimli, okunabilir ve hatasız kodlar yazmamızı sağlar. Özellikle == ve === arasındaki fark gibi ince detaylara dikkat etmek, beklenmedik hataların önüne geçmenize yardımcı olacaktır.

Bu zengin operatör setini keşfetmeye devam edin ve kendi projelerinizde cesurca uygulayın!

Webkolog'u takipte kalın!

Hepinize bol kodlu ve başarılı projeler dilerim!

0 yorum:

Yorum Gönder