Read array values in a loop in JavaScript

Question

I have an array in JavaScript that have defined these values:

var myStringArray = [\"1\",\"2\",\"3\",\"4\",\"5\",\"6\",\"7\",\"8\",\"9\",\"10\"];

Answer 1

How about using a generator:

function* get3() {
  var myStringArray = ["1","2","3","4","5","6","7","8","9","10"];
  var index = 0;
  while (true) {
    yield [0, 1, 2].map(i => myStringArray[(index + i) % myStringArray.length])
    index = (index + 3) % myStringArray.length;
  }
}

Calling this function returns an object which you can call .next() on, to get the next set of 3:

var getter = get3();
console.log(getter.next().value); // ["1","2","3"]
console.log(getter.next().value); // ["4","5","6"]
console.log(getter.next().value); // ["7","8","9"]
// etc.

Answer 2

If you want the immutable way to achieve your circular looping

function loopArray(arr, step=3) {
    let i = 0;
    return function inner() {
        for (let j = 0; j < step; j++) {
            console.log(arr[i]);
            i = (i + 1) % arr.length;
        }
    };
 }

const func = loopArray(["1","2","3","4","5","6","7","8","9","10"], 3);
func();
func();
func();
func();
func();

Answer 3

function* employeeNames(){
    var empList =  ["1","2","3","4","5","6","7","8","9","10"];

    for(var i =0; i<=empList.length; i++){
        yield empList[i];
    }
}

var emp;
emp = employeeNames();

It uses a generator function...

Answer 4

Your variable i is local to the for loop which means it basically resets every time the loop is started. So first make your variable i global.

var i=0;
function employeeNames(){
    var empList =  ["1","2","3","4","5","6","7","8","9","10"];
    var output = [];
    var j=0;
    while(j<3)
    {
        output.push(empList[i])
        i=(i+1)%empList.length;
        j++;
    }
    return output;
}

console.log(employeeNames());
console.log(employeeNames());
console.log(employeeNames());
console.log(employeeNames());
console.log(employeeNames());

Answer 5

You could take a function which slices three elements and if not possible, it takes the needed first values of the array as well.

function take3() {
    var temp = array.slice(index, index += 3)
    index %= array.length;
    console.log(temp.concat(temp.length < 3 ? array.slice(0, index) : []).join(' '));
}

var array = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10"],
    index = 0;

<button onclick="take3()">take 3</button>

With a mapping of a dynamic count.

function take(length) {
    console.log(Array.from({ length }, _ => array[++index, index %= array.length]));
}

var array = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10"],
    index = -1;

<button onclick="take(3)">take 3</button>

Answer 6

@Igor Petev, JavaScript's closures are a nice concept that you can use to solve your problem.

Please read JavaScript's Closures - w3schools article. It's really nice and excellent.

I have used the concept of closures to solve this problem. Please leave a comment if you don't understand my code or anything else related to this problem.

Please have a look at the below code.

var get3items = (function () {

    var index = 0;
    var myStringArray = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10"];
    var len = myStringArray.length

    return function () {
       for(var count = 0; count < 3; count += 1)
       {
           console.log(myStringArray[index]);

           if(index == (len - 1))
           {
               index = 0;
           }
           else {
               index += 1;
           }
       }
    }
})();

get3items (); // First call

console.log()
get3items (); // Second call

console.log()
get3items (); // Third call

console.log()
get3items (); // Fourth call

console.log()
get3items (); // Fifth call

/*
 1
 2
 3

 4
 5
 6

 7
 8
 9

 10
 1
 2

 3
 4
 5
*/