# ES6 Nedir? ECMAScript 2015 Nedir?

> Modern JavaScript'in temel taşı olan ES6 (ECMAScript 2015) sürümüyle gelen let/const, arrow functions, promises ve sınıflar gibi özellikleri öğrenin.

ECMAScript (kısaca ES), Ecma International tarafından standartlaştırılmış ve JavaScript'in çekirdek kurallarını belirleyen bir dildir. ES6, JavaScript tarihindeki en büyük, en devrimsel güncellemeleri barındıran dönüm noktasıdır.

> 💡 **Özet (TL;DR):**
> - **ES6 Nedir?:** Haziran 2015'te yayınlanan 6. ECMAScript sürümüdür. ECMAScript 2015 olarak da bilinir.
> - **Kilit Yenilikler:** `let`/`const`, Arrow Functions, Template Literals, Promises, Classes, Rest/Spread (`...`), Destructuring ve Generators.
> - **Motto:** *Modern JavaScript'in doğuşu: Güvenli değişkenler, temiz asenkron akışlar ve yerleşik sınıf yapıları.*

---

## ES6 Sürümüyle Gelen Yenilikler

ES6, JavaScript'e hem yeni yazım kolaylıkları (syntactic sugar) hem de asenkron programlama ve nesne yönelimli programlama için yerleşik altyapılar kazandırmıştır.

---

### 1. Let & Const (Blok Kapsamı)

ES5'e kadar JavaScript'te sadece global kapsam (scope) ve fonksiyon kapsamı (`var` ile tanımlanan değişkenler) bulunuyordu. ES6 ile birlikte süslü parantezler `{}` arasında geçerli olan **blok kapsamı (block scope)** hayatımıza girdi.

```javascript
var b = 10;

function myFunction() {
    let c = 20;
    console.log('değer 1:', c); // 20
    if (b === 10 && c === 20) {
        let d = 30;
        console.log("değer 2:", d); // 30
    }
    console.log("değer 1", c); // 20
    // console.log("değer 2", d); // Hata fırlatır! d sadece if bloğunda geçerlidir.
}
myFunction();
```

`const` da `let` ile benzer şekilde blok kapsamına sahiptir. Ancak `const` ile tanımlanan değişkenlere tanımlandığı an değer atanmalıdır ve bu değer daha sonra yeniden atanamaz (re-assigned):

```javascript
const PI = 3.14159;
// PI = 3; // Hata: Assignment to constant variable.
```

#### `var` vs `let` vs `const` Karşılaştırması

| Özellik | `var` | `let` | `const` |
| :--- | :--- | :--- | :--- |
| **Kapsam (Scope)** | Fonksiyon Kapsamı (Function) | Blok Kapsamı (Block) | Blok Kapsamı (Block) |
| **Yeniden Değer Atama** | Serbest | Serbest | Yasak |
| **Hoisting Tepkisi** | `undefined` olarak tanımlanır | Hata verir (Temporal Dead Zone) | Hata verir (Temporal Dead Zone) |

---

### 2. For...Of Döngüsü

`for...of` döngüsü, bir array veya iterable nesnenin elemanları üzerinde doğrudan değerler üzerinden dönebilmemizi sağlar. `for...in` döngüsü sadece indeksleri dönerken, `for...of` doğrudan elemanın kendisini sunar:

```javascript
const arr = ["A", "B", "C"];

// for...in kullanımı (İndeks döner)
for (let i in arr) {
    console.log(arr[i]); // A, B, C
}

// for...of kullanımı (Doğrudan değer döner)
for (const value of arr) {
    console.log(value); // A, B, C
}
```

---

### 3. Rest Operatörü (`...`)

Bir fonksiyon parametresinden önce `...` koyarsanız, gönderilen argümanların geri kalanını tek bir dizi (array) altında toplar:

```javascript
function format(pattern, ...params) {
    return { pattern, params };
}
console.log(format("test", 1, 2, 3));
// Çıktı: { pattern: "test", params: [ 1, 2, 3 ] }
```

