JavaScript what’s the difference between multiple equals signs?

In JavaScript you will see equals signs all over the place, from comparisons to variable setting. So when you look around and start seeing things saying if (x === ‘5’), this will help you to learn exactly what it means. These equal signs DO matter and they can ensure your coding runs exactly as intended or can lead to the introduction of unusual bugs and problems. Also people who learn JavaScript either on their own or in some informal capacity, this is a question that is occasionally used in job interviews, so this is well worth knowing!

JavaScript = assignment operator

As the title suggests, a single equals mark is known as an assignment operator. Meaning it is used to assign a value to something. This is almost entirely used for setting variables. This is easy to learn, easy to use, and one of the more straight forward parts of JavaScript. Need to create a variable? No problem, use code as shown below…

var x = 'a variable'; //here we set our variable x to a string value of 'a variable'

JavaScript what is ‘==’ for?

So now we start getting into territory where people make mistakes. In the simplest form, a double equals is a comparison operator that is NOT strict. When I say it is not strict I mean it is comparing value only and not type, meaning you can have multiple values with different types that it will equate as equal. Further you are making a comparison of value ONLY. Another thing to remember about ‘==’ is that it is also known as a type coercion operator, meaning when evaluating a statement it will actively change the type of one side to try and reach a true outcome for the statement. This is important to keep in mind, while these unusual comparisons might not be used commonly, developers can use them and it can easily trip you up if you do not understand what it is asking and deciding! Consider the code below…

var x = '5';
var y = 5;
var zero = 0;
var one = 1;

x == y; // true, while one is a string and the other is a number, they will evaluate as true since this operator finds them of equal value if it changes the type of one
zero == false; // true, the boolean value for false is 0, and this changes the type to find these equal
one == true; // true again, boolean for true is 1, these are equal as far as it is concerned
zero == undefined; // false, zero is defined but these are not equal
undefined == null; // true, these are equated as equal when not evaluating type
NaN == NaN; // false, Not a Number is not equal to anything including itself...sneaky javascript...

JavaScript ‘===’ is the strict comparison operator!

In JavaScript, you will frequently finding yourself needing to compare things and values, such as on a form checking to ensure the e-mail address and confirmation e-mail address are the same, so how do we do this and know for a fact they are absolutely equal? This is where the ‘===’ comes into play, this will check both value and type to identify when things are perfectly equal. Let’s consider some of the following…

var x = '5';
var y = 5;
var zero = 0;
var one = 1;

x == y; // true
zero == false; // true
one == true; // true

x === y; // false, with a strict comparison, a number is not equal to a string regardless of the value
zero === false; // false, strict comparisons won't equate a number with a boolean
zero === undefined; // false, zero is defined but these are not equal
NaN === NaN; // false, Not a Number is not equal to anything including itself...sneaky javascript...

While these concepts are not super complicated, it is very good to have a detailed understanding of this. These comparisons are used all the time and if your understanding in these core concepts is lacking your code will either not work, or it could very well be buggy allowing for true scenarios when it should be evaluating as false! I learned JavaScript on my own as I got better on the front-end, so these things were never taught to me, and it was not exactly super clear what the difference was for longer than I care to admit. I hope this helps others to quickly see and understand why in some instances ‘==’ and ‘===’ will provide different evaluations!