Why do we need linked lists when we already have arrays? Detailed explanation of JS linked list (Linked-list)

Wide sea diving, sky high the birds to fly. Hey hello! I am Qin Aide. 😄

I have seen such a question before "Since there is already an array, why do you need a linked list?"

In fact, linked lists and arrays have their own advantages, and they both shine in different business scenarios. Many students may be both familiar and unfamiliar with linked lists. Familiar is that we often see the word "linked list" when we brush some eight-legged texts. What is unfamiliar is that we do not use linked lists too much in our usual development.

So let's take a look at what a linked list is. Since there are already arrays, why do we need a linked list?

The concept of data structure?

Let's break down the cryptic terminology:

Data: The corresponding data type, the basic data type and reference data type are included in js

Structure: A bunch of various data are finally stored in the computer memory according to different logical arrangements

Summary: We call the various logical components of data, the storage structure in the computer, and the algorithm design of various operations as data structures

Algorithms and data structures

algorithm is built on the data structure, and the operation of the data structure needs to be described by the algorithm; the algorithm design depends on the logical structure of the data, and the implementation of the algorithm depends on the storage structure of the data

• common data structures

Arrays, Dictionaries, Linked Lists, Stacks, Queues, Hash Tables, Binary Trees, Heaps, Jump Tables, Graphs, Trie Trees

• Common Algorithms

Recursion, sorting, binary search, search, hash algorithm, greedy algorithm, divide and conquer algorithm, backtracking algorithm, dynamic programming, string matching algorithm, etc.

what is an array structure

1. Definition of an array

An array is a collection of several elements stored in order, and each element has at least one index (index) or keyword (key) identified, the position of each element can be obtained by calculating the index

Why is it said that each element has at least one index, that is because arrays can be multi-dimensional

But we generally use one-dimensional arrays in our daily work, which can also be called linear arrays

一维数组：[1,2,3];  //数组的每一个元素是一个数据类型

二维数组：[["a","b","c"],[1,2,3],123];  //数组的每一个元素是一个一维数组

三维数组：[[["a","b","c"],[1,2,3]],[["a","b","c"],[1,2,3]]];  //数组的每一个元素是一个二维数组

2. Advantages and disadvantages of arrays

Array is the most common data structure in our work, and its biggest feature is the efficient query data

However, its shortcomings are also very obvious. When inserts and deletes data, a large amount of data movement and filling consumes a lot of time.

What is a linked list structure

1. Definition of linked list

The linked list structure is actually a storage method inside the memory. The linked list is a series of nodes connected in series. Each node contains at least two parts: data field and pointer field

data: save data

pointer: a reference to the next node

Each node in the linked list forms a linear structure through the value of the pointer field

2. Advantages and disadvantages of linked lists

Because the linked list is a loose structure, when you want to find a certain node, you can only go down from the head node level by level, but also because of this loose structure makes When it inserts into and deletes from , it only needs to change the point of its pointer field .

Advantages: Suitable for dynamic insertion and deletion application scenarios Disadvantages: Cannot quickly locate and access data randomly

Comparison of arrays and linked lists

• Arrays and linked lists are both linear data structures
• Arrays are static structures that allocate memory statically. Linked list supports dynamic allocation of memory
• The array is a continuous memory space when the data is stored, and the linked list is non-contiguous and connected by pointers.
• Arrays can be quickly searched according to subscript positioning, while linked lists need to be traversed to find
• Arrays will have a lot of data moving and filling when inserting and deleting, and the linked list only needs to change the pointer to

Implementation of linked list in js

Different from new Array() , new Set() , new Map() and other data structures, js has not yet provided us with a direct linked list API implementation. However, we can simulate a linked list by means of objects

Linked lists can be divided into three categories:

• Singly linked list: linear data structure, the pointer points to the next node, and the end point points to null
• Doubly linked list: You can add nodes forward or backward, and the pointer points to the previous node and the next node
• Circular linked list: The first node of the circular linked list points to the last node, and the last node points to the first node (the circular linked list can be divided into "one-way circular linked list" and "two-way circular linked list")

After objectifying the linked list, the presentation of the linked list looks like this

// 链表对象化，便于理解
const obj = {
  data: 1,
  next: {
    data: 2,
    next: {
      data: 3,
      next: null,
    },
  },
};

Insertion of linked list

When we need to insert a node into the linked list, we only need to point the previous node of where we need to insert it to ourselves, and point the current node of to the next node.

Deletion of linked list

When we want to delete a node in the linked list, we only need to point the previous node the current node, and point the target node to null to complete the release, and a deletion operation can be completed.

Implement a singly linked list

class neNode {
  constructor(data) {
    this.data = data;
    this.next = null;
  }
}

// 实现一个单项链表
class singleLinkedList {
  constructor() {
    this.head = null;
  }
  // 添加节点
  add(data) {
    let node = new neNode(data);
    if (this.head === null) {
      this.head = node;
    } else {
      let current = this.head;
      while (current.next) {
        current = current.next;
      }
      current.next = node;
    }
  }
  // 插入节点
  insert(data, target) {
    let node = new neNode(data);
    let current = this.head;
    while (current.next) {
      if (current.data === target) {
        node.next = current.next;
        current.next = node;
        break;
      }
      current = current.next;
    }
  }
  // 查找节点
  find(data) {
    let current = this.head;
    while (current) {
      if (current.data === data) {
        return current;
      }
      current = current.next;
    }
    return null;
  }
  // 删除节点
  remove(data) {
    let current = this.head;
    let previous = null;
    while (current) {
      if (current.data === data) {
        if (previous === null) {
          this.head = current.next;
        } else {
          previous.next = current.next;
        }
        return true;
      }
      previous = current;
      current = current.next;
    }
    return false;
  }
}
const list = new singleLinkedList();
list.add(1);
list.add(2);
list.add(3);
list.insert(4, 2);
console.dir(list, { depth: null });

The print result is:

grateful

Welcome to pay attention to my personal public . There are tricks in the front end. will push you fresh and high-quality articles every day. Reply to "welfare" to get the front-end knowledge spree I carefully prepared. May you go all the way with light in your eyes!

Interested friends can also add me WeChat: yuyue540880 Pull you into the group, exchange front-end technology together, and play together!