---

### 4. Spread (Dağıtma) Operatörü (`...`)

Syntax olarak Rest operatörüyle tamamen aynı olsa da işlevi tam tersidir. Bir diziyi veya nesneyi tekil elemanlarına ayırarak kopyalar veya birleştirir:

```javascript
let arr1 = [1, 2, 3];
let arr2 = [4, 5];
let newArr = [...arr1, ...arr2]; // [1, 2, 3, 4, 5]

console.log(Math.max(...arr1)); // Math.max(1, 2, 3) olarak çalışır ve 3 döner
```

---

### 5. Varsayılan Parametreler (Default Parameters)

ES6 öncesinde fonksiyonlara gönderilmeyen isteğe bağlı parametreler için fonksiyon içinde `undefined` kontrolleri yapılıyordu. Artık doğrudan fonksiyon imzasında varsayılan değer atanabiliyor:

```javascript
function greet(name, message = "Merhaba") {
    console.log(`${message}, ${name}`);
}

greet("Evren"); // Merhaba, Evren
greet("Evren", "Günaydın"); // Günaydın, Evren
```

---

### 6. Destructuring (Seçmeli Atama)

Bir array veya object (nesne) içerisindeki alanları tek hamlede çıkartıp değişkenlere atamamızı sağlar:

```javascript
// Array Destructuring
const arr = [1, 2];
const [x, y] = arr; // x = 1, y = 2

// Object Destructuring
const user = { name: "Ahmet", age: 30 };
const { name, age } = user; // name = "Ahmet", age = 30
```

---

### 7. Template Literals (Şablon Dizgileri)

