6 Mayıs 2016 Cuma

Javascript'de Hazır Fonksiyonlar

Merhaba Webkolog Takipçileri!

Bugün JavaScript'in günlük kodlama hayatımızı kolaylaştıran harika bir özelliğinden bahsedeceğiz: Hazır Fonksiyonlar (Global Functions). Bu fonksiyonlar, herhangi bir obje veya sınıf olmadan doğrudan kullanabileceğiniz, JavaScript dilinin kendisi tarafından sunulan pratik araçlardır. Veri tipi dönüşümlerinden matematiksel kontrollere, URL kodlamasından dinamik kod çalıştırmaya kadar birçok işlevi yerine getirirler. Hadi, bu kullanışlı yardımcıları yakından tanıyalım!


Neden Hazır Fonksiyonlara İhtiyaç Duyarız?

JavaScript'te sıkça karşılaştığımız veya genel geçer işlemleri tekrar tekrar yazmak yerine, dilin bize sunduğu hazır fonksiyonları kullanırız. Bu, hem kod yazma hızımızı artırır hem de kodumuzun daha temiz, standartlara uygun ve okunabilir olmasını sağlar. Ayrıca, bu fonksiyonlar genellikle performansı optimize edilmiş bir şekilde çalışır.


Önemli Hazır Fonksiyonlar ve Kullanımları

1. Sayısal Dönüşüm ve Kontrol Fonksiyonları
  • parseInt(): Bir string'i tam sayıya dönüştürür. String'in başındaki sayısal değeri alır ve ilk sayısal olmayan karakterde durur. İkinci parametre ile sayı tabanı (radix) belirtebilirsiniz.
    
                console.log(parseInt("23Elazığ"));   // 23
                console.log(parseInt("Sivas58"));    // NaN (Not-a-Number) - Sayıyla başlamadığı için
                console.log(parseInt("101", 2));     // 5 (İkili tabandan onluk tabana çevirme)
            
  • parseFloat(): Bir string'i ondalıklı sayıya (float) dönüştürür. İlk sayısal olmayan karaktere kadar olan ondalıklı değeri alır.
    
                console.log(parseFloat("3.14"));     // 3.14
                console.log(parseFloat("23.45cm"));  // 23.45
                console.log(parseFloat("314e-2"));   // 3.14 (Bilimsel gösterim)
            
  • Number(): Herhangi bir değeri bir sayıya dönüştürmeye çalışır. Başarısız olursa NaN döndürür.
    
                console.log(Number("123"));    // 123
                console.log(Number("3.14"));   // 3.14
                console.log(Number(""));       // 0
                console.log(Number("  10  ")); // 10
                console.log(Number("abc"));    // NaN
                console.log(Number(true));     // 1
                console.log(Number(false));    // 0
            
  • isNaN(): Bir değerin "Sayı Değil" (Not-a-Number) olup olmadığını kontrol eder. true veya false döndürür.
    
                console.log(isNaN(123));        // false (Sayıdır)
                console.log(isNaN("Merhaba"));  // true (Sayıya dönüştürülemez)
                console.log(isNaN("123"));      // false ("123" sayıya dönüştürülebilir)
                console.log(isNaN(NaN));        // true
            
  • isFinite(): Bir değerin sonlu bir sayı olup olmadığını kontrol eder (yani ne Infinity ne de -Infinity ne de NaN olup olmadığını).
    
                console.log(isFinite(10));      // true
                console.log(isFinite(Infinity)); // false
                console.log(isFinite(-Infinity)); // false
                console.log(isFinite(NaN));     // false
                console.log(isFinite("10"));    // true ("10" sayıya dönüştürülebilir)
            
2. String Dönüşüm Fonksiyonu
  • String(): Herhangi bir değeri string (metin) veri tipine dönüştürür.
    
                console.log(String(123));      // "123"
                console.log(String(3.14));     // "3.14"
                console.log(String(true));     // "true"
                console.log(String(null));     // "null"
                console.log(String(undefined)); // "undefined"
                console.log(String([1, 2, 3])); // "1,2,3"
            
3. URL Kodlama/Kod Çözme Fonksiyonları

