根据用户输入动态创建和覆盖变量

时间:2018-10-01 07:47:29

标签: javascript

在以下代码中,用户可以通过输入类型文本元素利用window对象创建变量。我编写了一个函数,该控制台将记录变量的名称,后跟0的值,变量在其中初始化。仅当以下关键字字符串文字"-nr "在创建的变量的所需名称之前时才会发生。

本练习的目的是在将变量名称重新输入到输入元素中时,将所有创建的变量值增加1。我这样做的尝试是,首先编写第一个函数varCreate来声明变量并将变量初始化为0push放入数组中,并在控制台中记录变量名及其后的值。我对(varPlus)有问题的下一个函数是在将特定名称输入到输入元素中时,将1添加到每个值的值中,但是,它添加的内容比{即使使用1循环来评估输入元素value属性的字符串文字值是否等于数组for的每个元素,也可以使用{1}}。

varArray
const _in = document.getElementById('in');

var varArray = [];

function varCreate(e) {

    let _key = e.key;
    if(_key === "Enter") {

        if(_in.value.substring(0, 4) == "-nr ") {

            window[_in.value.substring(4).replace(/\s/g, "_")] = 0;
            varArray.push(_in.value.substring(4).replace(/\s/g, "_"));
            console.log("var: " + varArray[varArray.length - 1] + "\nvalue: " + window[varArray[varArray.length - 1]]);

            _in.value = "";

        }

    }

}

function varPlus(e1) {

    let _key1 = e1.key;
    if(_key1 === "Enter") {

        checker = new RegExp(_in.value.replace(/\s/g, "_"), "gi");
        for(var i = 0; i < varArray.length; i++) {

            if(checker.test(varArray[i])) {

                window[varArray[i]] += 1;
                console.log("var: " + varArray[i] + "\nvalue: " + window[varArray[i]]);

            }

        }

        delete window["checker"];

    }

}

_in.addEventListener('keydown', varCreate);
_in.addEventListener('keydown', varPlus);

尝试使用<input id='in' type='text' /> 时的最终结果是它将控制台记录所有变量名和值,而当它应该仅控制台记录仅我尝试访问的变量名时,其值会以某种方式递增通过用户输入及其值。如果有人能阐明我如何遇到这些错误,我将不胜感激。

1 个答案:

答案 0 :(得分:0)

首先,如果您尝试使代码可执行:

现在,对于用户生成的变量,您可以执行以下操作:

// DOM Elements
const input_variable = document.getElementById("input_variable");
const button_createVariable = document.getElementById("button_createVariable");

// Variables
let userVariables = {};

// Event listeners
window.addEventListener("keyup", event => {if(event.key == "Enter") parseVariable()});
button_createVariable.addEventListener("click", parseVariable);


function parseVariable() {
    // Get the variable name and remove all spaces
    let variableName = input_variable.value.substring(0, input_variable.value.indexOf("=")).replace(/\s+/g, '');
    // Get the variable value and remove all spaces
    let variableValue = input_variable.value.substring(input_variable.value.indexOf("=") + 1, input_variable.value.length).replace(/\s+/g, '');
    // Add the variable to the object
    userVariables[variableName] = variableValue;
    // Clear the input
    input_variable.value = "";
    // Log the object into the console
    console.log(userVariables);
}
<input id='input_variable' type='text'/><button id="button_createVariable">Create</button>

警告当然,您仍然需要验证用户输入。在这种状态下,它将接受所有内容作为输入。但是现在您可以遍历该对象并计数(或其他)(如果已经存在)。

哦是的,语法很简单:<name> = <value>例如。 foo = 10 ..不重要的细节:P