Блог

У меня есть объект, который содержит 2 массива up и down , эти значения должны быть связаны с клавишами вверх и вниз, при нажатии кнопки вверх вы должны перемещаться по up массиву, если вы ставите галочку вниз, вы должны через любые up значения галочки (если up произошли галочки) перейти к down массиву и наоборот.

Мне удалось создать версию этого, но возникли некоторые проблемы с получением undefined того, что я бы счел точкой пересечения между up и down. Может ли кто-нибудь дать мне несколько советов о том, как сделать это более надежным и решить undefined проблему? Должен ли я начинать с -1 для моего счетчика или каким должен быть подход?

JS

 var prices = {
    "up" : [
      {"r": 10.25, "f" : "10.25"},
      {"r": 10.50, "f" : "10.50"},
      {"r": 10.75, "f" : "10.75"},
      {"r": 11.00, "f" : "11.00"},
      {"r": 11.25, "f" : "11.25"},
      {"r": 11.50, "f" : "11.50"},
      {"r": 11.75, "f" : "11.75"},
      {"r": 12.00, "f" : "12.00"},
      {"r": 12.25, "f" : "12.25"},
      {"r": 12.50, "f" : "12.50"}
    ],
    "down": [
        {"r": 7.50, "f" : "7.50"},
        {"r": 7.75, "f" : "7.75"},
        {"r": 8.00, "f" : "8.00"},
        {"r": 8.25, "f" : "8.25"},
        {"r": 8.50, "f" : "8.50"},
        {"r": 8.75, "f" : "8.75"},
        {"r": 9.00, "f" : "9.00"},
        {"r": 9.25, "f" : "9.25"},
        {"r": 9.50, "f" : "9.50"},
        {"r": 9.75, "f" : "9.75"} 
    ]
};

var $btns = $('.js-btn');
var counter = -1;

$btns.on('click', function(event) {
    var dir = $(event.currentTarget).data('dir');

    if(dir === 'up') {
        if(counter >= -1) {
            console.log(prices[dir][  counter]);
        } else {
            console.log(prices['down'][prices['down'].length   counter  ]);
        }   
    }

    if(dir === 'down') {
        if(counter <= -1) {
            console.log(prices[dir][prices[dir].length   counter--]);
        } else {
            console.log(prices['up'][--counter]);
        }

    }
});
  

JS Fiddle http://jsfiddle.net/kyllle/7Lznj00w /

Чтобы гарантировать, что ваши обращения к массиву допустимы, вы хотите, чтобы индекс массива находился в диапазоне [0, arr.length-1] . Если вы попытаетесь получить доступ к массиву JavaScript с недопустимым индексом, вы получите undefined.

Вы можете инициализировать свой upIndex и downIndex в 0 (первый элемент в списке). Теперь предположим, что вам нужен следующий элемент в верхнем массиве. Вы можете обновить upIndex следующим образом

 upIndex = (upIndex   1) % prices.up.length
  

% Оператор выдает вам остаток после деления (так 3 % 2 и есть 1 , поскольку 3/2 остается остаток от 1 ). Поэтому, если вы уже находитесь в последнем индексе в up , вы начнете сначала. Последний индекс в up равен 9, а up.length равен 10, поэтому upIndex = (9 1) % 10 = 0 убедитесь, что вы всегда остаетесь в пределах массива.