Photo by Henry Be on Unsplash

JS ILE FONKSIYONEL PROGRAMLAMA

Factory Functions — 1(Obje Üretim Fonksiyonları)

JavaScript’de class , constructor, new kullanmadan obje üretmeye odaklanmış fonksiyonlara Factory Functions deniyor.

Yine Eric Eliott Composing Software kitabından devam ediyoruz. Yukarıda da belirttiğim gibi Class, new ve constructor kullanmadan yeni nesne oluşturan fonksiyonlara Factory Functions denir.

Bu konuda daha önceden yazmış olduğum yazılardan alıntılar yaparak konuyu anlatmaya çalışacağım. Obje üretmek ve bunları yönetmek her dilde en büyük problemlerden bir tanesidir. Bu konuda OOP(Nesne Tabanlı Programlada) Tasarım Örüntülerinin Creational Pattern amacı new yönetmek üzerinedir.

Bunun yanında JS üretim olayını daha dinamik ve basit yaklaşabildiği için karmaşık nesneleri üretebilmek çok daha kısa adımda gerçekleşebilmektedir. Object neden önemlidir.

JavaScript Veri Türlerinde Object Types büyük bir yer oluşturduğunu daha önceki yazılarımızda anlatmıştım.

JavaScript Veri Türleri

Ve bu objeleri oluşturmak için Object içerisinde key , value değerlerinde value → obje/array/primitif type olabilecek şekilde iç içe object yapıları oluşturabilir.

Örneğin aşağıdaki Address objesinde olduğu gibi. Bu sayede çok karmaşık obje tanımlamarı yapabilirsiniz.

Adress Objesi

JavaScript nesne oluşturma avantajı ise dilin bunu JSON nesnesi gibi tanımlamayı izin vermesinden gelir. Örneğin aşağıda bir tane address nesnesini oluşturduk.

const address = {
  street: 'Main',
  number: 100,
  Apartment: {
    Floor:3,
    Number:301
  } 
};

1. Obje Tanımlama

Boş bir obje tanımlayalım.

const emptyObject={};

Aşağıdaki objemisin içerisine isim ve yas değişken olarak tutmak isteyelim. Daha nesneyi tanımlarken JSON şeklinde tanımlayabiliriz.

const onurObj={isim:”onur”, yas:12};

veya boş bir obje oluşturup ona .degiskenIsmi ile değişken değerlerimizi atayabiliriz.

const onurObj2={}
onurObj.isim=”Onur”
onurObj.yas=39

veya bir map objesi gibi [“degiskenIsmi”] erişerek atama yaparız.

const onurObj={}
onurObj[“isim”]=”Onur”
onurObj[“yas”]=39

Eğer amacımız tek bir obje oluşturup bunu kullanmak ise yukarıda bahsettiğimiz yöntemler oldukça kullanışlıdır. Fakat amacınız bunun gibi bir çok benzer obje oluşturmak ise örneğin ali, veli, ahmet, ayşe vb.. alt alta bu kodları tekrar tekrar kopyalamamız anlamına gelirki bu istediğimiz bir şey değildir. burda aklımıza bu nesneleri soyutlayacak bir Function Constructor oluşturabiliriz

Aşağıdaki örnekte kullanıcı(User) olarak bir fonksiyon yazıyorum ve bu fonksiyon parametrelerinde değişkenleri alıyor. Bu soyutlama sayesinde kod tekrarından kurtuluyoruz.

function User(name,age){
    let user={};
    user.name=name;  
    user.age=age;
    return user;
}
const onurObj=User("Onur",39);

Bizim burda aynı sınıflarda olduğu gibi nesne oluşturmayı ve bu nesnenin fonksiyonlarının olmasını dahi Factory Functions ile gerçekleştirebilirsiniz.

createUser fonksiyonu.. (Kaynak Kod)

Ekstra Not: Arrow fonksiyonun çevresinde () parantez olması içerdeki logic çalışarak return etmesini sağlar. Bunu çağırmadığınız taktirde degeriniz undefined olacaktır. Aşağıdaki resimde bunun çalıştırıldığı örneği görebilirsiniz.

Arrow Functions (Kaynak kod)

2. Destructuring İşlemleri

Aynı Obje ve Array tanımlamada kullandığımız kısımları tanımlamanın sağ kısmında değilde , sol kısmında kullanırsak yaptığımız obje ve array bozabiliriz yani oluşturma parçalarına kolayca erişebiliriz.

Obje Destructuring İşlemi

obj={name:'onur', age:'40'};
const{name,age}=obj //Destructuring

Array Destructuring İşlemi

colors=[‘red’,’green’,’blue’];
let [val1,val2,val3]=colors //>> let val1=colors[0] ...

3. Default Parameters

Javascript geçirilen değerlerin her zaman undefined olup olmamasını kontrol etmek ve buna default değerler atamak yaptığımız if kontrolleri vardır. Bu tip durumlarda Default Parameters sizin kodunuzu daha güzel ve okunabilir hale getirir.

//Without Default Parameter
function ekle(arr,val){
   if(arr===undefined) arr=[];
   arr.push(val);
   return arr;
}//With Default Parameter
function ekle(arr=[],val){
   arr.push(val);
   return arr;
}

Bazen değişken ilk aşamada bir default değer atanıp daha sonra içerisinde geçirilen değişkenlerden bu değer oluşacağı durumlar olabilir. Örneğin Redux store bu tip durumlar için store default değerleri default parameter olarak fonksiyona geçirilir. Aşağıdaki toplama işleminde undefined değer geçtiğimizde bunları default parametrelerden kullandığını görebilirsiniz.

function sum(a=10, b=2){
   return a+b;
}sum (2,2) //4
sum ()    //12
sum (3)   //5

Son olarak aşağıdaki örnekte sadece değer geçilmediği ve undefined geçildiği durumda default parameter çalıştığını görebilirsiniz. Diğer falsy değerler için bu durum geçerli değildir.

function test(num = 1) {
  console.log(typeof num);
}
test();          // 'number' 1
test(undefined); // 'number' 1
test('');        // 'string' ''

4. …Rest Kullanmak

Sadece belli değişkenlerle uğraşıp diğer kalanları rest içerisine atmak isteyebilirsiniz. Obje örneği

const props={name:'Deniz',surname:'Dayibasi',other:{age:8, height:128} }
const {name,...rest}=props;
console.log(rest)

Array örneği

const colors=[‘red’,’green’,’blue’];
let [val1,…rest]=colors
console.log(rest) //green , blue

Referanslar

• Factory Functions

Okumaya Devam Et 😃

Bu yazının devamı veya yazı grubundaki diğer yazılara erişmek için bu linke tıklayabilirsiniz.