JavaScript'te Nullish Coalescing Operatörü

Articles

Bu makale, JavaScript'te Nullish Coalescing Operatörünü açıklar.

YouTube Video

JavaScript'te Nullish Coalescing Operatörü

JavaScript'te Nullish Coalescing Operatörü (??), bir değerin null veya undefined olup olmadığını değerlendirir ve öyleyse farklı bir varsayılan değer döndürür. Genellikle kullanılan mantıksal VEYA operatörü (||) ile benzerdir, ancak null ve undefined üzerine odaklandığı için farklıdır.

Mantıksal VEYA (OR) operatörü, sol taraf değeri falsy olduğunda sağ taraf değerini döndürürken, nullish coalescing operatörü, sağ taraf değerini yalnızca sol taraf değeri null veya undefined olduğunda döndürür. Bu özellik, 0 ve boş stringler ("") gibi değerlerin doğru şekilde işlenmesine izin verir.

Temel Sözdizimi

1let result = value ?? defaultValue;

value, kontrol edilen değerdir.
defaultValue, value değeri null veya undefined olduğunda döndürülen değerdir.

Nullish Coalescing Operatörünün Kullanım Örnekleri

Aşağıdaki örnek, null veya undefined durumunda bir varsayılan değer döndüren bir işleme sahiptir.

1let name = null;
2let defaultName = "Anonymous";
3
4// If name is null or undefined, 'Anonymous' is returned
5let displayName = name ?? defaultName;
6console.log(displayName); // "Anonymous"

Bu kodda, name null olduğu için defaultName, yani "Anonymous" değeri döndürülür. Eğer name, null veya undefined dışında bir değer ise, o değer döndürülür.

Mantıksal VEYA Operatörü ile Farklılıklar

Nullish coalescing operatörü, mantıksal VEYA (OR) operatörüne benzer ancak önemli bir farkı vardır. Mantıksal VEYA (OR) operatörü, false, 0, NaN, "", null, undefined, vb. gibi 'falsy' değerleri kontrol ederken, nullish coalescing operatörü yalnızca null ve undefined değerlerini kontrol eder.

Mantıksal VEYA Operatörü Örneği:

1let count = 0;
2let defaultCount = 10;
3
4// Since count is falsy (0), defaultCount is returned
5let result = count || defaultCount;
6console.log(result); // 10

Nullish Coalescing Operatörü Örneği:

1let count = 0;
2let defaultCount = 10;
3
4// Since count is neither null nor undefined, count is returned as is
5let result = count ?? defaultCount;
6console.log(result); // 0

Bu şekilde, nullish coalescing operatörü 0 ve boş dizgi ("") gibi geçerli değerleri korur ve yalnızca gerektiğinde bir varsayılan değer döndürür. Mantıksal VEYA (OR) operatörü bu değerleri falsy olarak kabul edip varsayılan değer döndürdüğü için, kullanım durumuna bağlı olarak uygun operatör seçimi yapmak önemlidir.

Birlikte Kullanım Örneği:

Nullish coalescing operatörü diğer mantıksal operatörlerle birleştirilebilir, ancak bunu yaparken dikkatli olunması gerekir.

1let a = null;
2let b = 0;
3let c = false;
4
5// SyntaxError
6let result = a ?? b || c;

Örneğin, bunu mantıksal VEYA (OR) operatörü (||) veya mantıksal VE (AND) operatörü (&&) ile birlikte kullanırken, işlem sırasını netleştirmek için parantezler kullanılmalıdır.

1let a = null;
2let b = 0;
3let c = false;
4
5let result = (a ?? b) || c;
6console.log(result); // false

Bu örnekte, önce a ?? b değerlendirilir ve a null olduğundan, b döndürülür. Sonra, b || c değerlendirilir ve b gerçeğe dönüştürülebilir olmadığından, sonunda c döndürülür.

Nullish coalescing operatörünün yararlı olduğu durumlar

Aşağıdakiler, nullish coalescing operatörünün faydalı olduğu durumlardır.

Formlar için Varsayılan Değerler Bu, kullanıcı hiçbir şey girmediğinde form giriş alanları için varsayılan bir değerin belirlendiği senaryolarda kullanılabilir.

1let userAge = null;
2let defaultAge = 18;
3let age = userAge ?? defaultAge;
4console.log(age); // 18

API Yanıtlarını İşleme API yanıtlarında değer null veya undefined olduğunda yedek işleme yapılabilir.

1let apiResponse = {
2    title: "New Article",
3    description: null
4};
5
6let title = apiResponse.title ?? "Untitled";
7let description = apiResponse.description ?? "No description available";
8console.log(title);        // "New Article"
9console.log(description);  // "No description available"

Özet

