Variables store data that can be set, updated, and retrieved whenever necessary. Values that are assigned to a variable belong to a type. In JavaScript, the available types are number, string, boolean, function, and object. We also have undefined and null, along with arrays, dates, and regular expressions.

Although JavaScript has different available variable types, it is not a strongly typed language such as C/C++, C#, and Java. In strongly typed languages, we need to declare the type of the variable along with its declaration (for example, in Java, to declare an integer variable, we use int num = 1;). In JavaScript, we only need to use the keyword var, and we do not need to declare the variable type. For this reason, JavaScript is not a strongly typed language. However, there are discussions and a specification in draft mode for optional static typing (https://github.com/dslomov/typed-objects-es7) that can become part of the JavaScript specification (ECMAScript) in the future. We can also use TypeScript in case we want to type our variables when working with JavaScript. We will learn more about ECMAScript and TypeScript later in this chapter.

The following is an example of how to use variables in JavaScript:

var num = 1; // {1} 
num = 3; // {2} 
var price = 1.5; // {3} 
var myName = 'Packt'; // {4} 
var trueValue = true; // {5} 
var nullVar = null; // {6} 
var und; // {7}

If we want to see the value of each variable we declared, we can use console.log to do so, as listed in the following code snippet:

console.log('num: ' + num); 
console.log('myName: ' + myName); 
console.log('trueValue: ' + trueValue); 
console.log('price: ' + price); 
console.log('nullVar: ' + nullVar); 
console.log('und: ' + und); 

The console.log method also accepts more than just arguments. Instead of console.log('num: ' + num), we can also use console.log('num: ', num). While the first option is going to concatenate the result into a single string, the second option allows us to add a description and also visualize the variable content in case it is an object.

We will discuss functions and objects later in this chapter.

var myVariable = 'global'; 
myOtherVariable = 'global'; 
 
function myFunction() { 
  var myVariable = 'local'; 
  return myVariable; 
} 
 
function myOtherFunction() { 
  myOtherVariable = 'local'; 
  return myOtherVariable; 
} 
 
console.log(myVariable); //{1} 
console.log(myFunction()); //{2} 
 
console.log(myOtherVariable); //{3} 
console.log(myOtherFunction()); //{4} 
console.log(myOtherVariable); //{5} 

We need operators when performing any operation in a programming language. JavaScript also has arithmetic, assignment, comparison, logical, bitwise, and unary operators, among others. Let's take a look at these:

var num = 0; // {1}  
num = num + 2; 
num = num * 3;  
num = num / 2;  
num++; 
num--; 
 
num += 1; // {2} 
num -= 2; 
num *= 3; 
num /= 2; 
num %= 3; 
 
console.log('num == 1 : ' + (num == 1)); // {3}  
console.log('num === 1 : ' + (num === 1));  
console.log('num != 1 : ' + (num != 1));  
console.log('num > 1 : ' + (num > 1)); 
console.log('num < 1 : ' + (num < 1));  
console.log('num >= 1 : ' + (num >= 1));  
console.log('num <= 1 : ' + (num <= 1)); 
 
console.log('true && false : ' + (true && false)); // {4}  
console.log('true || false : ' + (true || false));  
console.log('!true : ' + (!true)); 

In line {1}, we have the arithmetic operators. In the following table, we have the operators and their descriptions:

In line {2}, we have the assignment operators. In the following table, we have the operators and their descriptions:

In line {3}, we have the comparison operators. In the following table, we have the operators and their descriptions:

Finally, in line {4}, we have the logical operators. In the following table, we have the operators and their descriptions:

JavaScript also supports bitwise operators, which are shown as follows:

console.log('5 & 1:', (5 & 1)); 
console.log('5 | 1:', (5 | 1)); 
console.log('~ 5:', (~5)); 
console.log('5 ^ 1:', (5 ^ 1)); 
console.log('5 << 1:', (5 << 1)); 
console.log('5 >> 1:', (5 >> 1)); 

The following table contains a more detailed description of the bitwise operators:

The typeof operator returns the type of the variable or expression. For example, have a look at the following code:

console.log('typeof num:', typeof num); 
console.log('typeof Packt:', typeof 'Packt'); 
console.log('typeof true:', typeof true); 
console.log('typeof [1,2,3]:', typeof [1,2,3]); 
console.log('typeof {name:John}:', typeof {name:'John'}); 

The output will be as follows:

typeof num: numbertypeof Packt: stringtypeof true: booleantypeof [1,2,3]: objecttypeof {name:John}: object

According to the specification, there are two data types in JavaScript:

JavaScript also supports the delete operator, which deletes a property from an object:

var myObj = {name: 'John', age: 21}; 
delete myObj.age; 
console.log(myObj); //outputs Object {name: "John"} 

In this book's algorithms, we will be using some of these operators.

In JavaScript, true and false are a little bit tricky. In most languages, the boolean values true and false represent the true/false results. In JavaScript, a string such as Packt evaluates to true.

The following table can help us better understand how true and false work in JavaScript:

Let's consider some examples and verify their output:

function testTruthy(val) { 
  return val ? console.log('truthy') : console.log('falsy'); 
} 
 
testTruthy(true); // true 
testTruthy(false); // false 
testTruthy(new Boolean(false)); // true (object is always true) 
 
testTruthy(''); // false 
testTruthy('Packt'); // true 
testTruthy(new String('')); // true (object is always true) 
 
