`truthy` dan `falsy` dalam TypeScript

Dalam artikel ini, kami akan menjelaskan truthy dan falsy dalam TypeScript.

YouTube Video

truthy dan falsy dalam TypeScript

Konsep truthy dan falsy dalam TypeScript memiliki peran yang sangat penting dalam pernyataan kondisional dalam program. Di sini, kami akan menjelaskan konsep-konsep ini secara mendetail dan bagaimana mereka benar-benar digunakan. Selain itu, kami menyediakan contoh kode TypeScript spesifik untuk memahami bagaimana nilai truthy dan falsy ditangani.

Apa itu truthy dan falsy?

Dalam JavaScript dan TypeScript, setiap nilai dievaluasi sebagai benar (true) atau salah (false) dalam ekspresi kondisional. Nilai-nilai ini secara logis diklasifikasikan sebagai truthy atau falsy.

• truthy mengacu pada nilai-nilai yang dievaluasi sebagai true dalam ekspresi kondisional.
• falsy mengacu pada nilai-nilai yang dievaluasi sebagai false dalam ekspresi kondisional.

Dalam TypeScript, nilai-nilai berikut diperlakukan sebagai falsy:.

2. Angka 0
3. "" (string kosong)

Semua nilai lain dianggap sebagai truthy.

Contoh Khusus truthy dan falsy

 1// Examples of falsy values
 2console.log("0 is", Boolean(0) ? "truthy" : "falsy");
 3console.log('"" is', Boolean("") ? "truthy" : "falsy");
 4console.log("null is", Boolean(null) ? "truthy" : "falsy");
 5console.log("undefined is", Boolean(undefined) ? "truthy" : "falsy");
 6console.log("NaN is", Boolean(NaN) ? "truthy" : "falsy");
 7
 8// Examples of truthy values
 9console.log("1 is", Boolean(1) ? "truthy" : "falsy");
10console.log('"hello" is', Boolean("hello") ? "truthy" : "falsy");
11console.log("[] is", Boolean([]) ? "truthy" : "falsy");
12console.log('" " (space) is', Boolean(" ") ? "truthy" : "falsy");

Pernyataan Bersyarat Menggunakan truthy dan falsy

Konsep truthy dan falsy sering digunakan dalam pernyataan kondisional dan perulangan. Misalnya, dalam pernyataan if atau perulangan while, Anda dapat menggunakan nilai-nilai ini langsung untuk evaluasi kondisional sederhana.

 1// Checking if the length of the array is 0
 2let items: string[] = [];
 3
 4if (items.length) {
 5    console.log("The array is not empty");
 6} else {
 7    console.log("The array is empty");
 8}
 9
10// Checking if the input value is empty
11let input = "";
12
13if (input) {
14    console.log("Input has value");
15} else {
16    console.log("Input is empty"); // This will be executed
17}

Menangani Nilai falsy dengan ?? (Nullish Coalescing) dan || (Logical OR)

Dalam TypeScript, ada beberapa operator yang berguna saat menangani nilai falsy. Secara khusus, Operator Penggabungan Nullish (??) dan operator logika OR (||) sering digunakan.

|| (Logical OR)

Operator logika OR digunakan untuk menggantikan nilai falsy dengan nilai default. Namun, semua nilai yang dianggap falsy (tidak hanya null dan undefined, tetapi juga 0 dan string kosong "") juga disertakan.

1let username = "";
2let displayName = username || "Guest";
3// Since username is empty, "Guest" is assigned
4
5console.log(displayName); // "Guest"

??（Nullish Coalescing）

Operator penggabungan nullish hanya menerapkan nilai default pada null atau undefined, dan memperlakukan nilai falsy lainnya seperti 0 atau string kosong "" sebagaimana adanya.

1let username2 = "";
2let displayName2 = username2 ?? "Guest";
3// The empty string is retained
4// since username2 is not null or undefined
5
6console.log(displayName2); // ""

Perangkap yang Berhubungan dengan truthy dan falsy

Poin penting yang perlu diperhatikan saat memahami truthy dan falsy adalah bahwa nilai yang tidak dimaksudkan dapat dianggap sebagai falsy. Sebagai contoh, 0 dan string kosong "" adalah nilai yang valid, tetapi dianggap falsy dalam pernyataan kondisional, yang dapat mengakibatkan evaluasi yang salah.

1let score = 0;
2
3if (score) {
4    console.log("You have a score!"); // This will not be executed
5} else {
6    console.log("No score available"); // This will be executed
7}

Dalam kasus seperti itu, menggunakan operator pembanding ketat memungkinkan Anda untuk membedakan nilai-nilai seperti 0 dan false secara akurat.

1let score = 0;
2
3if (score === 0) {
4    console.log("Score is zero"); // Correctly evaluated
5}

Perangkap terkait dengan falsy dan NaN

NaN memerlukan penanganan khusus karena tidak sama dengan nilai apa pun, termasuk dirinya sendiri, saat menggunakan operator pembanding.

1console.log("NaN === NaN:", NaN === NaN); // false

Oleh karena itu, lebih aman menggunakan Number.isNaN() untuk mendeteksi NaN secara akurat.

 1// Bad Example
 2let value = parseInt("0");
 3if (!value) {
 4    console.log("Value is NaN(Incorrect)"); // Incorrectly treats 0 as NaN
 5}
 6
 7// Good Example
 8let value2 = parseInt("hello");
 9if (Number.isNaN(value2)) {
10    console.log("Value is NaN(Correct)"); // Correctly identifies NaN
11}

Dengan demikian, NaN bahkan tidak sama dengan dirinya sendiri, sehingga perbandingan dengan NaN selalu menghasilkan false. Dengan menggunakan Number.isNaN() sebagai gantinya, Anda dapat melakukan pemeriksaan yang lebih dapat diandalkan.

Kesimpulan

Konsep truthy dan falsy dalam TypeScript sangat berguna, tetapi Anda perlu berhati-hati dengan nilai tertentu, terutama 0 dan string kosong. Saat menggunakan nilai-nilai ini dalam pemeriksaan kondisional, menggunakan pembanding ketat (===) atau Operator Penggabungan Nullish (??) sebagai pengganti pembanding longgar (==) dapat membantu menghindari perilaku yang tidak diharapkan.

Anda dapat mengikuti artikel di atas menggunakan Visual Studio Code di saluran YouTube kami. Silakan periksa juga saluran YouTube kami.

YouTube Video