Javascript ES6 Arrow Fonksiyon

Javascript ES6 ile birlikte gelen bir güzel yenilikte Arrow Fonksiyonlar. Bu özellik yakın zamanda PHP içinde gelmişti.

Temel olarak fonksiyonların yazımını daha kolay ve daha az hale getiren bir özellik. O yüzden iki farklı şekilde fonksiyonları yazarak örneklerle anlamaya çalışacağız.

En temelinden bir fonksiyonu iki farklı şekilde yazmayı görelim.

const hello = function(){
    return "hello world"
}
console.log(hello())

const hello = () => {
    return "hello world"
}
console.log(hello())

Gördüğünüz gibi, function(){} yerine () => {} şeklinde kullandık. Eğer geriye tek satırda bir şey return ediyorsak o zaman süslü parantezlere de gerek kalmadan kullanabiliriz.

const hello = function(){
    return "hello world"
}
console.log(hello())

const hello = () => "hello world"
console.log(hello())

Eğer parametre alacağım bir fonksiyon yazacaksam ise o da ikiye ayrılıyor. Tek parametre alanlar ve birden fazla parametre alanlar olarak. Örneğin tek parametre alıyorsa şöyle kullanabiliriz.

const say = function(hi){
    return hi
}
console.log(hello("hello world"))

const say = hi => hi
console.log(hello("hello world"))

Eğer birden fazla alıyorsa o zaman parantezler ile birlikte kullanacağız. Örneğin;

const plus = function(number1, number2){
    return number1 + number2
}
console.log(hello())

const plus = (number1, number2) => number1 + number2
console.log(hello())

Kısaca bunu fonksiyon gördüğünüz her yerde kullanabilirsiniz. Örneğin spread operatörünü kullanarak bir kare alma fonksiyonu yazalım.

const square = function(...numbers){
    return numbers.map(function(number){
        return number * 2
    })
}
console.log(square(2, 4, 6)) // Çıktı -> [4, 8, 12]

const square = (...numbers) => numbers.map(number => number * 2)
console.log(square(2, 4, 6))  // Çıktı -> [4, 8, 12]