DEV Community

Azaan Suhail
Azaan Suhail

Posted on

Day 4 of Complete JavaScript in 17 days | Visual Series📚✨

Day 4 of My JavaScript Visual Series 📚✨

💡 JavaScript Truthy & Falsy Values – Made Simple
While writing JS code, we often see expressions like:

const firstName = "";
const nickName = "Azzu";
console.log(firstName || nickName); // Output: Azzu
Enter fullscreen mode Exit fullscreen mode

✅ If firstName is falsy (like ""), JS smartly picks the next truthy value.
📌 Falsy values → 0, "", null, undefined, NaN, false
📌 Truthy values → anything meaningful like "Azaan", [], {}, "0"

  • Some real-life examples:
let fname = "";
let mname = undefined;
let lname = null;
console.log(fname || mname || lname); // Output: null
--------------------------------------------------
let a = 12;
let b;
console.log(a + b); // Output: NaN
--------------------------------------------------
let c = 12;
let d;
console.log(c + (d || 0)); // Output: 12
Enter fullscreen mode Exit fullscreen mode

👉 || returns the first truthy value and
👉 returns the first falsy value

let f_name_1 = "Azaan";
let f_name_2 = "";
let ans = f_name_1 && f_name_2;
console.log(`Name-${ans}`); // Output: Name-
--------------------------------------------------
let f_name_3 = "Azaan";
let f_name_4 = null;
let ans2 = f_name_3 && f_name_4;
console.log(`Name-${ans2}`); // Output: Name-null
Enter fullscreen mode Exit fullscreen mode

🛠️ Real-world use in backend (Node.js):

const PORT = process.env.PORT || 5000;
Means → Use the environment port if it exists, else use 5000.

🧠 Quick Quiz :

console.log(3 || 2 || 1); // ?
console.log("" || 0 || 2); // ?
console.log(null || 2 || 3); // ?
console.log("" || 0 || undefined); // ?
console.log("undefined" || "null" || 2); // ?
console.log(3 && 2 && 1); // ?
console.log("" && 0 && 2); // ?
console.log(undefined && "null" && 2); // ?
Enter fullscreen mode Exit fullscreen mode

Top comments (0)