JavaScript tricky question and answer

JavaScript tricky question part 1

1. What is the output of the following code?

console.log(2 + '2' - 1);

Answer: The output of the code is '21'.

Explanation: In JavaScript, the + operator is used for both addition and string concatenation. When JavaScript encounters an expression involving both numbers and strings, it follows a process known as "type coercion" to determine the appropriate behaviour.

In the given code, the expression 2 + '2' is evaluated first. Since one of the operands is a string ('2'), JavaScript performs string concatenation instead of addition, resulting in the string '22'.

Next, the expression '22' - 1 is evaluated. When a mathematical operation, such as subtraction, is performed on a string, JavaScript tries to convert the string into a number. In this case, the string '22' can be successfully converted into the number 22. Therefore, the expression '22' - 1 results in the number 21.

Finally, the console.log function outputs the value 21.

Example:

console.log(2 + '2' - 1);

Output:

21

Note: JavaScript’s type coercion can sometimes lead to unexpected results, so it’s important to be aware of how operators behave and how values are converted between types.

2. What is the output of the following code?

console.log(2 + '2' + 1); 

Answer: The output of the code is '221'.

Explanation:

1. Addition of 2 and '2':

• The first operation is 2 + '2'.
• Since the + operator encounters a number (2) on the left and a string ('2') on the right, JavaScript performs string concatenation.
• The number 2 is implicitly converted to a string, and the concatenation results in '22'.

2. Concatenation of '22' and 1:

• Now, we have the intermediate result '22'.
• The next operation is '22' + 1.
• Again, the + operator encounters a string ('22') on the left and a number (1) on the right.
• JavaScript performs string concatenation since one of the operands is a string.
• The number 1 is implicitly converted to a string, and the concatenation results in '221'.

3. Logging the final result:

• The console.log() function is used to output the result of the expression.
• The final result of '221' is logged to the console.

Conclusion:

Therefore, when you execute console.log(2 + '2' + 1), it will output '221' to the console. The expression first concatenates 2 and '2' to form '22', and then concatenates '22' and 1 to form '221'.

3. What is the output of the following code?

console.log([] + []);

Answer: The output of the code is an empty string "".

Explanation: In JavaScript, when the + operator is used with arrays, it performs array-to-string conversion. When an array is converted to a string, JavaScript implicitly calls the Array.prototype.toString() method.

The Array.prototype.toString() method joins all the elements of an array into a single string, with each element separated by a comma. However, if the array is empty, it results in an empty string.

In the given code, we have two empty arrays []. When JavaScript performs array-to-string conversion using the + operator, both arrays are converted to empty strings. Then, the + operator concatenates the two empty strings, resulting in an empty string "".

Finally, the console.log function outputs the value "".

Example:

console.log([] + []);

Output:

""

Note: JavaScript’s behaviour with array-to-string conversion can be a bit unintuitive, so it’s important to understand how operators and methods work with arrays.

4. What is the output of the following code?

console.log(1 < 2 < 3);

Answer: The output of the code is true.

Explanation: In JavaScript, the < operator is used for comparison. When comparing two values using the < operator, JavaScript performs a "left-to-right" evaluation.

In the given code, the expression 1 < 2 is evaluated first. Since 1 is less than 2, the result of this comparison is true.

Then, the expression true < 3 is evaluated. Here's where it gets interesting. JavaScript performs type coercion in this case. The boolean value true is converted to the number 1, and the expression becomes 1 < 3. Since 1 is less than 3, the final result is true.

Finally, the console.log function outputs the value true.

Example:

console.log(1 < 2 < 3);

Output:

true

Note: The < operator has left-to-right associativity, and when comparing values with different types, JavaScript performs type coercion. It's important to be aware of how operators work and how values are compared in JavaScript to avoid unexpected results.

5. What is the output of the following code?

console.log(2 === [2]);

Answer: The output of the code is false.

Explanation: In JavaScript, the === operator is the strict equality operator. It compares both the value and the type of the operands. When comparing an array and a number using the strict equality operator, they are considered different types, resulting in false.

In the given code, we have the number 2 on the left side and an array [2] on the right side. Since the operands have different types (number and object), the strict equality operator immediately returns false without performing any further comparison.

Finally, the console.log function outputs the value false.

Example:

console.log(2 === [2]);

Output:

false

Note: JavaScript’s strict equality operator (===) is used to compare both the value and the type of operands. It's important to understand the difference between strict equality (===) and loose equality (==) in JavaScript to avoid unexpected comparison results.

6. What is the output of the following code?

console.log(typeof NaN);

Answer: The output of the code is 'number'.

Explanation: In JavaScript, NaN stands for "Not a Number" and represents a value that is not a valid number. Despite its name, typeof NaN returns 'number'.

The reason for this is that NaN is considered a numeric value of the special type "Number" in JavaScript. It is a specific value that indicates that a mathematical operation resulted in an undefined or UN re presentable value.

When the typeof operator is used with NaN, it returns 'number' because NaN is still classified as a numeric value, albeit a special one.

Finally, the console.log function outputs the value 'number'.

Example:

console.log(typeof NaN);

Output:

'number'

Note: The behaviour of NaN can be a bit peculiar in JavaScript, and it is important to understand how it behaves in mathematical operations and comparisons.

Here are some additional high-quality tutorials for you to explore:

1. JavaScript interview Question and Answer
2. Node Js Interview Question and Answer
3. JavaScript Tricky Question
4. JavaScript Array Interview Questions