Bu fonksiyonlar, URL'lerde özel karakterlerin doğru bir şekilde iletilmesini sağlamak için kullanılır.

  • encodeURI(): Bir URI'nin tamamını kodlar. URL'nin temel bileşenlerini (şema, host, port, path, query, fragment) ayıran özel karakterleri (; , / ? : @ & = + $ #) kodlamaz.
    
                let url = "https://example.com/sayfam?isim=Ali Can&yas=30";
                let kodluUrl = encodeURI(url);
                console.log(kodluUrl);
                // Çıktı: https://example.com/sayfam?isim=Ali%20Can&yas=30
            
  • decodeURI(): encodeURI() ile kodlanmış bir URI'yi çözerek orijinal haline getirir.
    
                let kodluUrl = "https://example.com/sayfam?isim=Ali%20Can&yas=30";
                let orijinalUrl = decodeURI(kodluUrl);
                console.log(orijinalUrl);
                // Çıktı: https://example.com/sayfam?isim=Ali Can&yas=30
            
  • encodeURIComponent(): Bir URI bileşenini (sorgu parametresi veya yol parçası gibi) kodlar. encodeURI()'den daha katıdır ve tüm özel karakterleri (;, / ? : @ & = + $ # dahil) kodlar. Bu, özellikle URL'nin sorgu dizisindeki değerler için önemlidir.
    
                let aramaMetni = "JavaScript & Öğren";
                let kodluMetin = encodeURIComponent(aramaMetni);
                console.log(kodluMetin);
                // Çıktı: JavaScript%20%26%20%C3%96%C4%9Fren
                let urlTam = "https://example.com/arama?q=" + kodluMetin;
                console.log(urlTam);
                // Çıktı: https://example.com/arama?q=JavaScript%20%26%20%C3%96%C4%9Fren
            
  • decodeURIComponent(): encodeURIComponent() ile kodlanmış bir URI bileşenini çözerek orijinal haline getirir.
    
                let kodluMetin = "JavaScript%20%26%20%C3%96%C4%9Fren";
                let orijinalMetin = decodeURIComponent(kodluMetin);
                console.log(orijinalMetin);
                // Çıktı: JavaScript & Öğren
            

Ne zaman hangisini kullanmalıyım?

  • URL'nin tamamını kodlamak isterseniz encodeURI() kullanın.
  • URL'nin sadece bir bölümünü (örneğin bir sorgu parametresinin değerini) kodlamak isterseniz encodeURIComponent() kullanın.
4. Dinamik Kod Çalıştırma Fonksiyonu
  • eval(): Bir string olarak verilen JavaScript kodunu değerlendirir ve çalıştırır. Güvenlik açıkları ve performans sorunları nedeniyle genellikle önerilmez. Mümkün olduğunca başka yöntemler tercih edilmelidir.
    
                let kodString = "console.log('Eval ile çalıştırıldı!');";
                eval(kodString); // Çıktı: Eval ile çalıştırıldı!
    
                let x = 10;
                let y = 20;
                let toplamaIfadesi = "x + y";
                let sonuc = eval(toplamaIfadesi);
                console.log(sonuc); // 30
            

Global Değerler

Fonksiyon olmasalar da, JavaScript'in global kapsamda bize sunduğu bazı önemli değerler de vardır:

  • Infinity: Pozitif sonsuzluğu temsil eder. Bir sayının sıfıra bölünmesi gibi durumlarda ortaya çıkabilir.
    
                console.log(1 / 0); // Infinity
            
  • -Infinity: Negatif sonsuzluğu temsil eder.
    
                console.log(-1 / 0); // -Infinity
            
  • NaN (Not-a-Number): Geçersiz veya tanımsız bir sayısal sonucu temsil eder (örneğin bir string'i sayıya çevirmeye çalışmak gibi).
    
                console.log("abc" * 5); // NaN
            
  • undefined: Bir değişkene değer atanmadığında veya bir fonksiyon bir değer döndürmediğinde otomatik olarak atanan değerdir.
    
                let z;
                console.log(z); // undefined
            

Sonuç

JavaScript'in hazır fonksiyonları, günlük kodlama rutinimizde bize büyük kolaylıklar sağlayan vazgeçilmez araçlardır. Veri tipi dönüşümlerinden URL işlemlerine kadar birçok temel görevi hızlı ve güvenli bir şekilde yerine getirmemizi sağlarlar. Bu fonksiyonları etkin bir şekilde kullanmak, kodunuzun daha verimli ve okunaklı olmasına yardımcı olur.

Bu fonksiyonları iyi anlamak, JavaScript öğrenme yolculuğunuzda sizi bir adım öne taşıyacaktır. Pratik yapmaya devam edin ve bu güçlü araçları projelerinizde kullanmaktan çekinmeyin!

Webkolog'u takipte kalın!

Hepinize bol kodlu ve keyifli öğrenme süreçleri dilerim!

0 yorum:

Yorum Gönder