JavaScript Ders 9 – Modern JavaScript (ES6+)

let ve const Anahtar Kelimeleri

  • var’dan Farkı: let ve const, blok kapsamlıdır (block-scoped), yani tanımlandıkları bloğun içinde geçerlidirler. var ise fonksiyon kapsamlıdır.
  • let: Değeri değiştirilebilir değişkenleri tanımlamak için kullanılır.
  • const: Sabit değerleri tanımlamak için kullanılır. Atandıktan sonra değeri değiştirilemez (ancak nesnelerin içindeki özellikler değiştirilebilir).

Arrow Fonksiyonları (ES6)

Sözdizimi: Daha kısa ve okunabilir bir fonksiyon sözdizimidir.

JavaScript
// Geleneksel fonksiyon
function toplama(a, b) {
  return a + b;
}

// Arrow fonksiyonu
const toplamaArrow = (a, b) => a + b;

this Bağlamı: Arrow fonksiyonları kendi this bağlamına sahip değildirler. Üst kapsamdaki this değerini kullanırlar.

Template Literal’lar (ES6)

Sözdizimi: Stringleri daha kolay bir şekilde oluşturmak için kullanılır. Değişkenleri doğrudan string içine gömme imkanı sağlar.

JavaScript
let ad = "Ali";
let soyad = "Yılmaz";

// Geleneksel yöntem
let mesaj = "Benim adım " + ad + " " + soyad;

// Template literal
let mesajTemplate = `Benim adım ${ad} ${soyad}`;

Destructuring Atama (ES6)

Amaç: Dizilerden veya nesnelerden değerleri daha kolay bir şekilde çıkarmak için kullanılır.

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

// Nesne destructuring
let { ad, soyad } = { ad: "Ali", soyad: "Yılmaz" };
console.log(ad, soyad); // Ali, Yılmaz

Spread Operatörü (…) (ES6)

Kullanım Alanları:

  • Dizileri birleştirmek:
JavaScript
let dizi1 = [1, 2];
let dizi2 = [3, 4];
let birlestirilmisDizi = [...dizi1, ...dizi2]; // [1, 2, 3, 4]
  • Fonksiyon argümanlarını genişletmek:
JavaScript
function toplama(a, b, c) {
  return a + b + c;
}

let sayilar = [1, 2, 3];
console.log(toplama(...sayilar)); // 6
  • Nesne kopyalamak:
JavaScript
let ogrenci = { ad: "Ali", yas: 20 };
let yeniOgrenci = { ...ogrenci, soyad: "Yılmaz" };

Rest Parametreleri (ES6)

Amaç: Fonksiyon argümanlarını bir diziye toplamak için kullanılır.

JavaScript
function toplam(a, b, ...geriKalan) {
  let toplam = a + b;
  for (let i = 0; i < geriKalan.length; i++) {
    toplam += geriKalan[i];
  }
  return toplam;
}

console.log(toplam(1, 2, 3, 4)); // 10

Sınıflar (Classes) (ES6)

Amaç: Nesne yönelimli programlama prensiplerini JavaScript’e getirmek için kullanılır.

Sözdizimi: class anahtar kelimesi ile tanımlanır.

JavaScript
class Ogrenci {
  constructor(ad, soyad) {
    this.ad = ad;
    this.soyad = soyad;
  }

  tanit() {
    console.log(`Benim adım ${this.ad} ${this.soyad}`);
  }
}

let ogrenci1 = new Ogrenci("Ali", "Yılmaz");
ogrenci1.tanit(); // "Benim adım Ali Yılmaz"

Modüller (ES6)

import ve export Anahtar Kelimeleri: Kodu modüler hale getirmek için kullanılır.

Amaç: Kodun daha organize, yeniden kullanılabilir ve bakımı kolay olmasını sağlamak.

Kaynak: https://developer.mozilla.org/en-US/docs/Web/JavaScript

Etiketler