DEV Community

Cover image for Introduction to Data Structures and Algorithms with Modern JavaScript
Eddah Chebet
Eddah Chebet

Posted on

Introduction to Data Structures and Algorithms with Modern JavaScript

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];
Enter fullscreen mode Exit fullscreen mode

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
Enter fullscreen mode Exit fullscreen mode

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
Enter fullscreen mode Exit fullscreen mode

Arrays can be created by calling the array constructors.

var clients = new Array();
print (clients.length); 
output is 0.
Enter fullscreen mode Exit fullscreen mode

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”);
Enter fullscreen mode Exit fullscreen mode

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

fruits.font();
print(fruits.getElement());
Output is : Avocado
Enter fullscreen mode Exit fullscreen mode

Moving forward one element and display the elements value:

fruits.next();
print(fruits.getElement());
the output is : Mangoes.
Enter fullscreen mode Exit fullscreen mode

Removing elements from the list:

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

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());
Enter fullscreen mode Exit fullscreen mode

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

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
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();
Enter fullscreen mode Exit fullscreen mode
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());
Enter fullscreen mode Exit fullscreen mode

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

Top comments (0)