testTruthy(1); // true 
testTruthy(-1); // true 
testTruthy(NaN); // false 
testTruthy(new Number(NaN)); // true (object is always true) 
 
testTruthy({}); // true (object is always true) 
 
var obj = { name: 'John' }; 
testTruthy(obj); // true 
testTruthy(obj.name); // true 
testTruthy(obj.age); // age (property does not exist) 

The two equals operators supported by JavaScript can cause a little bit of confusion when working with them.

When using ==, values can be considered equal even when they are of different types. This can be confusing even for a senior JavaScript developer. Let's analyze how == works using the following table:

If x and y are of the same type, then JavaScript will use the equals method to compare the two values or objects. Any other combination that is not listed in the table gives a false result.

The toNumber and toPrimitive methods are internal and evaluate the values according to the tables that follow.

The toNumber method is as follows:

Finally, toPrimitive is as follows:

Let's verify the results of some examples. First, we know that the output of the following code is true (string length > 1):

console.log('packt' ? true : false); 

Now, what about the following code? Let's take a look:

console.log('packt' == true); 

The output is false, so let's understand why:

What about the following code? Let's take a look:

console.log('packt' == false); 

The output is also false, and the following is why:

What about the === operator? This is much easier. If we are comparing two values of different types, the result is always false. If they have the same type, they are compared according to the following table:

If x and y are different types, then the result is false. Let's consider some examples:

console.log('packt' === true); //false  
console.log('packt' === 'packt'); //true 
var person1 = {name:'John'};  
var person2 = {name:'John'}; 
console.log(person1 === person2); //false, different objects 

JavaScript has a similar set of control structures as the C and Java languages. Conditional statements are supported by if...else and switch. Loops are supported by the while, do...while, and for constructs.

var num = 1; 
if (num === 1) { 
  console.log('num is equal to 1'); 
} 

var num = 0; 
if (num === 1) { 
  console.log('num is equal to 1'); 
} else { 
  console.log('num is not equal to 1, the value of num is ' + num); 
} 

if (num === 1) { 
  num--; 
} else { 
  num++; 
} 

(num === 1) ? num-- : num++; 

var month = 5; 
if (month === 1) { 
  console.log('January'); 
} else if (month === 2) { 
  console.log('February'); 
} else if (month === 3) { 
  console.log('March'); 
} else { 
  console.log('Month is not January, February or March'); 
} 

var month = 5; 
switch (month) { 
  case 1: 
    console.log('January'); 
    break; 
  case 2: 
    console.log('February'); 
    break; 
  case 3: 
    console.log('March'); 
    break; 
  default: 
    console.log('Month is not January, February or March'); 
} 

for (var i = 0; i < 10; i++) { 
  console.log(i); 
} 

var i = 0; 
while (i < 10) { 
  console.log(i); 
  i++; 
} 

var i = 0; 
do { 
  console.log(i); 
  i++; 
} while (i < 10); 

Functions are very important when working with JavaScript. We will also use functions in our examples.

The following code demonstrates the basic syntax of a function. It does not have arguments or the return statement:

function sayHello() { 
  console.log('Hello!'); 
} 

To execute this code, we simply use the following statement:

sayHello(); 

We can also pass arguments to a function. Arguments are variables with which a function is supposed to do something. The following code demonstrates how to use arguments with functions:

function output(text) { 
  console.log(text); 
} 

To use this function, we can use the following code:

output('Hello!'); 

You can use as many arguments as you like, as follows:

output('Hello!', 'Other text'); 

In this case, only the first argument is used by the function, and the second one is ignored. A function can also return a value, as follows:

function sum(num1, num2) { 
  return num1 + num2; 
} 

This function calculates the sum of two given numbers and returns its result. We can use it as follows:

var result = sum(1, 2); 
output(result); // outputs 3 

JavaScript objects are very simple collections of name-value pairs. There are two ways of creating a simple object in JavaScript. The first way is as follows:

var obj = new Object(); 

And the second way is as follows:

var obj = {}; 

We can also create an entire object, as follows:

obj = { 
  name: { 
    first: 'Gandalf', 
    last: 'the Grey' 
  }, 
  address: 'Middle Earth' 
}; 

As we can see, to declare a JavaScript object, [key, value] pairs are used, where the key can be considered an attribute of the object and the value is the property value. All classes that we will create in this book are JavaScript objects, such as Stack, Set, LinkedList, Dictionary, Tree, Graph, and so on.

In Object-oriented programming (OOP), an object is an instance of a class. A class defines the characteristics of the object. For our algorithms and data structures, we will create some classes that will represent them. This is how we can declare a class (constructor) that represents a book:

function Book(title, pages, isbn) { 
  this.title = title; 
  this.pages = pages; 
  this.isbn = isbn; 
} 

To instantiate this class, we can use the following code:

var book = new Book('title', 'pag', 'isbn'); 

Then, we can access its properties and update them as follows:

console.log(book.title); // outputs the book title 
book.title = 'new title'; // update the value of the book title 
console.log(book.title); // outputs the updated value 

A class can also contain functions (generally also referred to as methods). We can declare and use a function/method as the following code demonstrates:

Book.prototype.printTitle = function() { 
  console.log(this.title); 
}; 
 
book.printTitle(); 

We can declare functions directly inside the class definition as well:

function Book(title, pages, isbn) { 
  this.title = title; 
  this.pages = pages; 
  this.isbn = isbn; 
  this.printIsbn = function() { 
    console.log(this.isbn); 
  }; 
} 
book.printIsbn();