Я работаю над базовой программой P5, которая требует до десяти полей ввода.

Поэтому мне нужно сначала создать экземпляры кнопки, используя, например,

factor1Input = createInput(""); // create DOM element for input field factor1Input.position(leftMargin, topMargin   50); // place button on screen factor1Input.changed(this.factor1update); // call function when value changes factor1Button = createButton('Update Factor'); // create DOM element for button factor1Button.position(100, 100); // position button 

Затем переключите их видимость, используя, например,

  factor1Input.show(); // toggle display on factor1Button.show(); factor1Input.hide(); // or toggle it off factor1Button.hide(); 

Но поскольку у меня будет до 10, для этого потребуется тонна повторяющегося кода.

Поэтому я хочу создать цикл, который выглядит примерно так (например, только для функции show);

  for (let i = 1; i {amp}lt; factorCount; i  ){ let fci = "factor"   i   "Input"; let fcb = "factor"   i   "Button"; fci.show(); fcb.show(); } 

Но я получаю следующую ошибку:

 Uncaught TypeError: fci.show is not a function 

Что предполагает какое-то несоответствие типов, то есть я не могу просто скомпилировать строку и распознать ее как функцию JavaScript.

Какие-либо предложения?

fci будет строкой, поэтому класс String не будет иметь метода show. Вы получите исключение. Вместо

Вы можете написать таким образом

 var factorObject = { factor1Input:createInput("") } factorObject['factor1Input'].position(leftMargin, topMargin   50); 

Для шоу

 factorObject['factor1Input'].show(); 

Здесь в цикле

  for (let i = 1; i {amp}lt; factorCount; i  ){ let fci = "factor"   i   "Input"; factorObject[fci].show(); } 

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

 let fci = "factor"   i   "Input"; fci.show(); // fci is just a string 'factor1Input', has nothing in common with factor1Input variable 

Вы должны использовать массивы Arrays и вместо того, чтобы хранить входной номер (например, индекс) внутри имени, пусть это будет индекс элемента в массиве

 const factorCount = 10 const inputs = [] const buttons = [] // example of creating inputs and buttons in a loop, you can create them manually if you want, // but don't forget to .push them to respective array for (let i = 1; i {amp}lt; factorCount; i  ){ const input = createInput(""); input.position(leftMargin, topMargin   50 * i); // using index to calculate top margin input.changed((value) ={amp}gt; this.factorUpdate(i, value)); // notice the change here inputs.push(input) const button = createButton('Update Factor'); button.position(100, 100   50 * i); // also using index to calculate top margin buttons.push(button) } function showInput(index) { inputs[index].show() buttons[index].show() } function hideInput(index) { inputs[index].hide() buttons[index].hide() } showInput(3) // shows 3rd input and button hideInput(4) // hides 4th input and button 

Обратите внимание, как я изменил ваш this.factor1update метода this.factor1update . Точно так же, как вы не хотите иметь 10 отдельных переменных для 10 элементов, вы не хотите иметь 10 методов для обработки изменений в этих 10 элементах (что, если бы было 10000 элементов?). Вместо этого создайте один метод factorUpdate который будет получать индекс элемента и значение, которое было изменено, и использовать его для обработки изменения ввода