JavaScript Made Easy: Part 5

Last post we left off with arithmetic operators. This time we will be diving a little deeper into operators. As always, open up your repl and follow along with this post. Make sure you log each of these concepts to the console so you can get some hands-on experience.

Increment and Decrement

We reviewed these types of operators in Part 4, but I would like to go a little more in-depth. The increment operator (++) adds on to a number. The decrement operator (--) subtracts one from a number. However, the order in which the operator appears makes a difference. Here is an example from a reader:

// Contrast this
a = 1
b = a++
console.log(a, b) // 2 1

// with this
a = 1
b = ++a
console.log(a, b) // 2 2

In the first example, the increment operator was behind the variable, therefore (b) was set to the value of (a) before (a) was incremented. When they were logged to the console, (a) had been incremented, but (b) had not. The opposite is true for the second example because the incrementor was in the front of the variable. Take some time to experiment with this in your repl.

String Operators

The + operator that we learned about in the arithmetic section can also be used to concatenate strings. That is a fancy word that means adding strings together. Example:

const firstName = "David";
const lastName = "Tetreau";
const fullName = firstName + " " + lastName;
console.log(fullName); //expected result "David Tetreau"

Notice that it is necessary to add an empty string between the variables to ensure that the two strings are spaced apart when they are concatenated.

Assignment Operators

The += assignment operator can also be used to concatenate strings: Example:

//expected result "I am one string"
const string1 = "I am ";
string1 += "one string";

Template Strings

A newer way to do this is to use template literals or template strings. Template strings are new as of 2015. They are a way
of writing strings where you do not have to concatenate,
and you can insert variables within the template strings.
You have to use backticks instead of quotations. Also, you have to use a dollar sign and curly braces when inserting a variable. Here is an example :

const secondHalf = "a template string sentence";
const templateStringSentence = `This is ${secondHalf}.`

Adding Strings and Numbers

If you add strings and numbers, the result is a string.


expected result is the string "55". It will be white text on the console in replit. Numbers and other data types appear as red text; 
const stringsAndNumbers = "5" + 5;

Comparison Operators

These operators become very important when we get to the topic of conditional statements. For now, just become familiar with these operators and pay particular attention to the difference between equal and strict equal.

== equal
=== strict equal


returns true
this does not 
check data type
console.log(3 == "3");

returns false
this does check
data type
console.log(3 === "3");

!= not equal
!== not equal


returns false
does not check 
data type
console.log(1 != "1");

returns true 
checks data 
console.log(1 !== "1");

greater than
< less than
= greater than or equal to
<= less than or equal to


//returns true 
console.log(3 > 1); 

//returns true
console.log(1 < 3);

//returns true
console.log(1 >= 1);

//returns true
console.log(3 <= 3);

? ternary operator

Using a ternary operator is a simple as saying, “if this condition is true, do this expression, otherwise do that expression”

The syntax is as follows:

condition ? exprIfTrue : exprIfFalse


let age = 19;
const canDrive = age > 16 ? 'yes' : 'no';

//expected result is “yes”

Logical Operators

&& logical and
|| logical or
! logical not


const condition1 = true;
const condition2 = false;

the expected output is false 
because both have to be true 
when using the && operator
console.log(condition1 && condition2);

the expected output is true
because only one condition
has to be true when using
the or operator
console.log(condition1 || condition2);

the expected output is false
because we are using the not
operator. It returns the opposite.

Type Operators

Returns the type of a variable

//expected output is "string"
const stringExample = "I am a string";

There are also instanceof operators, but we cover those when we talk about objects.

I hope you have enjoyed this post! Please check out the entire "JavaScript Made Easy" series by David Tetreau. There will be a new post daily.