Как javascript оценивает аргументы?

Question

Я пишу простую функцию javascript для отображения индикатора выполнения с помощью JQuery ProgressBar (http://t.wits.sg/misc/jQueryProgressBar/demo.php#)

Функция progressBar может быть настроена на отображение разных фоновых изображений с разными значениями. Я хочу отобразить значения в [0, MAX * 0.3] красным, (MAX * 0.3, MAX * 0.7] оранжевым и (MAX * 0.7, MAX] зеленым. Поэтому я пишу вспомогательную функцию следующим образом:

function setBar(bar, cur, total) {
    var v1 = parseInt(total * 0.3);
    var v2 = parseInt(total * 0.7);

    // if I run alert(v1) and alert(v2) here, the values are all right.

    bar.progressBar(cur, {
        max: total,
        textFormat: 'fraction',
        boxImage: '/img/pbar/progressbar.gif',
        barImage: {
            0:  '/img/pbar/progressbg_red.gif',
            v1: '/img/pbar/progressbg_orange.gif',
            v2: '/img/pbar/progressbg_green.gif'
        }
    });
}

Аргумент cur является текущим значением, в то время как total является значением MAX индикатора выполнения. Функция, похоже, не работает, но когда я заменяю «v1:» и «v2:» фактическими значениями, такими как 50 и 120, функция работает хорошо. И я также проверил значения v1 и v2 перед вызовом bar.progressBar, с ними все в порядке.

Таким образом, проблема в том, что я не могу передать переменную вместо константы в функцию bar.progressBar, я думаю, что она может иметь отношения с порядком вычисления аргументов javascript, есть ли какое-то решение этой проблемы?

Answer 1

попробуйте построить объект, прежде чем передать его:

var barImageObj = {};
barImageObj[0] = '/img/pbar/progressbg_red.gif';
barImageObj[v1] = '/img/pbar/progressbg_orange.gif';
barImageObj[v2] = '/img/pbar/progressbg_green.gif';

bar.progressBar(cur, {
    max: total,
    textFormat: 'fraction',
    boxImage: '/img/pbar/progressbar.gif',
    barImage: barImageObj
});

проблема в том, что javascript интерпретирует {a:'foo'} и {'a':'foo'} как объект со строковым ключом "a", а не с каким-либо значением переменной a, равным

Answer 2

Ваша проблема в

barImage: {
            0:  '/img/pbar/progressbg_red.gif',
            v1: '/img/pbar/progressbg_orange.gif',
            v2: '/img/pbar/progressbg_green.gif'
        }

При использовании литеральной формы объекта имена элементов принимаются как литералы, т. Е. Тот факт, что v1 и v2 являются переменными, не имеет никакого эффекта, у созданного вами объекта есть элементы0, «v1» и «v2».

Чтобы делать то, что вы хотите, вам нужно

barImage = { };

barImage[0] = '/img/pbar/progressbg_red.gif';
barImage[v1] = '/img/pbar/progressbg_orange.gif';
barImage[v2] = '/img/pbar/progressbg_green.gif';

Answer 3

проблема может заключаться в том, что v1 и v2 являются числами с плавающей точкой, а не строками. Вы используя их в качестве ключей на объекте JavaScript.

Попробуйте преобразовать их в целые числа, а затем в строки, если это все еще не работает.