How To: Build a Linked List in JavaScript Part 2
Tags: javascript, algorithms, datastructures, beginners
Published: 2022-01-16 03:05:34

Hi everyone! Today we will continuing our exploration into Linked Lists by building a few methods into our Class LinkedList from [this](https://dev.to/am20dipi/how-to-build-a-linked-list-in-javascript-4kn1) previous lesson. 

Let's get started! 

__________________________________________________

### Goals

Here are our goals for today:

1. [Build append()](#append)
2. [Build prepend()](#prepend)
3. [Recap + Summary](#recap)

By implementing these methods, we will expand the utilization and effectiveness of our Class LinkedList and each instance instantiated thereafter. 


__________________________________________________


## Build append()<a name="append"></a>

First off, let's figure out what 'append' means. Append means to <strong>add</strong> a new node at the <strong>end</strong> of the linked list. 

Therefore, to add something to the end of the linked list, we need to do a few things:

**1.** Pass in a value to append() as a parameter.
**2.** Create a new node constant.
**3.** Set the new node's **value** property.
**4.** Set the new node's **next** property.
**5.** Update the <strong>tail</strong> of our instance of LinkedList.
**6.** Increment the length of our instance of LinkedList.

So, underneath our constructor method, let's create an append() method and pass in 'value':

```js
append(value){


}
```

How do we create a new node? We can declare and assign a variable called "newNode" and establish the properties that make up a node (a "value" and a "next"):


```js
append(value){
   const newNode = {
       value: value,
       next: null
   }
}
```
The "value" property is going to be set to the value we pass in as a parameter. The "next" property will be set to null. 

Instead of the tail pointing to null, we are now pointing to the newNode we created. 


```js
append(value){
   const newNode = {
       value: value,
       next: null
   }
   this.tail.next = newNode
}
```

We also want establish that our appended newNode is now the tail itself:

```js
append(value){
   const newNode = {
       value: value,
       next: null
   }
   this.tail.next = newNode
   this.tail = newNode
}
```

Finally, we want to increment (or increase) the length to accommodate for the newly created appended node:

```js
append(value){
   const newNode = {
       value: value,
       next: null
   }
   this.tail.next = newNode
   this.tail = newNode
   this.length++
}
```

**_Remember: "this" represents the instance of Class LinkedList._**

Let's test this out:

```js
const myLinkedList = new LinkedList(10)
myLinkedList.append(5)
myLinkedList.append(7)
```

In our console, we should receive something like this: 

![Image desc](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ncp6q2u30mxbybngxm5t.png)

- Our head node is made up of a 'value' of 10 and a 'next' of the appended 5. 
- Our second node has a value of 5 and a 'next' of the appended 7.  
- Our tail node has a value of 7 and a 'next' of null (because it is the last node in the list). 



__________________________________________________

## Build prepend()<a name="prepend"></a>

"Prepend", similarly to "append" adds a new node to a linked list. However, prepend adds the node to the **beginning**. 

Having built append(), we can do something very similar for prepend():

**1.** Pass in a value to prepend() as a parameter.
**2.** Create a new node constant.
**3.** Set the new node's **value** property.
**4.** Set the new node's **next** property.
**5**. Update the <strong>head</strong> of our instance of LinkedList.
**6.** Increment the length of our instance of LinkedList.

Beneath our append() method, let's create a prepend() method and pass in "value". We are also going to declare a new constant "newNode" with its "value" property set to the value we pass in:

```js
prepend(value){
   const newNode = {
       value: value,
       next: ___
   }

}
```

Since this new node is going to the **beginning** of the linked list, its "next" value must be the _previous_ head node of the linked list: 

```js
prepend(value){
   const newNode = {
       value: value,
       next: this.head
   }
}
```
Finally, we have to set the head of our instance of LinkedList to this newly created node AND increment the length: 

```js
prepend(value){
   const newNode = {
       value: value,
       next: this.head
   }
   this.head = newNode
   this.length++
}
```

If we run an example, like this, in our console:

```js
const newList = new LinkedList(10)
myLinkedList.prepend(44)
```
We should get returned something like this:

![Image dec2](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1utm1vv4hbz3tmtwgke1.png)

- Our head node is made up of the prepended 'value' of 44 and a 'next' of the node with a value of 10 and a next of null. 
- Our tail node has a 'value' of 10 and a 'next' of null (because it is the last node in the list).

__________________________________________________

## Recap + Summary <a name="recap"></a>

Here we now have a Class LinkedList built in JavaScript! We are getting to a point where our code provides functionality to instances instantiated from the class. A functional linked list is great for efficient coding, an introduction to Trees, and predictable data rendering. 

For the next part in the series, I want to focus on traversing linked lists in order to **remove** and **insert** a node in a specific location on the linked list. 

Stay tuned! And thank you for reading + coding along with me :)