ES6+ İle Değişen Kullanımı: JavaScript dilindeki yeni özelliklerle yazım biçiminiz değişebilir Daha anlaşılır ve düzenli kodlar yazmak için ES6+ özelliklerine göz atmalısınız Hemen inceleyin!

Destructuring Assignment, JavaScript'in ES6 (ECMAScript 2015) sürümünde tanıtılan bir özelliktir. Bu özellikle birlikte, nesne veya dizi içindeki özelliklere veya elemanlara tek bir satır kod kullanarak erişebiliriz. Bu da kod yazarken zaman kazandırır ve daha açıklayıcı bir kod yazmamızı sağlar.

Destructuring Object kullanımında, nesnenin özellikleri farklı değişkenlere atanırken süslü parantezler ({}) içinde belirtilir. Ayrıca kullanılan değişkenlerin, özelliğin sahip olduğu isim ile aynı olması önemlidir. Örnek olarak:

const obj = { name: "John", age: 30 };const { name, age } = obj;

Bu şekilde name ve age değişkenleri, obj nesnesinin ilgili özelliklerine atandı.

Destructuring Array kullanımında ise, köşeli parantezler ([]) içinde belirtilen değişkenlere elemanların sırayla atanır. Örnek olarak:

const arr = [1, 2, 3];const [a, b, c] = arr;

Burada a, b ve c değişkenleri, arr dizisinin ilk, ikinci ve üçüncü elemanlarına sırasıyla atanmış oldu.

Destructuring Object

Destructuring Assignment, ES6+ ile birlikte gelen bir özelliktir ve özellikle fonksiyonlarda kullanılmaktadır. Destructing, bir yapıyı parçalara ayırıp, her bir parça için ayrı bir isim oluşturarak kullanmamızı sağlamaktadır. Bu özellik ile birlikte, kodlar daha hızlı ve daha okunaklı hale getirilebilmektedir.

Destructuring Object, obje içindeki özelliklere erişirken kullanılmaktadır. Bu özellik ile birlikte, obje içindeki özellikleri kolaylıkla erişebilmekteyiz. Örneğin:

Yukarıdaki örnekte, obje içindeki name ve age özelliklerine ayrı bir isim oluşturarak değişkenlere atamaktayız. Bu şekilde, obje içindeki her özelliği tek tek çağırmak yerine, aynı anda çoklu özelliklere erişebilmekteyiz.

Destructuring Array

Destructuring Assignment, JavaScript'te kodlama yaparken veri yapılarından istediğimiz değerlere kolayca erişebilmek için kullanılan bir yöntemdir. Bu yöntem ile obje ve array yapısındaki verileri daha okunaklı ve anlaşılır şekilde kullanabiliriz.

Destructuring Array, array yapısındaki elemanlara erişmek için kullanılır. Bu yöntem ile bir array'deki elemanları yeni değişkenlere atayabiliriz. Örneğin, aşağıdaki kodda bir array içindeki sayıları değişkenlere atamaktadır:

let numbers = [1, 2, 3];let [a, b, c] = numbers;console.log(a); // 1console.log(b); // 2console.log(c); // 3

123

Yukarıdaki örnekte, numbers array'i içindeki elemanlar a, b ve c değişkenlerine sırasıyla eşitleniyor. Bu sayede, a, b ve c değişkenleri diğer yerlerde kullanılamak üzere ayrılmış oluyor.

Array içindeki elemanların bir kısmını kullanmak istiyorsak, diğer elemanları atlamak için boşluk bırakabiliriz. Örneğin, aşağıdaki kodda ilk elemanı almak için sadece ilk değişken atanmıştır:

let numbers = [1, 2, 3];let [a] = numbers;console.log(a); // 1

1

Destructuring Array yöntemi, obje yapısındaki özelliklere de benzer şekilde uygulanabilir.

ES6+'da yer alan Rest Parameters, bir fonksiyona girdiği zaman, fonksiyona verilen parametreleri çeşitli türlerinin dışında bir dizi şeklinde toplayan bir javascript özelliğidir. Rest Parameters parametrelerin sonsuz sayıda olması durumunda fonksiyondan yararlanmamıza yardımcı olur.

