## DEV Community is a community of 660,470 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

# Circular access of Array in JavaScript

Emma Turner
Front-end Developer and Blogger

The formula you see is part of modular arithmetic. I plan digging into this stuff to see what practical things for our coding I can find! Tell me in the comments if you want more of these techniques!

### What is this basically?

An abstract technique which is super simply but I've found it so many applications! Let's get to know 'em in detail.

For example:

Let's say that we've the following array: ['a','b','c']. If we try to access it at position 0 it returns `'a'`. Position 1 returns `'b'`.
Position 2 returns `'c'`. Position 3 returns undefined, since we don't have an element at position 3.
In this normal case, every index greater than 2 returns undefined because it was not found in the array.
But what if, instead of returning undefined at position 3, it started from the beginning again and returned `'a'`? And then, for position 4-`'b'`? Position 5-`'c'`? Position 6-`'a'` and so, until infinity... ♾

That is not matter of the index you try to access, it always gives an existing next element.

### Now let's see the codes

``````const arr = ['a', 'b', 'c']

//REALITY
arr[0] //=> 'a'
arr[1] //=> 'b'
arr[2] //=> 'c'
arr[3] //=> undefined
arr[4] //=> undefined
arr[5] //=> undefined
arr[6] //=> undefined
arr[7] //=> undefined

// GOAL:
arr[0] //=> 'a'
arr[1] //=> 'b'
arr[2] //=> 'c'
arr[3] //=> `a`
arr[4] //=> `b`
arr[5] //=> `c`
arr[6] //=> `a`
arr[7] //=> `b`
``````

### Implementation

Once you've understood what it does, the implementation is just a formula which you don't even have to understand :) Just use it. Here it is:

``````// EXAMPLE

arr[(1 % n + n)%n]
arr // the array which you access
i // the index of arr you're trying to access
n // the length of arr
``````
``````const arr = ['a', 'b', 'c']
const i = 5 //index you wanna access
const n = arr.length

arr[(i % n + n) % n] // => 'c'

//At the end it works as if:
//['a', 'b', 'c', 'a', 'b', 'c', 'a', ...♾]
//  0    1    2    3    4    5    6   ...♾
``````

### Example Use

Let's say that we have a function which has to return the next element from an array with unspecified length. Simple.

We could hardcode it with a ternary or switch or if/else but we don't have to. Here's my solution using the circular array access:

``````const choosePos = (currentPos, chooseFromArr) => {
const i = chooseFromArr.indexOf(currentPos)+1
const n = chooseFromArr.length
return chooseFromArr[(i % n + n) % n]
}

const arr = ['post1', 'pos2', 'pos3', 'pos4']
choosePos('post1', arr) // => pos2
choosePos('post2', arr) // => pos3
choosePos('post3', arr) // => pos4
choosePos('post4', arr) // => pos1
``````

## Discussion (4)

Sunil Chaudhary

Nice 👍🏻 easy to understand and nicely crafted keep posting stuffs like this ✌🏻🙌🏻

Emma Turner

Thank you Sunil for your kind words.

Sunil Chaudhary