Normal İnsanlar için Nullish Birleştirme (JS'de) Eğitimi

Selam! JavaScript kodunuzdaki boş veya tanımsız değerleri işlemeye çalışırken hiç hayal kırıklığına uğradınız mı? Nullish birleştirme, bunu çok daha kolaylaştırmaya yardımcı olan yeni bir özelliktir. Bu yazıda sıfır birleştirmeyi açıklayacağız.

Bu, basit terimler, eğlenceli örnekler ve karmaşık jargonun olmaması anlamına gelir. Sonunda, kısa sürede temiz, kısa ve öz JS kodu yazacaksınız.

Peki sıfıra yakın birleşme tam olarak nedir? Temel olarak, bir şey boş veya tanımsız olduğunda varsayılan değeri sağlamanın kısa ve basit bir yoludur. Dağınık iç içe geçmiş üçlülere veya mantıksal OR ifadelerine sahip olmak yerine, varsayılanı birleştirmek için çift soru işareti operatörünü (??) kullanabilirsiniz.

Kafa karıştırıcı mı geliyor? Endişelenmeyin, takip edilmesi kolay bazı örneklerle size bunun nasıl çalıştığını göstereceğiz. Kemerlerinizi bağlayın, bu eğlenceli bir yolculuk olacak!

Boş Birleştirme Operatörü Tam Olarak Nedir?

Hiç JavaScript'te boş değerlerle uğraşırken takılıp kaldınız mı? Biliyorum. Peki dostum, seni sıfır değerde birleştirme operatörüyle (??) tanıştırayım. Bu küçük adam hayatınızı çok daha kolaylaştıracak.

Peki sıfır birleştirme operatörü tam olarak nedir? Temel olarak, bir şeyin boş veya tanımsız olabileceği durumlarda varsayılan değeri sağlayan bir kısayoldur. Yazmak yerine:

 let name = obj.name || 'default name';

Artık basitçe şunu yazabilirsiniz:

 let name = obj.name ?? 'default name';

?? operatörü, eğer boş değilse (boş veya tanımsız anlamına gelir) sol tarafı döndürür, aksi halde sağ tarafı döndürür. Yani yukarıdaki örnekte obj.name boş veya tanımsız değilse name, obj.name olarak ayarlanacaktır. Ancak obj.name boş veya tanımsızsa name 'varsayılan ad' olacaktır.

Oldukça kullanışlı, değil mi? Diğer bazı örnekler:

 let age = ageInput ?? 25; // Sets age to ageInput if not nullish, otherwise 25 let email = user.email ?? 'no email provided'; let hobbies = obj.hobbies ?? []; // Sets hobbies to obj.hobbies if not nullish, otherwise an empty array

Umarım bu, JavaScript'teki koşullu mantığınızın bir kısmını basitleştirmeye yardımcı olur.

Hepimizin İlgili Olabildiği Gerçek Dünyadan Bir Örnek

Hiç bir şeyin parasını ödemeye gittiğinizde birkaç kuruş eksiğinizin olduğunu fark ettiğiniz oldu mu? Hepimiz oradaydık. Nullish birleştirme, satın almak istediğiniz şeyi gerçekten karşılayabilmeniz için cebinizde fazladan birkaç dolar bulmaya benzer.

Diyelim ki her zamanki sabah kahveniz için en sevdiğiniz kafeye gidiyorsunuz. Elinizde 3 dolar ile sipariş vermeye hazır bir şekilde tezgaha çıkıyorsunuz. Ancak barista toplam tutarınızı söylediğinde vergiler hariç 3,50 dolar çıkıyor.

Sıfıra yakın birleşme , aniden cebinizde bir dolar daha olduğunu ve böylece kahvenizi alabileceğinizi hatırlamaya benzer. Vay be!

JavaScript'te null birleştirme , bir şeyin null veya tanımsız olarak çözümlenmesi durumunda varsayılan bir değer sağlamanın bir yoludur. Örneğin, değer döndürebilen veya döndürmeyebilen bir işleviniz olduğunu varsayalım:

 function getCoffeePrice() { // Returns $3.50 or undefined } let price = getCoffeePrice() ?? '$3.50';

Burada, eğer getCoffeePrice() tanımsız olarak dönerse, ?? işareti sayesinde price varsayılan olarak '$3.50' olacaktır. nullish birleştirme operatörü. Yani her iki durumda da kahveniz için bir fiyat alacağınız garantidir.

Boş birleştirme, değişkenler boş veya tanımsız olduğunda geri dönüş varsayılan değerleri sağlayarak kodunuzun daha dayanıklı olmasını sağlar. Tıpkı kafede cebinizde fazladan doları bulmanız gibi, işlemi tamamlamak için ihtiyacınız olan şeye sahip olmanızı sağlar. Oldukça kullanışlı, değil mi?

Artık bir profesyonel gibi sıfıra yakın birleşmeyi anladığınızı bilerek içiniz rahat olsun. Mutlu kodlamalar ve kahvenizin tadını çıkarın!

JavaScript'te Boş Birleştirmeyi Kullanma

Boş birleştirme operatörü (??), boş değilse sol işlenenini döndürür; aksi takdirde sağ işlenenini döndürür.

Kafası karışmış? Hadi bunu parçalayalım. "Boş" bir değer ya boştur ya da tanımsızdır. Peki ?? operatörü, soldaki değerin boş olup olmadığını kontrol eder ve eğer öyleyse, bunun yerine doğru değeri döndürür.

Örneğin:

 const name = bob ?? 'anonymous';

Bob tanımlanmışsa bu, name değerini 'bob'a atayacaktır. Bob tanımsız veya boşsa, bunun yerine 'anonim' dizesini atayacaktır.

Bu Neden Yararlıdır?

olmadan ?? operatörü olarak bunu yapmanız gerekir:

 const name = bob !== null && bob !== undefined ? bob : 'anonymous';

?? operatörü aslında aynı şeyi yapmamız için bize daha kısa ve daha temiz bir sözdizimi sağlar.

JavaScript'in herhangi bir yerinde kullanılabilir - değişkenler , işlev argümanları , nesne özellikleri vb. içinde. Normalde ||'yi kullanacağınız her yerde kullanılabilir. (veya) operatörünü varsayılan değerler için kullanabilirsiniz, artık ?? "boş" bir varsayılan değer için.

Birkaç Örnek:

 const foo = null ?? 'default string'; // foo is 'default string' const bar = 0 ?? 42; // bar is 0 const qux = 0 || 42; // qux is 42 - || returns first truthy value function doSomething(x = 0) { x = x ?? 10; // If x is nullish, set default of 10 console.log(x); } doSomething(null); // Prints 10 doSomething(5); // Prints 5

Umarım bu, boş birleştirme operatörünü açıklamaya yardımcı olur!

Neden Sıfır Birleştirme VEYA'dan Daha İyidir (||)

OR (||) Operatörü İlk Doğruluk Değerini Döndürecektir.

OR (||) operatörü karşılaştığı ilk doğruluk değerini döndürerek çalışır. Her iki değer de yanlışsa son değeri döndürür. Örneğin:

 let name = null; let user = name || 'John'; // user is 'John'

Burada name boştur (yanlış), dolayısıyla user ikinci değeri, 'John'u alır.

Nullish Birleştirme Operatörü (??) Daha Akıllıdır.

Nullish Birleştirme Operatörü (??) ES2020'de tanıtıldı ve OR'den (||) biraz daha akıllıdır. İlk tanımlanan değeri döndürür (boş/tanımsız değil). Dolayısıyla, ilk değer boş bir dize, 0 veya false ise bu değeri döndürecektir. Örneğin:

 let name = ''; let user = name ?? 'John'; // user is ''

Burada name boş bir dizedir, dolayısıyla user name (ilk tanımlanan değer) alır.

Nullish Coalescing Operatörü, varsayılan değerleri daha temiz bir şekilde sağlamamıza olanak tanır. 0, boş dizeler, false vb. gibi sahte değerler konusunda endişelenmeden boş/tanımsız değerler için varsayılan değerleri ayarlayabiliriz.

Örneğin, bir kullanıcının yaşını döndüren bir fonksiyonumuz olduğunu ancak bazen yaşın boş olduğunu varsayalım:

 function getAge() { return age; // could be null } let userAge = getAge() || 30; // Uses OR, not ideal

Burada, eğer age 0, '' veya false ise userAge hatalı olarak 30 olacaktır.

Nullish Coalescing Operatörünü kullanmak şunu düzeltir:

 let userAge = getAge() ?? 30; // Uses ??

Artık userAge yalnızca age boş veya tanımsızsa 30 olacaktır. 0 gibi herhangi bir sahte değer kullanılacaktır.

Özetle, boş/tanımsız için varsayılan bir değer sağlamak istediğinizde OR (||) yerine Boş Birleştirme Operatörünü (??) kullanın, ancak 0, boş dizeler veya false gibi sahte değerler için bunu kullanmayın.

Kodunuz daha temiz ve hatalara daha az eğilimli olacak!

Sıfır Birleştirme Hakkında Yaygın Sorular

JavaScript'teki bu yeni ve şık Nullish Coalescing operatörünü (??) duydunuz ve bazı sorularınız var. Endişelenmeyin, sizi korudum!

Nullish Coalescing Hangi Veri Türleriyle Çalışır?

• Nullish birleştirme, aşağıdakiler de dahil olmak üzere JavaScript'teki tüm veri türleriyle çalışır:
• Sayılar: 0 ?? 1 // 1 değerini döndürür
• Teller: '' ?? 'Merhaba' // 'Merhaba'yı döndürür
• Boolean'lar: yanlış ?? doğru // Doğruyu döndürür
• Nesneler: {} ?? {name: 'John'} // {name: 'John'} değerini döndürür
• Diziler: [] ?? [1, 2, 3] // [1, 2, 3] değerini döndürür
• Ve dahası!

|| Arasındaki Fark Nedir? (VEYA) ve ?? (Boş Birleştirme) Operatörler?

|| (OR) operatörü, sol işlenen yanlışsa (yanlış, 0, boş dize, boş, tanımsız, NaN) sağ işleneni döndürür.

?? (Nullish Coalescing) operatörü, yalnızca sol işlenen boş veya tanımsızsa sağ işleneni döndürür.

Yani temel fark şu? 0 ve boş dizeleri geçerli değerler olarak kabul eder, oysa || değil.

Ne Zaman Kullanmalıyım? || bitti mi?

Kullan ?? null veya tanımsız için varsayılan bir değer sağlamak istediğinizde ancak 0 ve boş dizelerin geçerli değerler olduğunu düşünün.

|| Kullan herhangi bir "sahte" değer için bir geri dönüş sağlamak istediğinizde.

Umarım bu, Nullish Coalescing operatörüyle ilgili aklınıza takılan bazı soruların yanıtlanmasına yardımcı olur! Başka sorularınız varsa bana bildirin.

Çözüm

Artık boş birleştirme ve bunun JavaScript'te nasıl çalıştığı hakkında her şeyi biliyorsunuz. Oldukça basit, değil mi? Bu küçük operatör, varsayılan değerleri kısa ve öz bir şekilde sağlayarak size zaman kazandırabilir ve kodunuzu daha temiz hale getirebilir.

Öyleyse ilerleyin ve geçersiz değerleri kalbinizin içeriğine göre birleştirin! Modern JavaScript özelliklerinde uzmanlaşma yolunda ilerliyorsunuz.

Mutlu Kodlama!