Hello, fellow JavaScript developers! Today, we will discuss some weird JavaScript cases that you might encounter while working with the language.

+ Operator

the ‘+’ operator in JavaScript. It’s crucial to know that the type of the operands involved affects the behavior of this operator.

When both operands are numbers, the ‘+’ operator performs addition. For example:

const num1 = 5;
const num2 = 10;
const result = num1 + num2; // Outputs: 15

However, if one operand is a different type, like a string, it switches to concatenation. Let’s see it in action:

const num = 5;
const str = "10";
const result = num + str; // Outputs: "510"

When one of the operands is an array or an object, the + operator performs type coersion and then concatenation. Consider this expression:

1 + [1,2,3,4] // '11,2,3,4'

In the expression 1 + [1,2,3,4], the first operand is a number (1) and the second operand is an array [1,2,3,4]. Since one of the operands is not a number, the + operator performs concatenation.

When an array is concatenated with a string or a number, it is converted to a string by joining all the elements of the array with commas (,). So in this case, [1,2,3,4] is converted to the string "1,2,3,4".

Then, the number 1 is also converted to a string and concatenated with the string "1,2,3,4", resulting in the string "11,2,3,4".

Therefore, the expression 1 + [1,2,3,4] evaluates to the string "11,2,3,4".

Similarly if its an object, first object will be converted to string . Objects converts to [object object] .

1 + {} // '1[object Object]'

Takeaway: Pay attention to the types of operands when using the ‘+’ operator in JavaScript. It can either perform addition or concatenation depending on the types involved.

- Operator

We saw that if we use ‘+’ with different type it will concatenate them.

So why is

9 + '1' // 91

91 - '1' // 90

We know that JavaScript performs type coercion and the case of “+” is special case because of the concatenation ability.

In the ‘-’ there is only one operation the subtraction so JavaScript will convert the types to number and then perform the subtraction operation.

If we do it with an operand which can not be converted to number we will get NaN

9 - "aa1" // NaN

[] == 0

[] == 0 // true
[1,2] == 0 // false

In JavaScript, the == operator is used for loose equality comparison. It compares two values for equality, performing type coercion if necessary.

In the expression [] == 0, the first operand is an empty array ([]) and the second operand is the number 0. Since the operands have different types, JavaScript performs type coercion to make them comparable.

During type coercion, an empty array is converted to an empty string (“”). Then, the empty string is converted to the number 0.

💡 [1,3] This array is first converted to string which becomes the string ‘1,3’ and then >it is converted to number, since it can not be converted to number the result of type coer>sion is NaN.
NaN == 0 is false

After type coercion, the expression becomes 0 == 0. Now both operands are numbers, and JavaScript compares them for equality. In this case, both operands have the same value of 0, so the expression evaluates to true.

Therefore, the expression [] == 0 evaluates to true.

true == 1 and true === 1

true == 1 evaluates to true because JavaScript coerces the boolean value true to the number 1, and both operands have the same value of 1.

true === 1 evaluates to false because the === operator performs strict equality comparison without any type coercion. The boolean value true and the number 1 have different types, so the expression evaluates to false.

true + true + true === 3

The boolean values true are coerced into numbers by JavaScript and are turned into 1s. Therefore

true + true + true === 3

becomes

1 + 1 + 1 === 3

which is true.

I hope that you found this blog post helpful. Happy coding!