JavaScript Academy · Ders

Değişiklik Yapmaktan Kaçınma

Verileri değiştirmek yerine kopyalarıyla çalışın.

Değişiklik Yapmaktan Kaçınma, CoddyKit'te ücretsiz bir JavaScript Academy dersidir. Bu, 4 dersinin 3. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, JavaScript Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. JavaScript Academy kursu toplamda 4 dersten oluşur.

Değişiklikten Neden Kaçınmalı

Paylaşılan verileri değiştirmek, izlenmesi zor hatalara neden olur: Bir yerdeki değişiklik başka bir yerdeki kodu şaşırtır. İşlevsel üslup, mevcut değerleri değiştirmek yerine yeni değerler oluşturmayı (değişmezlik) tercih eder.

const original = [1, 2, 3];
const copy = [...original, 4];
console.log(original); // [1, 2, 3]
console.log(copy);     // [1, 2, 3, 4]

Dizileri Kopyalamak için Yayma

Yayma işleci ..., bir dizinin sığ kopyasını oluşturur ve kaynağa dokunmadan öğe eklemenizi sağlar.

const nums = [1, 2, 3];
const more = [...nums, 4, 5];
console.log(more); // [1, 2, 3, 4, 5]
console.log(nums); // [1, 2, 3]

Nesneleri Kopyalamak için Yayma

Yayma, nesnelerle de çalışır; aynı özelliklere ve üzerine yazılan ek değerlere sahip yeni bir nesne üretir.

const user = { name: "Ada", age: 36 };
const older = { ...user, age: 37 };
console.log(older); // { name: "Ada", age: 37 }
console.log(user);  // unchanged

Değişiklik Yapmayan Dizi Yöntemleri

Yeni diziler döndüren yöntemleri tercih edin: map, filter, concat, slice. push, splice ve yerinde çalışan sort gibi değişiklik yapan yöntemlerden kaçının.

const a = [3, 1, 2];
const sorted = [...a].sort((x, y) => x - y);
console.log(sorted); // [1, 2, 3]
console.log(a);      // [3, 1, 2]

Değişmez Biçimde Ekleme

push yerine yayma veya concat kullanarak yeni bir dizi oluşturun.

const list = [1, 2];
const added = [...list, 3]; // not list.push(3)
console.log(added); // [1, 2, 3]

Değişmez Biçimde Kaldırma

splice yerine bir öğe olmadan yeni bir dizi üretmek için filter kullanın.

const list = [1, 2, 3, 4];
const without3 = list.filter((n) => n !== 3);
console.log(without3); // [1, 2, 4]

Bir Öğeyi Değişmez Biçimde Güncelleme

Bir öğeyi değiştirmek için dizi üzerinde map uygulayın ve eşleşen öğe için yeni bir değer döndürün.

const todos = [{ id: 1, done: false }, { id: 2, done: false }];
const updated = todos.map((t) =>
  t.id === 1 ? { ...t, done: true } : t
);
console.log(updated[0].done); // true

Sığ Kopyalama ve Derin Kopyalama

Yayma işlemi tek bir düzeyi derinliğine kopyalar. İç içe nesneler yine paylaşılan başvurulardır. İç içe verileri değişmez biçimde güncellemek için değiştirdiğiniz her düzeyde yayma kullanın.

const state = { user: { name: "Ada", age: 36 } };
const next = {
  ...state,
  user: { ...state.user, age: 37 }
};
console.log(state.user.age); // 36
console.log(next.user.age);  // 37

Güvenlik için Dondurma

Object.freeze, bir nesnenin çalışma zamanında yanlışlıkla değiştirilmesini önler ve değişmezliği açık hâle getirir (tek düzey derinliğinde).

const config = Object.freeze({ env: "prod" });
config.env = "dev";       // ignored in non-strict mode
console.log(config.env);  // "prod"

Const Değişmezlik Değildir

Yaygın bir karışıklık şudur: const yalnızca değişkene yeniden atama yapılmasını önler; tuttuğu değerin değiştirilmesini önlemez. const ile tanımlanan bir diziye yine de push uygulanabilir.

const arr = [1, 2];
arr.push(3);          // allowed - value mutated
console.log(arr);     // [1, 2, 3]
// arr = [] would throw

Yararların Özeti

Değişmez güncellemeler, başvuruları karşılaştırarak değişiklik takibini kolaylaştırır, geri alma/yineleme olanağı sağlar, beklenmedik uzak etkileri önler ve saf işlevlerle doğal biçimde birlikte çalışır.

const prev = { count: 0 };
const next = { ...prev, count: 1 };
console.log(prev === next); // false - easy to detect change

Hızlı Kontrol

Değişiklik yapmaktan kaçınma.

Özet

Değişmezlik, değişiklik yapmak yerine yeni değerler oluşturmak demektir. Dizileri ve nesneleri kopyalamak için yaymayı kullanın, değişiklik yapmayan yöntemleri (map, filter, concat) tercih edin ve iç içe güncellemelerde her düzeyde yayma uygulayın. const değer yeniden atamasını engeller, değişikliği değil; Object.freeze çalışma zamanında ek koruma sağlar. Değişmez güncellemeler, değişiklik algılamayı ve saf kod yazmayı kolaylaştırır.

Sıkça Sorulan Sorular

“Değişiklik Yapmaktan Kaçınma” dersi ücretsiz mi?

Evet — “Değişiklik Yapmaktan Kaçınma” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve JavaScript Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. JavaScript Academy kursu toplamda 4 dersten oluşur.

“Değişiklik Yapmaktan Kaçınma” dersinde ne öğreneceğim?

Verileri değiştirmek yerine kopyalarıyla çalışın. JavaScript Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.

JavaScript Academy öğrenmeye başlamak için deneyim gerekli mi?

Önceden deneyim gerekmez. CoddyKit'te JavaScript Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 3. dersidir.

“Değişiklik Yapmaktan Kaçınma” dersi ne kadar sürer?

Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.

Bu JavaScript Academy dersinde kod yazıp çalıştırabilir miyim?

Evet. Her JavaScript Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.

Bu kursun tüm dersleri

← JavaScript Academy Sayfasına Dön