DEV Community

Cover image for JavaScript Quiz #04 — JavaScript Operators and Precedence
Quizzesforyou
Quizzesforyou

Posted on • Edited on • Originally published at Medium

JavaScript Quiz #04 — JavaScript Operators and Precedence

Checkout the interactive quiz of this story here https://quizzesforyou.com/quiz/jsoperators

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
Enter fullscreen mode Exit fullscreen mode

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!"
Enter fullscreen mode Exit fullscreen mode

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'
Enter fullscreen mode Exit fullscreen mode

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);
Enter fullscreen mode Exit fullscreen mode

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);
Enter fullscreen mode Exit fullscreen mode

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);
Enter fullscreen mode Exit fullscreen mode

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);
Enter fullscreen mode Exit fullscreen mode

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);
Enter fullscreen mode Exit fullscreen mode

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);
Enter fullscreen mode Exit fullscreen mode

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);
Enter fullscreen mode Exit fullscreen mode

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);
Enter fullscreen mode Exit fullscreen mode

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);
Enter fullscreen mode Exit fullscreen mode

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

Top comments (0)