10 Şubat 2019 Pazar

ES6 Arrow Function nedir? Nasıl kullanılır?

Leave a Comment


Bu yazıda EcmaScript 6 ile beraber hayatımıza giren, yeni nesil JavaScript özelliklerinden Arrow Function'ın kullanımından bahsedeceğim.

JavaScript'te bildiğimiz gibi fonksiyon yazmak için function komutunu kullanıyorduk ve aşağıdaki gibi fonksiyonumuzu yazıyorduk.


function isimYazdir(isim) {
  console.log(isim);
}

Arrow function kullanarak bu fonksiyonu nasıl yazabileceğimize bakalım.


isimYazdir = (isim) => {
  console.log(isim);
}

Bu kod ile aynı işlemleri yapan fonksiyonu yazdık. Peki arrow function'ın başka ne gibi avantajları var. Öncelikle tek parametre alan fonksiyonlarda parantezleri kullanmak zorunda değiliz. Hiç parametre almayan ya da birden fazla parametre alan fonksiyonlarda parantezleri kesinlikle kullanmak zorundayız. Kodumuzu aşağıdaki gibi de yazabiliriz.

isimYazdir = isim => {
  console.log(isim);
}

Geriye değer dönen bir fonksiyon ise süslü parantezleri kullanmak zorunda da değiliz. Tüm işlemleri tek satır halinde yapabiliriz. Aşağıdaki kodu çalıştırdığımızda console'a "Merhaba Berkay" yazdırılacaktır.

isimYazdir = isim => "Merhaba " + isim;

console.log(isimYazdir("Berkay"));

Hiç parametre almayan arrow function örneği

isimYazdir = () => {
  console.log("Berkay");
}

Birden fazla parametre alan arrow function örneği


isimYazdir = (isim, yas) => {
  console.log(isim, yas);
}

Read More