Чтение значений массива в цикле в JavaScript

У меня есть массив в JavaScript, который определил эти значения:

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

И когда я вызываю функцию в первый раз, мне нужно получить следующее:

1
2
3

Позвонив снова, мне нужно получить:

4
5
6

Вызов снова:

7
8
9

Вызов снова:

10
1
2

Вызов снова:

3
4
5

И так далее. У вас есть точка, показывающая 3 значения из массива, и если мы находимся в конце массива, читаем с самого начала... У меня есть приложение с дистанционным управлением и клавиши вниз и вверх. Когда пользователь нажимает кнопку "вниз", чтобы получить эти значения из массива, как описано в приведенном выше примере, если пользователь нажимает кнопку "вверх", ему нужно вернуться из примера... поэтому чтение массива в цикле (в конце, массив читается с самого начала, но всегда показывает три значения).

Я пытаюсь использовать это:

var myStringArray = ["1","2","3","4","5","6","7","8","9","10"];
var arrayLength = myStringArray.length;
for (var i = 0; i < arrayLength; i++) {
    if (i<(6)) {
       console.log(myStringArray[i]);
    }
}

Но в следующий раз, когда я вызываю этот код, он показывает из начальных значений массива, а не продолжает читать другие значения... нужен ли мне второй счетчик?

Ответы

Ответ 1

Если вы в порядке с манипулированием исходным массивом при его прохождении через него, вы можете splice и concat аналогично ниже (или вы можете использовать клон массива, если вам нужно сохранить исходный массив):

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

var loopByX = function(x){
  var y = myStringArray.splice(0,x);
  myStringArray = myStringArray.concat(y);
  
  return y;
}

console.log(loopByX(3));
console.log(loopByX(3));
console.log(loopByX(3));
console.log(loopByX(3));
console.log(loopByX(3));

Ответ 2

Вы можете взять функцию, которая срезает три элемента, и, если это невозможно, она также принимает необходимые первые значения массива.

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>

Ответ 3

Ваша переменная i является локальной for цикла for что означает, что она в основном сбрасывается каждый раз при запуске цикла. Поэтому сначала сделайте свою переменную i глобальной.

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());

Ответ 4

Если вы хотите непреложный способ достижения кругового цикла

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();

Ответ 5

@Igor Petev, закрытие JavaScript - хорошая концепция, которую вы можете использовать для решения своей проблемы.

Пожалуйста, прочитайте статью " Закрытие JavaScript" - статья w3schools. Это действительно приятно и отлично.

Я использовал концепцию замыканий для решения этой проблемы. Пожалуйста, оставьте комментарий, если вы не понимаете мой код или что-то еще, связанное с этой проблемой.

Пожалуйста, ознакомьтесь с приведенным ниже кодом.

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
*/

Ответ 6

Причудливое решение с функциями генератора:

function* cycle(arr) {
    let i=0;
    while (true) {
        yield arr[i++];
        i %= arr.length;
    }
}
function* chunksOf(n, iterable) {
    let chunk = [];
    for (const x of iterable) {
        chunk.push(x)
        if (chunk.length >= n) {
            yield chunk;
            chunk = [];
        }
    }
    if (chunk.length > 0)
        yield chunk;
}
function toFunction(iterator) {
    return () => iterator.next().value;
}
var myStringArray = ["1","2","3","4","5","6","7","8","9","10"];

const f = toFunction(chunksOf(3, cycle(myStringArray)));
console.log(f());
console.log(f());
console.log(f());
// …

Ответ 7

Как насчет использования генератора:

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;
  }
}

Вызов этой функции возвращает объект, который вы можете вызвать .next() on, чтобы получить следующий набор из 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.

Ответ 8

Вам нужен дополнительный указатель, чтобы узнать, где находится массив.

Чтобы начать с начала, когда вы попали в конец массива, вы можете использовать оператор modulo.

var myStringArray = ["1","2","3","4","5","6","7","8","9","10"];
var arrayLength = myStringArray.length;
var arrayPointer = 0;
for (var i = 0; i < 3; i++) {
    console.log(myStringArray[arrayPointer++]);
    arrayPointer %= arrayLength; // same as: arrayPointer = arrayPointer % arrayLength;
}

Посмотрите на ответ Акшай Гарга, чтобы посмотреть, как вы можете обернуть это функцией.

Ответ 9

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();

Он использует функцию генератора...