What’s included:
– A mix of tasks from string concatenation to the power of nullish coalescing and optional chaining operators.
– Practical scenarios to apply arithmetic, assignment, and ternary operators in real-world examples.
– Insights into how logical operators can streamline your conditional logic.
Understanding these operators is crucial for any aspiring JavaScript developer as they form the foundation of decision-making and data manipulation in your code.
Exercise 1: Arithmetic Operators
Problem: Calculate the sum, difference, product, and quotient of two numbers (e.g., 5 and 3) and log the results.
Explanation: This exercise demonstrates the use of arithmetic operators: addition (+), subtraction (-), multiplication (*), and division (/).
Code:
let a = 5;
let b = 3;
console.log(a + b); // 8
console.log(a – b); // 2
console.log(a * b); // 15
console.log(a / b); // 1.6667
Exercise 2: Modulus Operator
Problem: Use the modulus operator to find the remainder when 15 is divided by 4.
Explanation: The modulus (%) operator returns the remainder of a division operation.
Code:
let dividend = 15;
let divisor = 4;
console.log(dividend % divisor); // 3
Exercise 3: Increment and Decrement Operators
Problem: Create a variable count with an initial value of 10. Increment it using the increment operator and then decrement it using the decrement operator.
Explanation: The increment (++) and decrement (–) operators increase or decrease a number by one, respectively.
Code:
let count = 10;
count++;
console.log(count); // 11
count–;
console.log(count); // 10
Exercise 4: Comparison Operators
Problem: Compare two numbers (e.g., 7 and 12) using greater than, less than, equal to, not equal to, greater than or equal to, and less than or equal to operators.
Explanation: Comparison operators are used to compare two values and return a boolean result: true or false.
Code:
let x = 7;
let y = 12;
console.log(x > y); // false
console.log(x < y); // true
console.log(x == y); // false
console.log(x != y); // true
console.log(x >= y); // false
console.log(x <= y); // true
Exercise 5: Logical Operators
Problem: Determine the result of combining two boolean values (true and false) using AND, OR, and NOT logical operators.
Explanation: Logical operators are used to determine the logic between variables or values: AND (&&), OR (||), and NOT (!).
Code:
let a = true;
let b = false;
console.log(a && b); // false
console.log(a || b); // true
console.log(!a); // false
Exercise 6: String Concatenation Operator
Problem: Concatenate two strings (“Hello, ” and “world!”) and print the result.
Explanation: The + operator can also be used to concatenate (combine) two or more strings.
Code:
let greeting = “Hello, “;
let target = “world!”;
console.log(greeting + target); // “Hello, world!”
Exercise 7: Ternary Operator
Problem: Use the ternary operator to assign a value to a variable ageGroup based on another variable age being greater than 18. If greater, assign “adult”, else assign “minor”.
Explanation: The ternary operator is a shorthand for the if-else statement and is used for conditionally assigning a value to a variable.
Code:
let age = 21;
let ageGroup = age > 18 ? “adult” : “minor”;
console.log(ageGroup); // “adult”
Exercise 8: Assignment Operators
Problem: Assign a value to a variable and then use the +=, -=, *=, and /= operators to modify that value.
Explanation: Assignment operators are used to assign and modify the value of a variable in relation to its current value.
Code:
let num = 10;
num += 5; // num is now 15
num -= 3; // num is now 12
num *= 2; // num is now 24
num /= 4; // num is now 6
console.log(num);
Exercise 9: Nullish Coalescing Operator
Problem: Use the nullish coalescing operator (??) to provide a default value (“default string”) for a variable that is either null or undefined.
Explanation: The nullish coalescing operator returns the right-hand side operand when the left-hand side operand is null or undefined.
Code:
let userInput = null;
let defaultValue = “default string”;
console.log(userInput ?? defaultValue); // “default string”
Exercise 10: Optional Chaining Operator
Problem: Access the name property of an object’s employee property safely using the optional chaining operator (?.), even if employee doesn’t exist.
Explanation: The optional chaining operator allows you to access deeply nested object properties without causing an error if a reference is nullish.
Code:
let company = {};
console.log(company.employee?.name); // undefined, without throwing an error
