Array rotation, a simple approach using JS
Tags: algorithms, todayilearned, programming, javascript
Published: 2021-07-27 18:47:04

## What's an array?
An array is a type of linear data structure containing a collection of elements of similar data type. Arrays are one of the most important data structures. The elements in the array are stored in contiguous memory locations.

## what's array rotation?
Array rotation is nothing but shifting elements of the array in a specified direction with a rotation factor. No worries, this will be made clear with an example below,
{% gist https://gist.github.com/code-reaper08/5c3fded76687a3c67aed4976385e07c9 %}

## Reversal algorithm for array rotation
There are many ways to rotate an array, you may use a temporary array to store values and then replace them in the actual array, or you may store the first element of the array in a temporary variable. Shift the other elements to the left, and we have to do this for `d` times (where `d` is the rotation factor). We are going to use *Reversal algorithm* for rotating the array in left direction.
  
## How the Reversal algorithm works?
Unlike other methods mentioned above, Reversal algorithm don't use any temporary variable or array for the rotation process. This makes it more space efficient. This algorithm works on *3 steps*. They are,
1. reverse `d` elements.
2. reverse `n-d` elements.
3. And finally, reverse `n` elements.

### Example:
{% gist https://gist.github.com/code-reaper08/d3c3b0f51ee990bd10bba87f4b7d29fe %}
So, with these steps in mind, let us dive right into JavaScript and make the magic happen ✨

## Code it in JS
First, we need a function to rotate the array from a given index to the end. So it takes 3 parameters like `samparr`, `begin`, `end`. We use a `while` loop and assign the starting value of `samparr` to a temporary variable called `temp`. 
We then assign the starting value of `samparr` to the ending value of `samparr`. And, finally, we assign the ending value of `samparr` to the `temp` again. We use this `temp` variable to dynamically change the starting and ending values of the `samparr`. We then increment the start with 1 and decrement the end with 1. This is going to be our main function, which we would call with respect to the above-mentioned 3 steps.
{% gist https://gist.github.com/code-reaper08/f4ebe36cf3ec337b469bf21962a53226 %}

We, then, need a function to actually rotate the array to the left using the rotation factor `d`. For that, we create another function which takes the `samparr`, `d` and `n` as parameters and return the rotated array. We return the function if we have d=0, which means the array is empty. Going good till now, but wait!, What if the `d` is greater than `n`, *step 2* will become broken, to fix that, we just update `d` as `d % n`. We'll look at an example in a minimum scale to better understand this `d % n`
{% gist https://gist.github.com/code-reaper08/4ae1318fc1b4e89602d761615192ec52 %}
After, refactoring, we give *Step1*, *Step2* and *Step3* to the `Reverse` function. This will finally return a nicely rotated array as a result.
{% gist https://gist.github.com/code-reaper08/84565bf4f5d0bb78550a6f1c7e0bdcec %}

So, Finally, we have to console log the rotated array. For that, we create a function called `Logger`, which will console log the rotated array. This function takes two parameters, `samparr` and `n`. It is a simple function which loops through all elements in the array and log them onto console.
{% gist https://gist.github.com/code-reaper08/48ab5b124bc1bb714d08ebc460795363 %}

## Hurray 🎉
It's done. The last and final thing we do is pass inputs to our functions, to see them in action.
{% gist https://gist.github.com/code-reaper08/082c3030574ee689da2ae664aaa5e60d %}

Use this *[JSFiddle](https://jsfiddle.net/Vishwa_R/kn5Lv0qw/26/) to change rotation factor and input array.

## Acknowledgements:
Cover image : Photo by <a href="https://unsplash.com/@marekpiwnicki?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Marek Piwnicki</a> on <a href="https://unsplash.com/s/photos/rotation?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a>

Thanks for reading, give a 💖 if you like.