Discovering JavaScript's Hidden Secrets: Understanding Arrays as a Data Structure.
Tags: javascript, datastructures, programming, beginners
Published: 2024-02-10 12:18:23

One of the essential attributes of a proficient Software Engineer or Data Engineer is the ability to choose suitable data structures that match the characteristics of the data being processed. Regrettably, this skill isn't universally prioritized among engineers, who often focus more on solving immediate problems rather than considering the most efficient data structure for the task at hand.

A thorough grasp of data structures empowers engineers to tackle problems with optimal efficiency. It's crucial to revisit our earlier lesson on Big O notation, emphasizing the significance of algorithmic efficiency in terms of both time and space complexity. In this context, 'space' directly relates to the careful selection of data structures used to address the given problem.

In this episode, we'll explore data structures in detail, a crucial concept essential for comprehending algorithmic efficiency and performance

### Prerequisites

To fully understand data structures in JavaScript, it's essential to have a strong foundation in JavaScript fundamentals. This includes mastery of basic syntax, variables, data types, control flow structures, functions, and scope.

### What is a Data Structure?

A data structure is a method of organizing and storing data in a computer, facilitating efficient organization, management, and manipulation of information. Data structures enable data to be accessed and modified efficiently, optimizing operations such as insertion, deletion, searching, and sorting. Understanding data structures is crucial for efficient programming and problem-solving in computer science.

#### Data structures can be mainly categorized into three types:

- Primitive Data Structures
- Linear Data Structures
- Non-linear Data Structures

  **Primitive Data Structures:** Primitive data structures, also referred to as basic data structures, are essential components used to represent and store data in computer memory. They consist of simple, predefined data types provided by programming languages to store raw data values efficiently. These structures are directly supported by hardware and are typically implemented within the language's syntax. Examples of primitive data structures include integers, floating-point numbers, characters, and boolean values. In JavaScript, additional primitive types such as null, undefined, BigInt, Symbol, and infinity are also available

  **Linear Data Structures:** Linear data structures are a type of data structure in which data elements are organized sequentially, with each element connected to its previous and next element. The elements are arranged in a linear order, meaning that each element has exactly one predecessor and one successor, except for the first and last elements. Examples include arrays, linked lists, stacks, and queues.

  **Non-linear Data Structures:** Non-linear data structures are data structures in which elements are not organized sequentially or in a linear order. Unlike linear data structures, where each element has a single predecessor and successor, non-linear data structures allow for more complex relationships between elements, such as branching or hierarchical structures. These structures are essential for representing relationships between data in a variety of applications, including hierarchical data, graphs, trees, and more.

In the upcoming lessons, we will extensively discuss other examples of linear data structures. However, in this lesson, we will focus specifically on arrays

- **Arrays:** - Arrays: An array is one of the fundamental data structures in computer science, commonly used for storing collections of elements, such as numbers or strings, that are accessed by indices. It provides a way to store multiple elements of the same data type in a contiguous block of memory, with each element occupying a fixed-size memory space.

  A picture of Array is shown below.

  ![Array](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pvjq6gmud5y1pusawoqg.png)

There are various operations that can be performed on an array, including:

- **Access:** Elements in an array are accessed using their indices. Accessing an element at a specific index typically has a time complexity of O(1), as it involves a simple calculation to determine the memory address of the desired element.

- **Insertion/Deletion:** Insertion and deletion operations in arrays can be costly, especially if they require shifting elements to accommodate the change. In the worst-case scenario, these operations have a time complexity of O(n), where n is the number of elements in the array.

- **Traversal:** Arrays can be traversed sequentially to perform operations on each element. This is commonly done using loops, such as for loops, iterating over each index of the array.

- **Search:** Searching for an element in an array typically involves iterating through each element sequentially until the desired element is found. In the worst-case scenario, this operation has a time complexity of O(n), where n is the number of elements in the array.

### Types of Arrays

- **One-dimensional Arrays:** These are the simplest form of arrays where elements are arranged in a single row or column.

- **Multi-dimensional Arrays:** Arrays can have multiple dimensions, forming a matrix-like structure. Common examples include two-dimensional arrays (rows and columns) and three-dimensional arrays (rows, columns, and depth).

The basic implementation of an array data structure using JavaScript is illustrated below.

```js
class Array {
  constructor() {
    this.length = 0;
    this.data = {};
  }
  // Get element at index
  get(index) {
    return this.data[index];
  }

  // Push element to end of array
  push(item) {
    this.data[this.length] = item;
    this.length++;
    return this.length;
  }

  // Pop element from end of array
  pop() {
    const lastItem = this.data[this.length - 1];
    delete this.data[this.length - 1];
    this.length--;
    return lastItem;
  }

  // Delete element at index
  delete(index) {
    const deletedItem = this.data[index];
    this.shift(index);
    return deletedItem;
  }

  // Helper function to shift items to the left after deletion
  shift(index) {
    for (let i = index; i < this.length - 1; i++) {
      this.data[i] = this.data[i + 1];
    }
    delete this.data[this.length - 1];
    this.length--;
  }
}

// Example usage:
const array = new Array();
array.push(1);
array.push(2);
array.push(3);
array.pop();
console.log(array);
// resilt: Array { length: 2, data: { '0': 1, '1': 2 } }
```

This brings us to the end of this episode. In the next episode, we will explore linked lists as a data structure.

### Conclusion

In this episode, we covered the fundamentals of data structures, with a focus on arrays in JavaScript. We explored their key operations, types, and practical implementations. Mastering these concepts is essential for efficient programming. In the next episode, we'll delve into linked lists, continuing our journey through fundamental data structures.

### Resources and References

You can check out some of the resources listed below to learn more about Data structures.

- [geeksforgeeks](https://www.geeksforgeeks.org/what-is-array/)
- [js algorithms and data structures masterclass by Colt Steele](https://www.udemy.com/course/js-algorithms-and-data-structures-masterclass/)