# What are logical assignment operators?

Considering the design-by-committee and implement-by-fiat nature of the JavaScript language, its evolution is surprisingly rapid. It's understandable to lose track of new language features throughout the epochs of proposal, release, and viable adoption.

Today, we're going to learn about a new syntax called **logical assignment operators**. They look like this:

a ||= 1;a &&= 1;a ??= 1;

Logical assignment operators will work in any modern browser, and they're now supported in TypeScript 4.

But what are they, and why would we use one?

## Operators

If you're reading this, it's likely you're familiar with operators. If not in name, then in practice:

10 + 5; // + is an operator

They're essentially special characters that do *something* with the two things sat either side of it (called **operands**).

Arithmetic operators like `+`

, `-`

, `*`

and `/`

are common, but there are others.

Of these "others", and of particular interest to us in this post, are **logical operators**:

`||`

OR`&&`

AND`??`

Nullish coalising

Logical operators return different operands based on their respective values. For instance, the OR operand returns the left operand if it's truthy, otherwise it returns the right one:

const a = 0 || 1; // 1

## Assignment operators

Now we know what logical operators are, how about assignment operators?

A common pattern in JavaScript is to take an existing variable and perform an operation on it while assigning the result back to the same variable:

let value = 10;value = value + 5;

Assignment operators allow us to perform this with a single shorthand operation:

let value = 10;value += 5; // 15

Again, most of us are familiar with the arithmetic assignment operators like `+=`

, `-=`

, `*=`

and `/=`

.

Just as there's **logical** operators, there are now **logical assignment operators**. But I suppose you already knew that, because the premise, title and introduction of this entire article already spoiled it. So what are they?

## Logical assignment operators

Take this variable:

let a = 0;

We can conditionally reassign it a new value using the OR operator (`||`

):

a = a || 1; // a is falsy, becomes 1

With the logical assignment operators, we can condense this expression to just:

a ||= 1;

These two snippets are identical. `||`

behaves as usual, returning the left operand if it's truthy, or the right operand if the left one is falsy.

let a = 0;a ||= 2; // a is falsy, becomes 2let b = 1;b ||= 2; // b is truthy, remains 1let c = "";c ||= "Hello"; // c is falsy, becomes "Hello"

We also have the inverse with `&&`

:

let a = 0;a &&= 2; // a is falsy, remains 0

Finally, there's the nullish coalescing operator. If you're not so familiar with this syntax it's worth understanding. Instead of checking for falsy values, it strictly checks for `null`

or `undefined`

:

let a = undefined;a = a ?? 1; // a is undefined, becomes 1let b = 0;b = b ?? 1; // b is falsy, remains 0let c = "";c = c ?? "Hello"; // c is falsy, remains ""

Again, this syntax can be condensed into its logical assignment operator shorthand:

a ??= 1; // 1;b ??= 1; // 0;c ??= "Hello"; // ""

As well as shortening self-assignment, the pattern can also be used to replace `if`

statements like this:

if (!a) {a = 1;}// Is the same asa ||= 1;

## Conclusion

Unlike many additions assignment operators aren't groundbreaking or even enabling of new patterns. But they are nice bit of syntactic sugar that being consistency between logical and arithmethic operators.