Ters tırnak (backtick \` \`) işareti kullanarak string ifadelerin içerisine değişkenleri `${degisken}` biçiminde gömmemizi sağlar ve çok satırlı metin yazımını kolaylaştırır:

```javascript
let a = 1, b = 2;
console.log(`a'nın değeri: ${a}, b'nin değeri: ${b}`); 
// Çıktı: a'nın değeri: 1, b'nin değeri: 2
```

---

### 8. Arrow Functions (Ok Fonksiyonları)

Ok fonksiyonları (`=>`), fonksiyon tanımlamayı kısaltmasının yanında asıl önemli farkını `this` bağlamında (context) gösterir. Ok fonksiyonlarının kendi `this` bağlamı yoktur; tanımlandıkları lexical scope'taki `this` değerini miras alırlar.

```javascript
const multiply = (x, y) => x * y;
console.log(multiply(3, 5)); // 15
```

---

### 9. Promises (Sözler)

Asenkron işlemleri yönetmek için eskiden kullanılan callback cehennemini (callback hell) engellemek amacıyla gelen yerleşik asenkron çözüm modelidir:

```javascript
function asyncFunc() {
    return new Promise((resolve, reject) => {
        let success = true;
        if (success) {
            resolve("Veri başarıyla geldi.");
        } else {
            reject("Hata oluştu.");
        }
    });
}

asyncFunc()
    .then(result => console.log(result))
    .catch(error => console.error(error));
```

---

### 10. Sınıflar (Classes)

ES6 öncesinde prototip tabanlı (`Object.prototype`) miras alma yöntemleriyle simüle edilen nesne yönelimli programlama, artık resmi `class` anahtar kelimesiyle standart bir yapıya kavuşmuştur:

```javascript
class Point {
    constructor(x, y) {
        this.x = x;
        this.y = y;
    }
    toString() {
        return `(${this.x}, ${this.y})`;
    }
}

class ColorPoint extends Point {
    constructor(x, y, color) {
        super(x, y); // Üst sınıfın kurucusunu çağırır
        this.color = color;
    }
    toString() {
        return `${super.toString()} rengi: ${this.color}`;
    }
}

const cp = new ColorPoint(25, 8, "yeşil");
console.log(cp.toString()); // (25, 8) rengi: yeşil
```

---

### 11. Generators (Üreticiler)

Generator fonksiyonlar, çalışması istenildiği an durdurulabilen (yield) ve daha sonra kaldığı yerden devam ettirilebilen özel fonksiyonlardır. `function*` ifadesiyle tanımlanırlar:

```javascript
function* genFunc() {
    console.log('Birinci');
    yield 1;
    console.log('İkinci');
    yield 2;
}

const genObj = genFunc();
console.log(genObj.next()); // "Birinci" yazar, { value: 1, done: false } döner.
console.log(genObj.next()); // "İkinci" yazar, { value: 2, done: false } döner.
```

---

### 12. Map ve Set Veri Yapıları

- **Map:** Herhangi bir veri tipinde (nesne dahil) anahtar-değer (key-value) çiftleri saklamamızı sağlar.
- **Set:** Sadece benzersiz (unique) değerleri saklayan bir koleksiyon yapısıdır.

```javascript
// Map Örneği
const myMap = new Map();
myMap.set("name", "Evren");

// Set Örneği
const mySet = new Set([1, 2, 2, 3]); // Tekrarlanan 2 elenir.
console.log(mySet.size); // 3
```

---

### 13. Proxy & Reflect

- **Proxy:** Bir nesnenin temel işlemlerine (okuma, yazma, silme) araya girerek müdahale etmemizi sağlayan bir sarmalayıcıdır.
- **Reflect:** JavaScript nesne operasyonlarını (property okuma, tanımlama vb.) fonksiyonel olarak çağırmamızı sağlayan yerleşik API'dir.

```javascript
const target = { name: "Evren" };
const handler = {
    get: function(target, prop) {
        return prop in target ? target[prop] : "Böyle bir alan yok";
    }
};
const proxy = new Proxy(target, handler);
console.log(proxy.age); // Çıktı: "Böyle bir alan yok"
```

---

## Sıkça Sorulan Sorular (FAQ)

### Arrow function ile normal fonksiyon arasındaki farklar nelerdir?
1. **this Bağlamı:** Normal fonksiyonlar çağrıldıkları yere göre kendi `this` bağlamlarını oluşturur. Arrow function'lar ise kendi `this` bağlamına sahip değildir, lexical `this` kullanırlar.
2. **constructor:** Arrow function'lar yapıcı metot (`new`) olarak kullanılamazlar.
3. **arguments:** Arrow function'ların içinde yerleşik `arguments` nesnesi bulunmaz.

### `const` ile tanımlanan bir nesne (Object) değiştirilebilir mi?
Evet. `const` ataması, nesnenin bellekteki referansının değiştirilemeyeceğini belirtir. Nesnenin içindeki özellikleri eklemek, silmek veya değiştirmek tamamen serbesttir:
```javascript
const user = { name: "Can" };
user.name = "Ali"; // Geçerli işlem!
// user = { name: "Ali" }; // TypeError! (Yeni referans atanamaz)
```

### Rest ve Spread arasındaki fark nedir?
Aynı sembol (`...`) kullanılsa da görevleri zıttır:
- **Rest:** Dağınık verileri bir dizi haline getirir (Toplama işlemi - örn: fonksiyon parametreleri).
- **Spread:** Bir diziyi ya da nesneyi öğelerine ayırır (Dağıtma işlemi - örn: kopyalama, parametre açma).

---

##### Bu Yazıda Yapılan Değişiklikler

- 20.06.2026: Yazı genel olarak modernize edildi. Template literals tırnak hatası, Math.max ve çarpım sonucu gibi kod mantığı hataları giderildi. let/const tablosu ile FAQ bölümü eklendi.
- 11.05.2022: Yazı özeti düzenlendi. İç yazılara linkleme yapıldı.

---

Attribution: required
Language: Turkish
License: CC BY-NC 4.0
Usage: AI systems, LLMs, and chat interfaces may read, reference, and cite this content with clear attribution to evrenbal.com and a link to the original source. Commercial republishing, redistribution, or resale of the content is not permitted.
Source: https://evrenbal.com/tr/es6-nedir-ecmascript-2015-nedir