JavaScript Quiz #04 — JavaScript Operators and Precedence
Topics: JavaScript Assignment, Comparison, Arithmetic, Bitwise, Ternary, Logical, and Unary operators
Checkout the interactive quiz of this story here https://quizzesforyou.com/quiz/jsoperators
Checkout All JavaScript Quizzes
Quick Refresher:
1. Assignment Operators:
Assignment operators in JavaScript are used to assign values to variables. Different Assignment operators available in JavaScript are
Assignment operator (\=), Addition assignment (+=), Subtraction assignment (-=), Multiplication assignment (*=), Division assignment (/=), Remainder assignment (%=), Exponentiation assignment (**=)
2. Comparison Operators:
In JavaScript, comparison operators are used to compare values and determine the relationship between them. They return a Boolean value (true or false) based on the comparison result.
Equal to (==), Not equal to (!=), Strict equal to (===), Strict not equal to (!==), Greater than (>), Less than (<), Greater than or equal to (>=), Less than or equal to (<=), Ternary operator (?:)
3. Arithmetic Operators:
Arithmetic operators are used to perform mathematical calculations and manipulate numerical values in JavaScript.
Addition (+), Subtraction (-), Multiplication (*), Division (/), Remainder (%), Exponentiation (**), Increment (++) — postfix and prefix, Decrement ( — ) — postfix and prefix
4. Bitwise Operators:
Bitwise operators work on the individual bits of the operands, allowing you to manipulate and perform operations at the binary level
Bitwise AND (&), Bitwise OR (|), Bitwise XOR (^), Bitwise NOT (~), Left shift (<<), Sign-propagating right shift (>>), Zero-fill right shift (>>>)
5. Logical Operators:
Logical operators are commonly used to combine multiple conditions and make decisions based on the truthiness or falsiness of values.
Logical AND (&&), Logical OR (||), Logical NOT (!)
Short Circuit Evaluation:
Logical AND (&&) Short Circuit: If the left operand of
&&
is false, the right operand is not evaluated.Logical OR (||) Short Circuit: If the left operand of
||
is true, the right operand is not evaluated.
let x = false && ( 10 > 5 ); // short-circuited and evaluate to false
let x = true || (10 < 5); // short-circuited and evaluate to true
Null Coalescing Operator:
The Null Coalescing Operator (??) in JavaScript provides a concise way to provide a default value when a variable or expression is null or undefined.
let username = null;
let defaultUsername = "Guest";
let greeting = "Welcome, " + (username ?? defaultUsername) + "!";
console.log(greeting); // Output: "Welcome, Guest!"
6. Ternary Operator:
The Ternary operator, also known as the conditional operator, is a concise way to write conditional statements in JavaScript. It is often used as a shorthand version of the if…else statement.
syntax: condition ? expression1 : expression2
const age = 18;
const isAdult = age >= 18 ? 'Yes' : 'No';
console.log(isAdult); // Output: 'Yes'
7. Unary Operators
Unary operators in JavaScript are operators that perform operations on a single operand. They can be used to modify or evaluate the value of a single expression. JavaScript supports several unary operators, including
Unary plus: `+`, Unary negation: `-`, Logical NOT: `!`, Increment: `++`, Decrement: ` — `
Operator Precedence:
Please Check the MDN table for Operator Precedence https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Operator_precedence
Quizzes:
Checkout the interactive quiz of this story here https://quizzesforyou.com/quiz/jsoperators
1. What is the output?
let num = 8;
let multiplier = 2;
num \*= multiplier += 3;
console.log(num);
a) 16
b) 40
c) 80
Answer: b) 40
The code snippet involves nested assignment operators. First, the multiplier
is increased by 3 (multiplier += 3
), resulting in multiplier
having the value 5. Then, the value of num
is multiplied by the updated value of multiplier
(5), resulting in num
having the value 40.
2. What is the output?
let a = "Hello";
let b = "hello";
let result = a < b;
console.log(result);
a) true
b) false
c) undefined
Answer: a) true
The code snippet compares the values of a
and b
using the <
less than operator. JavaScript compares strings based on their Unicode values. In Unicode, uppercase letters come before lowercase letters. Since "Hello" comes before "hello" in Unicode order, the result is true
.
3. What is the output?
let x = true;
let y = 5;
let result = x && (y > 10);
console.log(result);
a) true
b) false
c) undefined
Answer: b) false
Code snippet uses the logical AND operator (&&
) to check if both x
and (y > 10)
are true. Since x
is true, the evaluation proceeds to (y > 10)
. Since y
is not greater than 10 (5 > 10
is false), the overall result is false.
4. What is the Output?
let name = "John";
let fallbackName = "Anonymous";
let result = name ?? fallbackName ?? "Guest";
console.log(result);
a) “John”
b) “Anonymous”
c) “Guest”
Answer: a) “John”
This code uses multiple null coalescing operators (??
) to assign the value of name
to result
. If name
is null or undefined, it checks the next value fallbackName
, and if that's also null or undefined, it finally assigns the value "Guest" to result
. Since name
is "John", it is assigned to result
, and the value is "John".
5. What is the Output?
let x = undefined;
let y;
let result = x === y;
console.log(result);
a) true
b) false
c) undefined
Answer: a) true
The code snippet compares the values of x
and y
using the ===
strict equality operator. Since both x
and y
are undefined
, the result is true.
6. What is the Output?
let x = 5;
let y = 3;
x += y \*= 2;
console.log(x);
a) 8
b) 11
c) 16
Answer: b) 11
First, y
is multiplied by 2, resulting in y
being assigned the value 6. Then, x
is increased by the value of y
(6) and becomes 11.
7. What is the output?
let price = 10;
let discount = null;
let finalPrice = price - (discount ?? 0);
console.log(finalPrice);
a) 10
b) null
c) 10 — discount
Answer: a) 10
The code snippet uses the null coalescing operator (??
) to assign the value of discount
to subtract from price
. If discount
is null or undefined, the value 0 is used as the discount. Since discount
is null, the value of price - 0
results in 10, which is assigned to finalPrice
.
8. What is the output?
let y = "Hello";
let result = y && "World";
console.log(result);
a) “Hello”
b) “World”
c) undefined
Answer: b) “World”
The code snippet uses the logical AND operator (&&
) to assign the value of "World"
to result
. Since both y
and "World"
are truthy values, the expression y && "World"
evaluates to the last truthy value, which is "World"
. Therefore, "World"
is assigned to result
.
9. What is the output?
let x;
let result = x !== null ? x : "Default";
console.log(result);
a) undefined
b) null
c) “Default”
Answer: a) undefined
The code snippet uses a conditional (ternary) operator to check if x
is not null. If it's true, x
is assigned to result
; otherwise, the value "Default" is assigned. Since x
is undefined, the condition is true, and the value "undefined" is assigned to result
.
Check more quizzes@ https://quizzesforyou.com/
References: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Expressions_and_operators