Programming is mostly working with data. We can set data manually, or initiate value as a result of algorithm execution. However, in all of these scenarios, the developer (or the algorithm) must perform an assignment operation at a certain time. This means that to use any variable (object, array, etc.), after its initialization, we must specify what data will be stored in it.

In JavaScript, as in most programming languages, assignment occurs using the = operator. This symbol has become the preferred designation, primarily due to mathematical calculations. Also in JavaScript there are variations of this operator with other signs, which, together with the assignment, perform additional actions.

Syntax

The assignment syntax is very simple: to the left of the operator (=) there must be a variable that will be assigned a value from the right of it. At the same time, it is important to preserve the correspondence of data types and syntax for complex structures that simultaneously contain several values. Let's drop some examples.

Setting the values of variables:

let a = 3;
let b = 'word';
let c = 2+2;

Initializing an array with given values:

let numbers = [10, 20, 30, 40, 50];

Assigning a value to a single cell in an array:

numbers[0] = 100;

The main assignment operator is the = sign, but there are other operators in JavaScript which implement similar functions. As a rule, they are specified through the combination OF = with other signs and are used to initialize additional operations together with or before the main one.

Assignment performing is sequential, so it is possible to assign several variables at once to a common value, for example:

a = b = c = 10;

The new value must be specified to the right of the operator, so the logic of line execution will be as follows: A is assigned to B, which will be assigned to C, which will equal 10. As a result, all three variables will obtain the value of 10, remaining independent from each other.

Mathematical assignment operators

When you use mathematical operators, you need to customize the result output. In one line, mathematical assignment operators allow performing an arithmetic operation and setting its result to the left operand. In fact, they combine 2 actions into 1, allowing to create more concise code. 

The syntax for the mathematical assignment operators:

let a = 10;

  • Addition (+=)

console.log(a += 2);

Result

12

Note that, like the normal addition operator (+), this operator can also be used with strings (concatenation).

  • Subtraction (-=)

console.log(a -= 2);

Result

8

  • Multiplication (*=)

console.log(a *= 2);

Result

20

  • Division (/=)

console.log(a += 2);

Result

5

  • Remainder (%=)

console.log(a %= 2);

Result

0

  • Exponentiation (**=)

console.log(a **= 2);

Result

100

Bitwise assignment operators

Bitwise operators operate on bitwise variables. If we apply them to numbers, operations will be performed on the 32-bit sequence (binary code) and returned back in the decimal system. These operators are good for solving issues that require access to non-converted data types, but they can also be used to work with conventional data types such as numbers and texts.

  • Bitwise XOR (^=)

It checks the bit representations of two variables. Returns 1 if one of the two bits equals 1, in all other cases returns 0. As it is an assignment operator, the returned value will be assigned to the original variable (left operand). The syntax and example of this operator's behavior:

let a = 13;
let b = 14;
console.log(a ^= b);

Result

3

To understand this result, let's repeat the operator's actions manually, converting the numbers into bit values (zeros and ones of the binary code).

a = 3 = 1101;
b = 14 = 1110;

Now let's write these numbers under each other and compare the values according to the algorithm of the operator.

1101
1110
0011

We convert the resulting value back to a decimal number and get 7, same as after the operator execution. Due to the built-in ability to convert any data type to a bit sequence, bit operators are universal and can be applied to most data types, often to facilitate comparison of values. All bitwise operators and bitwise assignment operators follow these principles, varying in comparison rules.

  • Bitwise OR (|=)

The OR operator has only one difference from AND. During comparison, it returns 1 if one or both of the bits are 1. Applying it in our example, we will get the result - 15.

let a = 13;
let b = 14;
console.log(a |= b);

Result

15

The bit representation of its work will look like this:

1101
1110
1111

  • Bitwise AND (&=)

Returns 1 only if both bits were 1. According to our example, we would get the result - 12:

let a = 13;
let b = 14;
console.log (a &= b);

Result

12

As bits:

1101
1110
1100

Shift assignment operators

It is a group of assignment operators that have shift values in their binary interpretations (bit values) and return the modified numbers in decimal.

  • Left Shift (<<=)

It shifts number bits on the left by the specified number of positions, and fills the vacant positions on the right by 0. The result of the shift will be returned in decimal form and assigned to the original number.

let a = 13;
let b = 2;
console.log(a<<=b);

Result

52

As bits:

1101 – original number (13)

