# Bubble Sorting for Beginners in JS

### Ryan Dunton ・2 min read

As someone who uses Javascript all day, every day for work I realized I took a lot of basic algorithm tasks for granted so I have decided to dive into the basics in blog posts for the next few weeks, starting today with BUBBLE SORT.

## What is Bubble Sort?

Bubble Sort is a method for sorting arrays by comparing each array element to the element behind it. So, if you had an array with `[3,5,4, 2]`

the bubble sort function would compare "3" to "5" then compare "5" to "4" and so on until the array is sorted.

## Best Way to Bubble Sort

The best way I have found/built to bubble sort looks like the below:

```
const bubbleSort = arr => {
let swapped;
do {
swapped = false;
for (let i = 0; i < arr.length; i++) {
if (arr[i] > arr[i + 1]) {
let tmp = arr[i];
arr[i] = arr[i + 1];
arr[i + 1] = tmp;
swapped = true;
}
}
} while (swapped);
return arr;
};
```

## Code Breakdown

Now let's break this code down snippet by snippet.

```
const bubbleSort = arr => {
let swapped;
do {} while (swapped);
return arr;
}
```

Here we initialize a `swapped`

variable and set up a do/while loop to run while `swapped`

is equal to true, then return the array.

NEXT:

```
const bubbleSort = arr => {
let swapped;
do {
swapped = false;
for (let i = 0; i < arr.length; i++) {
// do stuff here
}
} while (swapped);
return arr;
}
```

Now we have set up the function to loop over each element of the array.

NEXT:

```
const bubbleSort = arr => {
let swapped;
do {
swapped = false;
for (let i = 0; i < arr.length; i++) {
if (arr[i] > arr[i + 1]) {
// if element > the next element
}
}
} while (swapped);
return arr;
}
```

If the element is greater than the element behind it in the array we want to do something (swap) with it.

NEXT:

```
const bubbleSort = arr => {
let swapped;
do {
swapped = false;
for (let i = 0; i < arr.length; i++) {
if (arr[i] > arr[i + 1]) {
let tmp = arr[i];
arr[i] = arr[i + 1];
arr[i + 1] = tmp;
swapped = true;
}
}
} while (swapped);
return arr;
};
```

We need to save the `arr[i]`

element to the `tmp`

variable because we are going to overwrite it with the value of the element behind it (`arr[i+1]`

). Then we reassign the value of the element behind it (`arr[i+1]`

) to equal `tmp`

.

This was my best try at a basic Bubble Sort function, let me know if you find a more elegant solution!

In some cases the best solution is the one use less operations to perform any task, some of them takes the memory usage, anyhow at least for this one you have to check the operations you are performing to solve this one.

I found something weird, is a bit complex to mentally process at first glance, anyhow it takes more steps that it should.

First:

You can create an "optimized solution cutting of some iterations"

This is just an experimental case, but in some cases it can crash the app or being unable to perform a task ;)

thanks!

Since an array starts from index 0. I would do this:

I was trying to figure out how to efficiently implement different kinds of sorting algorithms in ES6 style and that's what I've came up with for bubble algorithm:

Basically, it's the same as yours, but it uses .map() method instead of for loop and destructuring to swap elements. It also uses 132 Operations, if testing like Marco showed here.