ES6+ ile Gelen Object Literal Yöntemleri yazımızda JavaScript'in bir sonraki versiyonunda kullanılan en yeni obje yöntemlerini öğreneceksiniz Arrow function, template literals gibi özellikler ile daha okunaklı ve kısa kodlar yazabileceksiniz Yazımıza göz atın ve kendinizi geliştirin!
ES6+ ile birlikte JavaScript diline yeni ve gelişmiş özellikler eklenmiştir. Bu özelliklerden biri de nesne oluşturma yöntemlerindeki yeniliklerdir. Object literal yöntemleri, özellik ve metotların daha kısa yollarla tanımlanabilmesi ve spread işleci ile nesne birleştirme gibi farklı özelliklerle birlikte gelmektedir. Bu yazıda ES6+ ile birlikte gelen nesne oluşturma yöntemleri ayrıntılı bir şekilde anlatılmaktadır.
Yazılım geliştirme sürecinde nesneler çok önemlidir. Nesneler, verileri tutmak ve işlemler gerçekleştirmek için çok kullanışlıdır. ES6+ ile birlikte JavaScript dilinde nesne oluşturma yöntemleri daha kısa ve daha anlaşılır hale getirilmiştir. Bu yeni özellikler sayesinde nesne oluşturma süreci daha hızlı ve kolay hale gelmiştir.
Özellikleri Tanımlamak İçin Kısa Yollar
ES6+ ile birlikte nesne oluşturma yöntemlerine yeni özellikler eklenmiştir. Bu özellikler sayesinde geleneksel olarak nesne oluşturma yöntemlerinde kullanılan uzun yollar, daha kısa yollarla tanımlanabilir hale gelmiştir. Bu sayede kod yazımı daha hızlı ve kolay hale gelirken, okunabilirliği de arttırılmıştır.
Bu yöntemlerden biri ise özellikleri tanımlamak için kullanılan kısa yollardır. Özellikleri tanımlarken artık iki parçalı bir yapı yerine tek bir parça halinde tanımlama yapabiliriz. Örneğin, bir özellik adı belirleyip iki nokta üst üste koymak ve ardından özelliğin değerini belirlemek yerine, belirleyici-bloklar kullanarak özelliği daha kısa bir şekilde tanımlayabiliriz.
| Eski Yöntem | Yeni Yöntem |
var person = { firstName : 'John', lastName : 'Doe' }; | var firstName = 'John'; var lastName = 'Doe'; var person = { firstName, lastName }; |
Yukarıdaki örnekte görüldüğü gibi, eski yöntemde bir nesne oluşturmak için özellikleri tek tek belirliyorduk. Ancak yeni yönteme geçtiğimizde daha az kod yazarak aynı nesneyi oluşturuyoruz. Bu sayede kod yazımı daha hızlı ve kolay hale gelirken, okunabilirliği de arttırılmıştır.
Metotları Tanımlamak İçin Kısa Yollar
ES6+ ile birlikte gelen object literal yöntemleri ile birlikte nesne oluşturma işlemleri daha da kolaylaştı. Nesnelerin oluşturulması sırasında daha kısa yollar kullanılarak özellikler ve metotlar tanımlanabiliyor. Bu yazımızda "Metotları Tanımlamak İçin Kısa Yollar" konusuna odaklanacağız.
Nesne oluştururken metotların daha kısa yollarla tanımlanabilmesi sayesinde bu işlem daha da kolay hale geldi. Artık, metotların tanımlanması sırasında function kelimesi kullanılmadan doğrudan fonksiyon tanımlaması yapılabilir. Örneğin:
| ES5 | ES6+ |
|---|---|
var person = { name: "John", age: 30, sayHello: function() { console.log("Hello"); }}; | const person = { name: "John", age: 30, sayHello() { console.log("Hello"); }}; |
Görüldüğü gibi, ES6+ ile birlikte artık fonksiyon tanımlaması daha kısa ve okunaklı hale geldi. Metot çağrıları ise aynı şekilde yapılabiliyor:
| ES5 | ES6+ |
|---|---|
var person = { name: "John", age: 30, sayHello: function() { console.log("Hello " + this.name); }};person.sayHello(); // Hello John | const person = { name: "John", age: 30, sayHello() { console.log(`Hello ${this.name}`); }};person.sayHello(); // Hello John |
Bu özellik sayesinde, object literal yöntemleri daha da kullanışlı hale geldi. Nesnelerin yönetimi daha kolay ve okunaklı hale geldi.
Bilgi ve Yöntemleri Bir Arada Kullanmak
ES6+ ile birlikte nesne oluşturma yöntemleri değişti ve artık daha kısa yollar kullanılabiliyor. Özellikleri ve metotları bir arada kullanmak da daha pratik hale geldi. Eskiden her bir özellik için ayrı bir satır yazmak gerekiyordu ancak artık özellikler ve metotlar tek satırda tanımlanabiliyor. Bu yöntem, özellikle büyük ve karmaşık nesnelerde işleri kolaylaştırmakta.
Birbirinden bağımsız olarak tanımlanan bilgiler, artık bir arada kullanılabiliyor. Bu özellik ile nesne oluştururken özellikleri ve metotları bir arada kullanmak çok daha kolay. Yeni özelliklerin nesne içerisine eklenmesi ve metotları çağırmak çok daha kolay hale geldi. Bu da geliştirme sürecinde çok daha fazla zaman kazanılmasına olanak sağlıyor.
Computed Property Names
ES6+ ile birlikte gelen yeni bir nesne oluşturma yöntemi olan Computed Property Names, özellik isimlerinin dinamik olarak oluşturulabilmesine imkan tanımaktadır. Bu özellik sayesinde, nesne oluştururken özellik isimleri değişken olarak tanımlanabilir ve nesnenin oluşturulması sırasında bu değişkenler özellik isimlerine dönüştürülür.
Örneğin, bir nesne oluştururken özelleştirilebilir bir özellik ismi kullanmak istediğinizde Computed Property Names özelliği sizin için ideal bir seçenektir. Örneğin, aşağıdaki şekilde bir nesne oluşturulabilir:
```jslet prefix = "user_";
let user = { [prefix + "name"]: "John", [prefix + "age"]: 30};
console.log(user.user_name); // "John"console.log(user.user_age); // 30```
Bu örnekte, nesne oluşturulurken özellik isimleri dinamik olarak belirlenmiştir. `prefix` değişkeni, özellik isimlerine eklenecek önek olarak kullanılmıştır. Computed Property Names özelliği, özellik isimlerinin değişkenlerden dinamik olarak oluşturulmasına izin verir ve bu sayede kodun daha okunaklı ve yeniden kullanılabilir hale gelmesine yardımcı olur.
Computed Property Names özelliği, aynı zamanda dinamik olarak oluşturulan özelliklerin kopyalanması veya bir başka nesneye atanması için de kullanılabilir. Bu durumda, Object.assign() yöntemi kullanılarak nesne özellikleri kopyalanabilir:
```jslet source = { name: "John", age: 30 };let target = {};let prefix = "user_";
Object.assign(target, { [prefix + source.name]: source.age});
console.log(target); // { user_John: 30 }```
Bu örnekte, Computed Property Names özelliği ile `prefix` değişkeni ve `source.name` birleştirilerek özellik ismi olarak kullanılmıştır. Nesne özelliğine atanacak değer ise `source.age` olarak belirlenmiştir. Sonuç olarak, yeni oluşturulan nesnenin `user_John` özelliği, `source.age` değeriyle eşleştirilmiştir.
Method Properties
ES6+ ile birlikte gelen Method Properties özelliği, metotların daha kısa yollarla oluşturulmasını sağlar. Eski yöntemde nesne oluşturulduktan sonra metot tekrar tanımlanmalıydı. Ancak yeni yöntemde, metotlar direkt olarak nesne oluşturulurken tanımlanabiliyor.
Örneğin, eski yöntemde nesne oluşturulurken:
```let person = { name: 'John', age: 30, sayHello: function() { console.log('Hello!'); }};```
Yeni yöntemde ise:
```let person = { name: 'John', age: 30, sayHello() { console.log('Hello!'); }};```
Yukarıdaki örnekte, sayHello metodu eski yöntemde bir fonksiyon olarak tanımlanmıştı. Ancak yeni yöntemde sayHello metodu daha kısa bir şekilde yazılabilir ve direkt olarak nesne oluşturulurken tanımlanabilir.
Method Properties özelliği, özellikleri tanımlama yöntemiyle de birleştirilebilir. Örneğin:
```let person = { name: 'John', age: 30, sayHello() { console.log('Hello ' + this.name + '!'); }, ['say' + 'Age']() { console.log('My age is ' + this.age + '.'); }};```
Yukarıdaki örnekte, computed property names ile birlikte Method Properties kullanılarak 'sayAge' adında bir metot oluşturulmuştur. Bu yöntemle, metotların ve özelliklerin oluşturulması daha kolay ve hızlı hale gelmiştir.
Overall, Method Properties özelliği ile birlikte, metotların daha kısa yollarla oluşturulması sağlanmaktadır ve bu da kod yazma sürecini daha efektif hale getirmektedir.
Spread İşleci İle Nesne Birleştirme
ES6+ ile birlikte gelen yeni özelliklerden biri de Spread işleci ile nesne birleştirme yöntemidir. Bu yöntem sayesinde, farklı nesnelerin özellikleri bir arada kullanılabilmektedir. Spread işleci, üç nokta işareti (...) ile ifade edilir.
Örneğin, iki nesnenin özellikleri birleştirilmek istendiğinde, şu şekilde kullanılabilir:
| Örnek Kullanım | Sonuç |
|---|---|
| let obj1 = {a: 1, b: 2}; | |
| let obj2 = {c: 3, d: 4}; | |
| let obj3 = {...obj1, ...obj2}; | {a: 1, b: 2, c: 3, d: 4} |
Bu örnekte, obj1 ve obj2 nesneleri, obj3 nesnesine spread işleci kullanılarak birleştirildi. Sonuç olarak, obj3 nesnesi a:1, b:2, c:3 ve d:4 özelliklerine sahip oldu.
Spread işleci aynı zamanda dizi veri tiplerinde de kullanılabilir. Bu sayede, farklı dizilerin elemanları bir arada kullanılabilir ya da yeni bir dizi oluşturmak için kullanılabilir.
- Örneğin: let array1 = [1, 2, 3];
- let array2 = [4, 5, 6];
- let array3 = [...array1, ...array2];
- Sonuç: [1, 2, 3, 4, 5, 6]
Spread işleci ile nesne birleştirme yöntemi, nesne ve dizi veri tiplerinde kullanılarak kod yazımını daha hızlı ve pratik hale getirmektedir. Bu özellik, ES6+ ile birlikte gelen yeniliklerden biridir ve modern JavaScript uygulamalarında yaygın olarak kullanılmaktadır.
Object.create Metodu
ES6+ ile birlikte gelen yeni nesne oluşturma yöntemlerinden biri de Object.create metodu. Bu yöntem sayesinde, var olan bir nesnenin prototipi kullanılarak yeni bir nesne oluşturulabilir. Object.create metodu, özellikle kalıtım işleminin daha iyi yönetilebilmesi için kullanışlı bir yöntemdir.
Object.create metodu, iki adet parametre alır. İlk parametre, oluşturulacak nesnenin prototipi olan bir nesnedir. İkinci parametre ise, yeni nesnenin özellikleri ve değerlerinin tanımlandığı bir objedir. Bu şekilde, yeni nesne oluşturulurken hem prototip hem de özellikler bir arada kullanılabilir.
Örneğin, bir hayvan nesnesi oluşturalım ve bu nesnenin prototipi olarak Animal nesnesini kullanalım. Bu nesnenin özellikleri ise tür, yaş ve renk olsun. Kodumuz şu şekilde olabilir:
```javascriptconst Animal = { tür: '', yaş: 0, renk: ''};
const hayvan = Object.create(Animal, { tür: { value: 'kedi' }, yaş: { value: 3 }, renk: { value: 'beyaz' }});
console.log(hayvan);```
Bu kodda, Animal isimli bir prototip nesnesi oluşturduk ve hayvan isimli yeni bir nesne oluştururken bu prototipi kullandık. Ayrıca, hayvan nesnesine tür, yaş ve renk özellikleri de verdik ve değerlerini tanımladık.
Sonuç olarak, Object.create metodu sayesinde yeni nesneler oluştururken prototiple olan ilişkileri daha rahat yönetebiliriz. Ayrıca özellikleri ve değerleri bir arada tanımlayabilmek de oldukça kullanışlıdır.
Prototiple Oluşan İlişki
ES6+ ile gelen yeni bir nesne oluşturma yöntemi olan Object.create metodu, nesnelerin prototip tabanlı kalıtımını destekler. Bu yöntem ile bir örnek nesne üzerinde değişiklik yapılırsa, bu değişiklik nesne prototipi üzerinde yapılır. Object.create metodu, nesne özelliklerini kopyalayarak yeni bir nesne oluşturmak yerine, nesne prototipine dayalı olarak yeni bir nesne oluşturur. Bu şekilde, nesne prototipi üzerinde yapılan değişiklikler ve yenilikler diğer tüm nesne örneklerine de uygulanabilir.
Bu yöntemin en büyük faydası, birden fazla nesne örneği oluşturmak isteyen geliştiriciler için tasarruf sağlamasıdır. Nesne özelliklerinin birbirinin aynısı olduğu farklı nesne örneklerini oluşturmak için her seferinde aynı özellikleri tekrar etmek yerine, tek bir kalıp nesne oluşturulabilir ve diğer nesneler bu kalıp nesneden türetilir. Bu sayede, kod tekrarından kaçınmak mümkün olur ve zamandan büyük tasarruf sağlanır.
Object.create metodu ayrıca nesne özelliklerinin ve fonksiyonlarının ayrı ayrı tanımlanmasını sağlar. Bu sayede daha okunaklı bir kod yazmak mümkün hale gelir. Özellikle büyük ve karmaşık nesneler oluşturulurken, nesne özellikleri ve metotları açıkça belirtildiğinde, kodun anlaşılması ve geliştirilmesi daha kolay hale gelir.
Object.assign Metodu
ES6+ ile birlikte gelen Object.assign() metodu, nesneler arasında özelliklerin kopyalanmasını sağlar. Bu yöntem, bir veya daha fazla kaynak nesnesinden hedef nesneye özellikleri ekler.
Özelliklerin kopyalanması, kaynak nesne üzerinde gerçekleştirilen değişikliklerin hedef nesneyi etkilemesi anlamına gelir. Eğer kaynak nesnede bir özellik varsa ve aynı isimde bir özellik hedef nesnede de varsa, sonradan eklenen özellik, mevcut olanı üzerine yazar.
Object.assign() metodu çağrıldığında, ilk parametre hedef nesne olacak şekilde belirlenir. Daha sonra, kaynak nesnelerin değişkenleri sırayla gönderilebilir. Birden fazla kaynak nesne kullanıyorsanız, öncelikli olan nesneler hangi sırayla gönderildiğine göre belirlenir.
Aşağıdaki örnek, Object.assign() metodu kullanarak bir örnek nesnesine diğer iki nesnenin özelliklerini kopyalıyor:
```javascriptlet hedefNesne = { ad: "Ahmet" };let kaynakNesne1 = { soyad: "Yılmaz" };let kaynakNesne2 = { yaş: 25 };
Object.assign(hedefNesne, kaynakNesne1, kaynakNesne2);
console.log(hedefNesne); // { ad: "Ahmet", soyad: "Yılmaz", yaş: 25 }```
Object.assign() metodu ayrıca, bir özelliğin kaynak nesnede var olmaması durumunda, hedef nesneye eklenmesini sağlar. Ayrıca, kaynak nesne null veya undefined ise, bir hata fırlatmadan devam eder.
Sonuç olarak, Object.assign() metodu, özellikleri nesneler arasında kolayca kopyalamanın en yaygın ve kullanışlı yolu olarak bilinir. Bu metodun kullanımı, web geliştirme sürecinde büyük kolaylık sağlar ve daha az kod yazarak daha fazla işlem yapabilmenizi sağlar.