Modern JavaScript•12 dk•Temel

Modern Değişkenler, Arrow Fonksiyonlar ve Destructuring

Ders Konusu & Temel Mantık

ES6+ standartları, JavaScript kodlarının daha okunabilir, hatasız ve performanslı yazılmasını sağlar. const/let blok kapsamı, arrow fonksiyon bağlamı ve nesne parçalama geliştirme standardıdır.

Değişken tanımlarken var anahtar kelimesi fonksiyon kapsamlı (function scope) olduğu için beklenmeyen hoisting hatalarına yol açabilir. Bunun yerine blok kapsamlı (block scope) olan let ve const tercih edilmelidir.

Nesnelerden ve dizilerden veri çekerken tek tek eşitleme yapmak yerine Destructuring syntax'ı kullanarak temiz ve tek satırda atama yapabilirsiniz.

Uygulamalı Kod Örneği

modern-syntax.js

// Modern Nesne Yapı Bozma (Destructuring) ve Spread Örneği
const developer = {
  id: "YH-402",
  name: "Muhammet",
  role: "Full-Stack Dev",
  skills: ["Vue", "TypeScript", "Node.js"]
};

// Yapı bozma ile doğrudan alanları çıkartma
const { name, role, skills } = developer;
console.log(`Geliştirici: ${name}, Görev: ${role}`);

// Spread operatörü ile yeni yetenekler ekleyip diziyi klonlama
const updatedSkills = [...skills, "Nuxt 3", "Docker"];
console.log("Güncel Yetenekler:", updatedSkills);

Terminal Çıktısınode / bash

$node modern-syntax.js

Geliştirici: Muhammet, Görev: Full-Stack Dev
Güncel Yetenekler: [ 'Vue', 'TypeScript', 'Node.js', 'Nuxt 3', 'Docker' ]

Mühendislik Standartı

Asla değişmeyeceğinden emin olduğun tüm referanslar için const kullan. Sadece değeri yeniden atanacak değişkenlerde let tercih et.

Uygulamalı Görev

İki farklı nesneyi (örneğin user ve preferences) spread operatörü kullanarak tek bir config nesnesinde birleştirin.