Rest Parameters kullanarak, farklı türlerdeki verileri tek bir yerde toplamak mümkündür ve bu veriler bir dizi olarak saklanabilir. Bu özellik sayesinde, kullanıcının verileri daha düzenli ve okunaklı hale getirmesi kolaylaşır. Rest Parameters özelliği JavaScript’te birçok yerde kullanılabilir. Özellikle fonksiyonlarda sıklıkla kullanılmaktadır. Jim Palmer’in belirttiği gibi, “Rest Parameters, array’lerin ve object’lerin kullanımını genişletir. Ayrıca, parametreleri sıradan array’ler gibi kullanarak daha da fazla bilgiye sahip olmanızı sağlar.”

Rest Parameters Kullanımı

Rest parameter, fonksiyonlarda birden fazla argümanın toplanmasını sağlayan bir özelliktir. Bu özellik sayesinde fonksiyonlara istenilen sayıda argüman gönderilebilir.

Rest parameter kullanımı basittir, fonksiyon parametrelerinin sonuna noktalı üçlü (...) eklenir. Bu işaretlediğimiz parametreler, fonksiyon içinde bir dizi haline dönüştürülür ve "arguments" nesnesinde toplanır. Rest parameter kullanarak fonksiyonlarda aşağıdaki gibi parametreler toplanabilir:

• Fonksiyonu çeşitli seçeneklerle kullanılabilir hale getirmek
• Nokta atışı yapan bir fonksiyon yazmak için de kullanabilirsiniz.

        function fonksiyonum(...args) {          return args;        }                console.log(fonksiyonum(1));        console.log(fonksiyonum(1, 2));        console.log(fonksiyonum(1, 2, 3));      

        [1]        [1, 2]        [1, 2, 3]      

Bu örnekte, fonksiyonun sonuna noktalı üçlü (...) ile işaretlenmiş bir argüman girildiğinde, fonksiyon içindeki parametreler bir dizi halinde "args" adlı bir değişkene atandı ve sonrasında bu değişken "console.log" fonksiyonuna gönderilerek ekrana yazdırıldı.

Rest Parameters ve Destructing Assignment Kullanımı

    function sumPositiveNumbers(...numbers){      let sum = 0;      for(let {number} of numbers){        if(number > 0){          sum += number;        }      }      return sum;    }  

ES6+ ile birlikte JavaScript dilindeki değişikliklerin birçoğu, Destructuring Assignment ve Rest Parameters gibi özelliklere entegre edildi. Bu özellikler, obje ve array'ler içindeki özelliklere ve elemanlara daha kolay erişim sağlamak için kullanılabiliyor. Ayrıca fonksiyonların parametrelerine Rest Parameters eklenerek, esnekliği artırılabiliyor.

ES6+ ile birlikte gelen en büyük değişikliklerden biri, obje literalleri oluyor. Bu değişiklik sayesinde, obje literallerinde, obje içindeki özelliklerin isimleri ile değişkenler tanımlanabiliyor. Bu şekilde, objelerin daha kolay şekilde oluşturulabilmesi ve anlaşılabilmesi sağlanmış oluyor. Örneğin:```JavaScriptconst name = 'John';const age = 30;

//ES5const obj = { name: name, age: age}

//ES6+const obj = { name, age}```Bu obje literalleri, kodun daha okunaklı olmasına yardımcı oluyor ve gereksiz açıklamaların yapılmamasını sağlıyor.

Fonksiyonlar konusunda da birçok değişiklik yapıldı. Artık, fonksiyon parametrelerine Rest Parameters eklenebiliyor. Bu sayede, fonksiyonlar değişik boyutlardaki parametreleri kabul edebiliyor. Ayrıca objeler ve array'ler içindeki özelliklere ve elemanlara erişmek için Destructuring Assignment kullanabilirsiniz. Destructuring Assignment ile objeler için aşağıdaki gibi bir kullanım yapabilirsiniz:```JavaScriptconst obj = {name: 'John', age: 30};

//ES5const name = obj.name;const age = obj.age;

//ES6+const {name, age} = obj;```Bu özellikler sayesinde, JavaScript dilindeki kodlama süreci daha kolay ve okunaklı hale gelmiştir.

Object Literallerde Kullanımı

