Use ESNext to write less JavaScript code!

ESNext is a name that always indicates the next version of JavaScript, Like ES6, ES7…

ECMAScript every year releases a new version of its new features as a new ES version & by these updates we have access to some new methods & ways in JavaScript.

Fewer condition codes are always one of the exciting things about ECMAScript updates, for example, we have access to optional chaining from ES2020 that makes our code much lesser than earlier ones, Let's see an example.

Without optional chaining:

With optional chaining ( ES2020+):

Wow! this is amazing, About 3 fewer lines of code, Excited? let’s learn more of these things :)

Logical Assignment Operators

ES2021 introduces three logical assignment operators including:

• Logical OR assignment operator (||=)
• Logical AND assignment operator (&&=)
• Nullish coalesing assignment operator (??=)

The Logical OR assignment operator:

The logical OR assignment operator (||=) accepts two operands and assigns the right operand to the left operand if the left operand is falsy.

The Logical AND assignment operator:

The logical AND assignment operator only assigns y to x if x is truthy:

The nullish coalescing assignment operator:

The nullish coalescing assignment operator only assigns y to x if x is null or undefined:

Summary

• The logical OR assignment (x ||= y) operator only assigns y to x if x is falsy.
• The logical AND assignment (x &&= y) operator only assigns y to x if x is truthy.
• The nullish coalesing assignment (x ??= y) operator only assigns y to x if x is nullish.

JavaScript Nullish Coalescing Operator

JavaScript nullish coalescing operator (??) that accepts two values and returns the second value if the first one is null or undefined

ES2020 introduced the nullish coalescing operator denoted by the double question marks (??). The nullish coalescing operator is a logical operator that accepts two values:

value1 ?? value2

The nullish coalescing operator returns the second value (value2) if the first value (value1) is null or undefined. Technically, the bullish coalescing operator is equivalent to the following block:

Old way

The following example uses the nullish coalescing operator (??) to return the string 'John' because the first value is null:

Newer way

Summary

• The nullish coalescing operator (??) is a logical operator that accepts two values and returns the second value if the first one is null or undefined.
• The nullish coalescing operator is short-circuited and cannot directly combine with the logical AND or OR operator.

Thanks for reading this article, I use below resources to write this article

JavaScript Tutorial