JavaScript has several built-in data types that you need to understand for effective programming:
// Primitive types
let string = "Hello, world!"; // Text
let number = 42; // Regular number
let bigInt = 9007199254740991n; // Very large integers
let boolean = true; // true or false
let nullValue = null; // Intentional absence of value
let undefinedValue; // Uninitialized variable
let symbol = Symbol("unique"); // Unique identifier
// Complex types
let array = [1, 2, 3, "four", true]; // Collection of values
let object = { // Key-value pairs
name: "JavaScript",
year: 1995,
isAwesome: true
};
// Checking types
console.log(typeof string); // "string"
console.log(typeof number); // "number"
console.log(typeof boolean); // "boolean"
console.log(typeof array); // "object" (arrays are objects in JS)
console.log(typeof object); // "object"
console.log(Array.isArray(array)); // true (proper way to check for arrays)
JavaScript often converts data types automatically (implicit conversion), but you can also convert types manually (explicit conversion):
// Implicit conversion (automatic)
console.log("5" + 2); // "52" (number is converted to string)
console.log("5" - 2); // 3 (string is converted to number)
console.log(5 + true); // 6 (true is converted to 1)
console.log(5 + false); // 5 (false is converted to 0)
console.log(Boolean("Hello")); // true (non-empty string converts to true)
console.log(Boolean("")); // false (empty string converts to false)
// Explicit conversion (manual)
console.log(Number("42")); // 42
console.log(String(42)); // "42"
console.log(Boolean(1)); // true
console.log(parseInt("42.5px", 10)); // 42 (parses until non-digit)
console.log(parseFloat("42.5px")); // 42.5
// Common conversion gotchas
console.log(Number("")); // 0
console.log(Number("hello")); // NaN (Not a Number)
console.log(Number(null)); // 0
console.log(Number(undefined)); // NaN
Conditional logic allows your code to make decisions and execute different blocks of code based on conditions:
// Basic if statement
let temperature = 75;
if (temperature > 80) {
console.log("It's hot outside!");
}
// If-else statement
if (temperature > 80) {
console.log("It's hot outside!");
} else {
console.log("It's not too hot today.");
}
// If-else-if ladder
if (temperature > 80) {
console.log("It's hot outside!");
} else if (temperature > 60) {
console.log("It's a pleasant day.");
} else if (temperature > 40) {
console.log("It's a bit chilly.");
} else {
console.log("It's cold outside!");
}
// Ternary operator (shorthand for simple if-else)
let message = temperature > 80 ? "It's hot!" : "It's not hot.";
console.log(message);
Combine multiple conditions using logical operators to create more complex logic:
// Logical AND (&&) - both conditions must be true
let isWeekend = true;
let isNice = true;
if (isWeekend && isNice) {
console.log("Let's go to the park!");
}
// Logical OR (||) - at least one condition must be true
let hasUmbrella = false;
let hasRaincoat = true;
if (hasUmbrella || hasRaincoat) {
console.log("You can go out in the rain.");
}
// Logical NOT (!) - reverses a boolean value
let isRaining = true;
if (!isRaining) {
console.log("No need for an umbrella.");
} else {
console.log("Take an umbrella!");
}
// Complex condition
let temperature = 75;
let isRaining = false;
let hasFreeTime = true;
if ((temperature > 70 && !isRaining) && hasFreeTime) {
console.log("Perfect day for a picnic!");
}
In JavaScript, certain values are considered "falsy" and others "truthy" when evaluated in a boolean context:
// Falsy values:
if (false) {} // false
if (0) {} // false
if ("") {} // false
if (null) {} // false
if (undefined) {} // false
if (NaN) {} // false
// Everything else is truthy:
if (true) {} // true
if (1) {} // true (any non-zero number)
if ("hello") {} // true (any non-empty string)
if ([]) {} // true (empty array)
if ({}) {} // true (empty object)
if (function(){}) {} // true (function)
// Practical use case
function getUserName(user) {
if (!user) { // Checks if user is falsy (null/undefined)
return "Guest";
}
return user.name || "Unnamed User"; // Return name if exists, otherwise fallback
}
console.log()
to check the values of variables inside conditional blocks===
) checks value and type, while double equals (==
) only checks valueif (x = y)
is an assignment, not a comparison (should be if (x === y)
)