用更安全的东西代替评估

时间:2020-02-27 18:30:50

标签: javascript jquery eval flatpickr

我使用flatpickr.js库创建了一个日历。我想仅启用从下拉列表中选择的Arreys dateCorfudateZantedatePag中存在的日期(属性名称为“ destinazione”)。

我不是编码人员,但是我使用eval方法编写了以下代码,此方法可以正常工作,但我确定这是错误的方法。也许还有更好的方法来处理function(date )。那么有没有办法使它在不使用eval的情况下起作用?

flatpickr("#data-partenza", {
    locale:'it', 
    minDate: "2020-07-16",
    enable: [
        function(date) {
            // return true to enable
            var drop_destinazione = jQuery('[name="destinazione"]').val();
            var result = '';
            var dateCorfu = ["2020-07-16","2020-07-23","2020-07-30","2020-08-06","2020-08-13","2020-08-20"];
            var dateZante = ["2020-07-17","2020-07-24","2020-07-31","2020-08-07","2020-08-14"];
            var datePag = ["2020-07-18","2020-07-25","2020-08-01","2020-08-08"];
            var slice = 'date.toISOString().slice(0,10)';
            var i;
            if(drop_destinazione == 'Corfù'){
                for (i = 0; i < dateCorfu.length; i++) {
                    result += (slice + '==' + '"' + dateCorfu[i] + '"' + '||');
                }
                return eval(result.slice(0, -2));
            }
            else if(drop_destinazione == 'Zante'){
                for (i = 0; i < dateZante.length; i++) {
                    result += (slice + '==' + '"' + dateZante[i] + '"' + '||');
                }
                return eval(result.slice(0, -2));
            }
            else if(drop_destinazione == 'Pag'){
                for (i = 0; i < datePag.length; i++) {
                    result += (slice + '==' + '"' + datePag[i] + '"' + '||');
                }
                return eval(result.slice(0, -2));
            }
            else {
                console.log('no destination selected')
            }
        }
    ],
    dateFormat: "d-m-Y",
    disableMobile: true,
});

1 个答案:

答案 0 :(得分:1)

由于您仅在进行if验证,所以为什么不立即对每个结果+ =进行评估并累积 ??

result = false;
for (...) {
    if (condition) result = true;
}
return result;

甚至更好:像这样提早退出

result = true;
for (...) {
    if (condition) return true;
}
return false;

应用于原始代码,这会使您的函数如下所示:

function(date) {
    var drop_destinazione = jQuery('[name="destinazione"]').val();
    var dateCorfu = ["2020-07-16","2020-07-23","2020-07-30",
                     "2020-08-06","2020-08-13","2020-08-20"];
    var dateZante = ["2020-07-17","2020-07-24","2020-07-31",
                     "2020-08-07","2020-08-14"];
    var datePag = ["2020-07-18","2020-07-25","2020-08-01","2020-08-08"];
    var slice = date.toISOString().slice(0, 10);
    if (drop_destinazione == 'Corfù') {
        for (var i = 0; i < dateCorfu.length; i++) {
            if (slice == dateCorfu[i]) return true;
        }
    }
    else if(drop_destinazione == 'Zante') {
        for (var i = 0; i < dateZante.length; i++) {
            if (slice == dateZante[i]) return true;
        }
    }
    else if(drop_destinazione == 'Pag') {
        for (var i = 0; i < datePag.length; i++) {
            if (slice == datePag[i]) return true;
        }
    }
    else { console.log('no destination selected'); }
    return false;
}

不过,您可以采取一些措施来减少代码的重复性:

function(date) {
    var drop_destinazione = jQuery('[name="destinazione"]').val();
    var slice = date.toISOString().slice(0, 10);
    var allowed = {
        Corfù: ["2020-07-16","2020-07-23","2020-07-30",
                "2020-08-06","2020-08-13","2020-08-20"],
        Zante: ["2020-07-17","2020-07-24","2020-07-31",
                "2020-08-07","2020-08-14"],
        Pag: ["2020-07-18","2020-07-25","2020-08-01",
              "2020-08-08"],
    };
    if (allowed[drop_destinazione] == undefined) {
        console.log('no destination selected');
        return false;
    }
    return allowed[drop_destinazione].indexOf(slice) !== -1;
}

当然,属性名称“Corfù”看起来不太好,但是“ drop_destinazione”似乎是一个下拉列表,它们既有值又有标签(请参见https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select)。您应该将值设置为简单字符串,例如“ corfu”:

<select>
    <option value="corfu">Corfù</option>
    ...
</select>

如果您这样做,可以使允许的索引看起来更好:

var allowed = {
    corfu: ["2020-07-16","2020-07-23","2020-07-30",
            "2020-08-06","2020-08-13","2020-08-20"],
    zante: ["2020-07-17","2020-07-24","2020-07-31",
            "2020-08-07","2020-08-14"],
    pag: ["2020-07-18","2020-07-25","2020-08-01",
          "2020-08-08"],
};

希望这会有所帮助!

相关问题