Nullish coalescing operatörü (??), veri başlatma ve API yanıtlarını işleme için çok kullanışlıdır çünkü null veya undefined ile karşılaştığında bir varsayılan değer döndürür. Özellikle, 0 veya boş dizgiler gibi falsy değerleri düzgün bir şekilde işlemek istediğinizde, geleneksel mantıksal VEYA (OR) operatöründen (||) daha iyi bir seçimdir.

Nullish Birleştirme Atama Operatörü (??=) Hakkında

Genel Bakış

JavaScript'te, Nullish Birleştirme Atama Operatörü ??=, null veya undefined değerlerini tutan değişkenlere verimli bir şekilde yeni bir değer atamak için tanıtılmıştır. Bu operatör, yalnızca belirli bir değer null veya undefined ise bir değişkene atama yapmak için kullanışlı bir kısayoldur.

Temel Kullanım

Nullish coalescing atama operatörü şu şekilde çalışır:.

Bir değişken null veya undefined ise sağ taraftaki değeri atar.
Eğer değişken null veya undefined değilse hiçbir şey yapmaz ve mevcut değerini korur.

Sözdizimi

Nullish coalescing atama operatörünün temel sözdizimi şu şekildedir:.

1x ??= y;

Eğer x null veya undefined ise y, x'e atanır.
Eğer x zaten bir değere sahipse (yani null veya undefined değilse), x'in değeri değiştirilmez.

Örnek

Nullish birleşim atama operatörünün temel bir örneğine bakalım.

1let userName = null;
2let defaultName = "Guest";
3
4// Since userName is null, defaultName is assigned
5userName ??= defaultName;
6
7console.log(userName);  // "Guest"

Bu kodda, userName null olduğu için defaultName değeri atanıyor.

Ardından, değerin ne null ne de undefined olduğu bir örnek burada.

1let userName = "Alice";
2let defaultName = "Guest";
3
4// Since userName is "Alice", nothing is assigned
5userName ??= defaultName;
6
7console.log(userName);  // "Alice"

Bu durumda, userName için zaten "Alice" ayarlı olduğu için herhangi bir atama yapılmaz.

Diğer atama operatörleriyle karşılaştırma

JavaScript'te birçok başka atama operatörü de bulunmaktadır. Özellikle, mantıksal VEYA atama operatörü (||=) ile olan fark önemlidir.

1let value = 0;
2value ||= 10;  // Assign 10 if value is falsy
3console.log(value);  // 10

Mantıksal VEYA (OR) atama operatörü, false, 0 veya boş dizgi ("") gibi falsy değerlerle karşılaştığında bile değer atar; oysa nullish coalescing atama operatörü yalnızca değer null veya undefined olduğunda çalışır.

1let value = 0;
2value ??= 10;
3// Since value is neither null nor undefined,
4// nothing is assigned
5console.log(value);  // 0

Nullish coalescing atama operatörü yalnızca null veya undefined üzerinde çalıştığı için, 0 veya false gibi değerleri korumak istediğiniz durumlarda çok kullanışlıdır.

Gerçek dünya kullanım örnekleri

Null birleştirme atama operatörü için gerçek dünya kullanım durumu aşağıdaki gibi olabilir:.

Varsayılan değerleri ayarlama

Kullanıcı girişlerinin veya API yanıtlarının null veya undefined olabileceği durumlarda varsayılan değerleri ayarlamak için kullanışlıdır.

1let userSettings = {
2    theme: null,
3    notifications: true
4};
5
6// Since theme is null, "light" is assigned
7userSettings.theme ??= "light";
8
9console.log(userSettings.theme);  // "light"

Opsiyonel parametrelerin işlenmesi

Fonksiyon argümanları belirtilmediğinde varsayılan işlemleri gerçekleştirmek için de kullanılabilir.

1function greet(name) {
2    name ??= "Guest";
3    console.log(`Hello, ${name}!`);
4}
5
6greet();  // "Hello, Guest!"
7greet("Alice");  // "Hello, Alice!"

Özet

Nullish coalescing atama operatörü (??=), yalnızca sol taraf değeri null veya undefined olduğunda değer atar, bu da kodu daha sade hale getirir ve istem dışı atamaları önlemeye yardımcı olur. Özellikle 0 veya false gibi "yanlış" değerlere çalışırken, geleneksel mantıksal VEYA operatöründen (||=) daha uygun olabilir.

Bu operatörü kullanarak daha sağlam ve okunabilir bir kod oluşturabilirsiniz.

Yukarıdaki makaleyi, YouTube kanalımızda Visual Studio Code'u kullanarak takip edebilirsiniz. Lütfen YouTube kanalını da kontrol edin.

YouTube Video

JavaScript'te `truthy` ve `falsy`