ES6+ ile birlikte Object Literaller kullanımında önemli değişiklikler yapılmıştır. Önceden objeler oluşturulurken, obje özellikleri tanımlanır ve objeye atanırdı. Ancak artık yeni özellikler ve yöntemler eklenerek objelerin daha kolay bir şekilde oluşturulması sağlanmıştır.

ES6+ kullanımında objeler artık daha kısa bir şekilde oluşturulurken, obje özellikleri daha anlaşılır bir şekilde tanımlanabilir. Bunun için önceden objelerin key ve value olarak ayırımı gerekiyordu. Ancak şimdi key isimlerine direk olarak değişken isimleri atanabiliyor. Yani key isimleri ayrı bir değişken tanımlamasına gerek kalmadan direk olarak değişkenlerle tanımlanabiliyor.

Örneğin;

```let firstName = "John";let lastName = "Doe";let age = 30;

const person = { firstName, lastName, age };console.log(person); // output: {firstName: 'John', lastName: 'Doe', age: 30}```

Burada objenin özellikleri olan firstName, lastName ve age direk olarak değişkenlerle tanımlanmıştır. Bu sayede kod daha temiz ve anlaşılır hale gelmiştir.

Ayrıca, objelerin içindeki fonksiyonların tanımlanması için de kullanılan yöntemler de değişmiştir. Önceden objelerin özellikleri arasına fonksiyonlar yazılıyordu. Ancak ES6+ ile birlikte obje özelliklerinin içindeki fonksiyonların kısaltılmış bir şekilde tanımlanmasına izin veren arrow fonksiyonları kullanılabiliyor.

Örneğin;

```const person = { firstName: "John", lastName: "Doe", fullName: () => { return `${this.firstName} ${this.lastName}`; },};console.log(person.fullName()); // output: undefined undefined```

Burada fullName özelliği arrow fonksiyonu ile tanımlanmıştır. Ancak arrow fonksiyonu içinde this kullanımı objeyi göstermeyecektir. Bu sebepten dolayı fullName özelliği undefined undefined şeklinde çıktı veriyor.

ES6+ ile birlikte objelerin oluşturulması daha kolay, anlaşılır ve kısa hale getirilmiş olduğundan, bu kullanımın yaygınlaşması beklenmektedir.

Rest Parameters ve Destructuring Assignment İle Fonksiyonlarda Kullanımı

Rest parameter ve destructuring assignment'in tek başına kullanımlarından sonra birlikte kullanımları da oldukça yararlıdır. Fonksiyonlarda kullanıldığında daha da özelliğini gösterir.

Öncelikle rest parameters kullanımı hatırlatmak gerekirse, bir fonksiyona sınırsız sayıda argüman gönderilmesine olanak sağlar. Örneğin:

function sumAll(...args) {  let sum = 0;
  for (let arg of args) {    sum += arg;  }
  return sum;}
console.log(sumAll(1, 2, 3)); // 6

Yukarıdaki örnekte görüldüğü gibi, fonksiyonun parametrelerinde '...' yazarak rest parameter kullanımı yapabiliyoruz. Bu sayede fonksiyona kaç tane argüman gönderirsek gönderelim hepsini tek bir değişkende topluyoruz.

Bunun yanında destructuring assignment de bir objeden ya da arrayden tek seferde birden fazla değişken tanımlamamıza olanak sağlar. Rest parameter ile birlikte kullanıldığında fonksiyonların daha modüler olmasını sağlayabiliriz.

Örnek olarak:

function getInfo({name, age, city}, ...args) {  console.log(`Name: ${name}`);  console.log(`Age: ${age}`);  console.log(`City: ${city}`);  console.log(`Other args: ${args}`);}
const user = {  name: "John",  age: 30,  city: "New York"}
getInfo(user, "likes hiking", "loves pizza", "plays guitar");

Yukarıdaki örnekte getInfo fonksiyonunda destructuring assignment kullanarak objenin name, age ve city özelliklerini tek seferde tanımlıyoruz. Sonrasında rest parameter ile diğer argümanların fonksiyona gönderilmesi sağlanıyor.

Bu sayede fonksiyonumuz daha temiz ve anlaşılır bir hale geliyor. Rest parameter ve destructuring assignment'in birlikte kullanımı, özellikle büyük projelerde kod kalitesi ve okunabilirliği arttırabilecek bir özelliktir.