Variables store data that can be set, updated, and retrieved whenever needed. Values that are assigned to a variable belong to a type. In JavaScript, the available types are numbers, strings, Booleans, functions, and objects. We also have undefined and null, along with arrays, dates, and regular expressions.

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 name = 'Packt'; //{4} 
var trueValue = true; //{5} 
var nullVar = null; //{6} 
var und;  //{7} 

        console.log("num: "+ num); 
        console.log("name: "+ name); 
        console.log("trueValue: "+ trueValue); 
        console.log("price: "+ price); 
        console.log("nullVar: "+ nullVar); 
        console.log("und: "+ und); 

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

The console.log method also accepts more than just arguments. Instead of console.log("num: "+ num), we can also use console.log("num: ", num).

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)); 

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

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

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

Finally, on 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: number 
typeof Packt: string 
typeof true: boolean 
typeof [1,2,3]: object 
typeof {name:John}: object

JavaScript also supports the delete operator, which deletes a property from an object. Take a look at the following code:

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

In this book's algorithms, we will use 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" has the value true, for example.

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); //false (age does not exist) 

The two equal 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 presented here:

Finally, toPrimitive is presented here:

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 are the steps:

What about the === operator? It 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