JavaScript, Deconstructed: Assignment Operator (=)

Web developer
What are operators in JavaScript?
The main purpose of operators in JavaScript is to perform operations of various kinds on variables and their respective values by allocating and combining data with specific instructions.
This article explores the different ways in which the assignment operator can be used to perform different kinds of operations and also how the JavaScript engine( V8 from Google) handles such operations.
In JavaScript, variables can also refer to object properties.
//Variable
let redCard
//Object property
myBanana.colour
Both redCard and myBanana.colour are essentially the same.
Primary Use
The assignment operator is mainly used to assign values to variables.
Const randomNumber = 23
Here, the number on the right also known as the right operand is assigned to the left operand variable randomNumber after the variable is declared.
However, the simple act of declaring a variable, doesn't include the use of the assignment operator.
//This declares myVan without initializing it
let myVan;
//This will output undefined since no value has been assigned to myVan
console.log(myVan)
//This assigns the string "Stolen" to myVan
myVan = "Stolen"
//This will output "Stolen" since myVan now has a value
console.log(myVan)
How V8 handles assignment operator in memory
Any time you initialize a variable(for example const randonNumber = 23 )the following actions take place in memory:
Declaration: The JavaScript engine has been programmed to recognize
const randomNumberas a declaration(constbeing the identifier) and so when it does, it will allocate some space in memory for the variablerandomNumber.Initialization: Because
constrequires an initial value, the number23is immediately stored in the memory space allocated torandomNumbersince aconstvariable cannot be declared without being initialized.//This will throw an error const randomNumber;Storage: Since the value
23is a primitive number it is stored directly in memory. An object however will have its reference stored in memory and it's contents stored elsewhere.
Compound assignment operators(+=,-=,*=,/=)
Apart from assigning values to variables, the assignment operator can also be used together with other operators(-+*/) to perform an operation on a variable, then assign the result of said operation back to a variable.
Compound assignment operators allow programmers to express a binary operation together with the assignment operator, in a compact syntax.
Addition assignment(+=): This operator performs an addition operation on a variable and then assigns the result back to that same variable.
//Assigns 2 to smallNumber let smallNumber = 2 //Adds 3 to smallNumber and assigns the result to smallNumber smallNumber += 3 //This outputs 5 console.log(smallNumber)From the above example
smallNumber += 3is the same assmallNumber = smallNumber + 3Subtraction assignment(-=): This operator performs a subtraction operation on a variable and then assigns the result to the same variable.
//Assigns 7 to smallNumberTwo let smallNumberTwo = 7 /* Subtracts 3 from smallNumberTwo and assigns the result to smallNumberTwo*/ smallNumberTwo -= 3 //This outputs 4 console.log(smallNumberTwo)From the above example
smallNumberTwo -= 3is the same assmallNumberTwo = smallNumberTwo - 3Multiplication Assignment(*=): This operator performs a multiplication operation on a variable and then assigns the result to the same variable.
//Assigns 5 to smallNumberThree let smallNumberThree = 5 /* Multiplies smallNumberThree by 4 and assigns the result to smallNumberThree*/ smallNumberThree *= 4 //This outputs 20 console.log(smallNumberThree)From the above example
smallNumberThree *= 4is the same assmallNumberThree = smallNumberThree * 4Division Assignment (/=): This operator performs a division operation on a variable and then assigns the result to the same variable.
//Assigns 9 to smallNumberFour let smallNumberFour = 9 /* Divides smallNumberFour by 3 and assigns the result to smallNumberFour*/ smallNumberFour /= 3 //This outputs 3 console.log(smallNumberFour)
How V8 performs compound assignment operations in memory
The following steps show what happens in memory when we perform compound assignment operations. The following code is used to explain the steps.
Let shoeSize = 9
shoeSize += 3
Addition Step: When the operation is performed(
shoeSize + 3), V8 first retrieves the value ofshoeSizefrom memory, then adds3to it. This operation does not change the original value ofshoeSizein memory; instead, it creates a new value in a temporary location in memory.Assignment Step: The assignment operation will then store the result back into the original memory location associated with
shoeSizeby updating it, provided it was previously declared withletorvar.Declaring a variable using
constmeansshoeSizecannot be reassigned which is what happens during compound assignment operations (a new value is assigned after the compound assignment operation has taken place)
If you're familiar with big O notation and time complexity keep reading if you're not I suggest you save this section for later.
Time complexity of assignment operations
The time complexity of assignment operations, is O(1) which means if you’re assigning one value to a variable, one element in an array, or one property in an object, the operation completes in one single step. The time it takes does not increase with the size of the data type. The same applies to compound assignment operations involving primitive data types.
However the time complexity of assigning a variable to more than one element in an array and an object has a time complexity of O(n) since the time it takes to run the algorithm grows linearly with the size of the input.
//This has a time complexity of O(1)
let aNumber = 1
//This has a time complexity of O(1)
let anotherNumber =3488577383772
//This has a time complexity of O(n)
let array = [1,2,3,4,5,6]
In conclusion
JavaScript assignment operators play a crucial role when it comes to data storage and manipulation in web development and so are an essential tool for the software engineer.
JavaScript engine is a program that reads and executes JavaScript code in the browser and sometimes in the backend by translating JavaScript code into machine code. Nodejs runs JavaScript code in the backend with the help of Google's V8 engine.
Mozilla Firefox uses its own engine called SpiderMonkey.
*/



