Introduction to Data Structures and Algorithms with Modern JavaScript
Tags: luxdev, 100daysofcode, algorithms, beginners
Published: 2022-02-21 19:49:41

**Definition of Terms**

A **Data Structures** is a mode of organizing and storing data in a computer for easy modification and access.
Data structures refers to the collection of data values and their relationship, and the operations that can be performed on the data.
Data structures in JavaScript include: linked lists, queues, stack, heap, trees and hash table.

**Algorithms** are step by step instructions on how to perform an operation.  

Algorithms help to breakdown and solve a programming problem into smaller parts of code.
JavaScript algorithms include: sorting, searches, math, strings, graphs, and trees.
**Step by step Discussion**

## Arrays

An array is a liner collection of elements accessed via index often used to compute offsets.
Arrays are created by declaring am array variable using the square bracket operator []

```
 Example: 
 var numbers = [10, 20, 40, 99, 44, 456, 67];
```

Alternatively they can be created by calling an array constructor  using set of elements as constructor arguments.

```
var numbers = new Array(6,7,8,9);
print(numbers.length);
Output: 5
```

The isArray() function is used to verify if n object is an array.

```
var numbers = 4;
var arr = [20, 24, 2456, 78];
print(Array.isArray(number));   //it outputs false
print(Array.isArray(arr)); // it outputs true
```

Arrays can be created by calling the array constructors.

```
var clients = new Array();
print (clients.length); 
output is 0.
```

**Heads up:** _A JavaScript array is a special type of JavaScript object._


## Lists

Lists are ordered sequence of data.
An **Element** is a data type item stored in a list. 
**Empty list**: refers to a list without elements.
_listSize()_ variable is used to store a number of elements in  a list.
_pos()_ method to show current position in a list.
_this.dataStore[ ]_  is used to initialize an empty array that stores a list of elements.

 **Functions in a list**

_Append()_ : used to add elements at the end  of a list
_Insert()_: used to add elements into a list either at the beginning of a list or after an already existing element.
_remove()_: used to delete elements from a list.
_clear()_: removes current elements in a list
_moveTo()_: moves the current position of an element to specified position
_front()_: used to set the current position to first element in the list.
_end()_: used to set current position to the last element in the list.

 **Implementation of Lists**

Create a variable containing fruit list;
```
var fruits = new List();
fruits.append(“Avocado”);
fruits.append(“Mangoes”);
fruits.append(“Apples”);
fruits.append(“Strawberries”);
fruits.append(“Kiwi”);
fruits.append(“Pomegranate”);
```

An operation to move the first element of list and display it;

```
fruits.font();
print(fruits.getElement());
Output is : Avocado
```
Moving forward one element and display the elements value:

```
fruits.next();
print(fruits.getElement());
the output is : Mangoes.
```

Removing elements from the list:

```
fruits.remove(“Kiwi”);
print(fruits.toString());
The output includes: 
Avocado, Mangoes, Apples, Strawberries, Pomegranate
```

## Queues
 
A queue is a type of a list where elements are inserted at the end and removed from the top. The store data in their order of occurrence.

Queue operations include:
	
- Inserting into an end of a queue (enqueue)  
- Removal of elements from the front(dequeue) 
- Peek operation, used to view elements at the front
 of a queue.

**A queues Test program:**

```
var q = new Queue();
q.enqueue(“Eddah”);
q.enqueue(“Vannex”);
q.enqueue(“Mary”);
print(q.toString());
q.dequeue();
print(q.toString());
print(“The front of the queue: “ + q.front());
print(“The back of the queue: “ + q.back());
```

The program output include:
Eddah
Vannex
Mary

Eddah
Vannex

The front of the queue: Eddah
The back of the queue: Vannex

Below is a diagram implementation of Queue operations:

![Image symbol of a Queue](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rzasopsfdi9hhn7pe74q.png)

**Note Below:**
_A queue is a First in, First out (FI-FO) data structure_

## Stacks

A stack is a list of elements that can only be accessible from the top of the list. Stack operations include PUSH and POP.

PUSH operation used to add elements into a stack.
POP operation is used to take elements off a stack

Below is an implementation of stack operations:

![Image of a stack Operation](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/csavxk1hv3guz0ddj67a.png)
Example of stack implementation:
```
var s= new Stack();
s.push(“CSS”);
s.push(“JavaScript”);
s.push(TailWind”); 
print(“length:  + s.length());
print(s.peek());
var popped = s.pop();
```
```
print(“The Popped element is : + popped);
print(s.peek());
s.push(“HTML”);
print(s.peek());
s.clear();
print(“length: + s.length());
print(s.peek());
s.push(“web3”);
print(s.peek());
```
_the function peek() returns the top element of the stack._ 
The output of the above program:
length is 3
Tailwind
The popped element is TailWind
JavaScript
HTML
Length: 0
Undefined
Web3

**REMEMBER:**
 _A stack is an example of Last -in First out (LI-FO) data structure._

_Palindromes and recursions are implemented using stacks_