JavaScript ile Fonksiyonel Programlama, React programlama dünyasını keşfetmeye başladığınızda, fonksiyonel programlama konusunun çok fazla ortaya çıktığını fark edeceksiniz. JavaScript projelerinde fonksiyonel teknikler giderek daha fazla kullanılıyor.

Fonksiyonel JavaScript kodunu zaten düşünmeden yazmış olabilirsiniz. Bir diziyi eşlediyseniz veya küçültdüyseniz, zaten fonksiyonel bir programcı olma yolundasınız demektir. React, Flux ve Redux, fonksiyonel JavaScript paradigmasına uyuyor. Fonksiyonel programlamanın temel kavramlarını anlamak, React uygulamalarını yapılandırma bilginizi artıracaktır.

Bu fonksiyonel eğilimin nereden geldiğini merak ediyorsanız, cevap 1930’larda, lambda matematiği veya λ calculus’un icadına dayanmaktadır.

Fonksiyonel Olmanın Anlamı

JavaScript’in fonsiyonel bir dil olduğunu söyleyebiliriz, çünkü fonksiyonları first-class citizen (birinci sınıf vatandaş)’dir. Peki nedir bu first-class citizen; Belirli bir fonksiyon ya da nesnenin, diğer varlıklara özgü tüm özellikleri yapabildiği anlamına gelir; bir değişkene atanabilme, fonksiyon argümanı olarak kullanılabilme, bir fonksiyondan geri dönme vb. gibi özellikler. Bu tür fonksiyonlara Higher Order Function denir, argüman olarak fonksiyon kabul eden veya bir fonksiyon döndüren fonsiyonlardır.

Sonuç olarak, first-class citizen, “basit değişkenler ve nesneler gibi, fonksiyonların da aynı özelliklere sahip” olabileceği anlamına gelir.

JavaScript’te, fonksiyonlar uygulamanızdaki değişkenleri temsil edebilir. Dizeleri, sayıları veya diğer değişkenleri tanımladığımız gibi var anahtar sözcüğüyle fonksiyonlar tanımlayabileceğimizi fark etmiş olabilirsiniz:

var log = function(mesaj) {
    console.log(mesaj)
};
log("JavaScript'te fonksiyonlar değişkendir")
// JavaScript'te fonksiyonlar değişkendir

ES6 ile aynı fonksiyonu bir arrow function kullanarak da yazabiliriz. Fonksiyonel programcılar bir çok küçük fonksiyon yazdıklarından dolayı, arrow function sözdizimi bu işi çok daha kolaylaştırır:

const log = mesaj => console.log(mesaj)

Yukarıda fonksiyonu bir değişkene atadık, fonksiyonlar değişken olduğundan, benzer şekilde nesnelere de ekleyebiliriz.

const obj = {
    mesaj: "Değişkenler gibi nesnelere eklenebilirler",
    log(mesaj) {
        console.log(mesaj)
    }
}
obj.log(obj.mesaj)
// Değişkenler gibi nesnelere eklenebilirler

Bu ifadelerin her ikisi de aynı şeyi yapar: bir fonksiyonu log adlı bir değişkende saklarlar. Ek olarak, const anahtar sözcüğü ikinci fonksiyonu tanımlamak için kullanıldı. (const, üzerine yazılmasını engeller.)

Ayrıca JavaScript’teki dizilere de fonsiyonlar ekleyebiliriz.

const mesaj = [
    "fonksiyonlar dizilere eklenebilirler",
    mesaj => console.log(mesaj),
    "değişkenler gibi",
    mesaj => console.log(mesaj)
]
mesaj[1](mesaj[0]) // fonksiyonlar dizilere eklenebilirler
mesaj[3](mesaj[2]) // değişkenler gibi

Fonsiyonlar, diğer fonksiyonlara argüman olarak gönderilebilir.

const func = logger => logger("Diğer fonksiyonlara argüman olarak gönderilebilirler.");
func(mesaj => console.log(mesaj))
// Diğer fonksiyonlara argüman olarak gönderilebilirler.

Aynı zamanda değişkenler gibi diğer fonksiyonlardan da döndürülebilirler:

var createScream = function(logger) {
    return function(message) {
        logger(message.toUpperCase() + "!!!")
    }
}
const scream = createScream(message => console.log(message))
scream('fonksiyonlar diğer fonksiyonlardan döndürülebilir')
scream('createScream bir fonksiyon dönüyor')
scream('scream geri dönen fonksiyonu çağırır')
// FONKSIYONLAR DIĞER FONKSIYONLARDAN DÖNDÜRÜLEBILIR!!!
// CREATESCREAM BIR FONKSIYON DÖNÜYOR!!!
// SCREAM GERI DÖNEN FONKSIYONU ÇAĞIRIR!!!

Son iki örnek, diğer fonksiyonları alan ya da döndüren fonksiyonlardı. ES6 sözdizimini kullanarak aynı createScream fonksiyonunu oklarla da tanımlayabiliriz:

const createScream = logger => message =>
      logger(message.toUpperCase() + "!!!")

Bundan sonra, fonksiyon tanımlaması sırasında kullanılan okların sayısına dikkat etmemiz gerekir. Birden fazla ok, daha üst düzeyde bir fonksiyona sahip olduğumuz anlamına gelir.

JavaScript ile fonksiyonel programlama yazı dizisinin ilk bölümünü, şimdilik burada bitiriyorum, bir sonraki bölümde fonksiyonel programlamanın temel kavramlarını tanıtmaya devam edeceğim.

CEVABINI YAZ

Lütfen yorumunuzu yazınız!
Lütfen isminizi buraya giriniz