110100 – number (52) whose bits appear after shift by 2 (variable b)

  • Right Shift (>>=)

This operator shifts the first (and next) bits of a number to the right by the specified number of digits. Extra bits will be discarded, so the resulting number will always be less than the original one. 

The result of executing the operator will be returned as the usual decimal number and assigned to the original variable. If the size of the shift is greater than the number of digits of the original number, then a zero value will be returned. 

During the shifting, all values ​​to the left will be discarded. It is also important to take into account that the result of executing this operator will always be a positive number, regardless of the sign of the original number.

let a = 13;
let b = 2;
console.log(a>>=b);

Result

3

As bits:

1101 – original number (13)

11 – number (3) whose bits appear after shift by 2 (variable b)

  • Unsigned Right Shift (>>>=)

The main difference between this operator and Right Shift is that during execution it takes into account the sign of the original number. If the original number is negative, calculations will be carried out according to the rules for negative numbers. The result will also be negative.

How it works:

let a = -13;
let b = 2;
console.log(a>>>=b);

Result

-4

As bits:

-1101 – original number (13)

-0100– number (-4) whose bits appear after shift by 2 (variable b)

Logical assignment operators

This group of operators is intended primarily for checking left operand value status. If the condition is met, the value of the right operand will be assigned to the left operand.

  • Logical AND assignment (&&=)

It performs assignment only if the value of the left operand is valid (true, Date, Infinity, non-zero numbers, non-empty strings). Example:

let a = 10;
let b = "";
console.log(a &&= 5);
console.log(b &&= 5);

Result

5
""

Variable a had a positive value (10), so it passed the test and got a new value (5). The variable b had no valid value, so it failed the logical test and stayed unchanged.

  • Logical OR assignment (||=)

It assigns a new value only if the value of the left operand is invalid (0, undefined, null, false, NaN, empty string).

let a = 4;
let b = "";
console.log(a ||= 12);
console.log(b ||= 12);

Result

4
12

Only the b variable passed the logical check so its value was changed to a new one. The variable a is valid and therefore it remains unchanged.

  • Logical nullish assignment (??=)

It works if the left operand is nullish (undefined or null).

let a = null;
let b = 3;
console.log(a ??= 7);
console.log(b ??= 7);

Result

7
3

The a variable had the required value to pass the logical check, so a new value was assigned to it.

Test yourself

  • Task 1. Shift the bits of numbers 57 and 48 by 1 to the left and print the variable whose value will be equal to the sum of the two new numbers.

Solution

This task is being tackled gradually. First, create the variables a and b and assign numbers 57 and 48 to them, respectively. Then apply the Left Shift statement to each variable in turn. According to the condition, the sum must be assigned to one of the variables, so we also have to use the Addition Assignment operator to the variable a.

let a = 57;
let b = 48;
a <<= 1;
b <<= 1;
a+=b;
console.log(a);

Result

210

According to the mathematical rules for summation in the fifth line, you can also swap the arguments. A similar solution will be correct and equivalent to the given one, if it will output the b variable.

  • Task 2. Print to the console the comparison of numbers 17 and 54 using the bitwise operators AND, OR, and XOR, and assign the results to a variable for the first number.

Solution

Let's assign the given values to the variables and set the bitwise assignment statements directly in the methods for output to the console. The results must be assigned to the first variable, so we will manually restore the variable's original value after each bitwise statement execution.

let a = 17;
let b = 54;
console.log(a ^= b);
a = 17;
console.log(a |= b);
a = 17;
console.log(a &= b);

Result

39
55
16

  • Task 3. Set the specified values to 10 if they meet the logical AND assignment condition. Output the results of the checks to the console. Values: NaN, "text", -1.

let a = NaN;
let b = "text";
let c = -1;
console.log(a &&= 10);
console.log(b &&= 10);
console.log(c &&= 10);

Result

NaN
10
10

  • Task 4. Set the given values to 20 if they meet the logical OR assignment condition. Output the results of the checks to the console. Values: false, "", 2.

let a = false;
let b = "";
let c = 2;
console.log(a &&= 20);
console.log(b &&= 20);
console.log(c &&= 20);

Result

false
""
20

  • Task 5. Set the specified values to 30 if they meet the logical nullish assignment conditions. Output the results to the console. Values: null, -5, "text", true.

let a = null;
let b = -5;
let c = "text";
console.log(a &&= 30);
console.log(b &&= 30);
console.log(c &&= 30);

Result

null
30
30