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

Question

Я пытаюсь создать программу, которая будет отображать пользовательский ввод строки в виде матрицы 5x5 x. Таким образом, если пользователь вводит «абв», полученный результат должен быть в первом ряду:

Expected output

В настоящее время я только сделал его доступным для а, Ь и с, которые будут отображаться, но будет расширяться его каждая буква в алфавите, когда код работает.

Я сделал массив для каждой строки, который содержит символы, необходимые для создания буквы в каждой строке.

Так что если пользователь вводит abc, программа разделяет входные данные на массив символов ['a', 'b', 'c'], а затем подсчитывает длину ввода (3). Начинается цикл while, который будет проверять, чтобы увидеть, в какой букве находится первый элемент пользовательского ввода, и будет соответствовать ему с правильным элементом в массиве alphaRow1 и распечатать его. Цикл while повторит это, пока он не пройдет через каждый элемент пользовательского ввода.

В настоящее время я только попытался выполнить код для первой строки, но позже добавлю другие строки.

Каждый раз, когда я вхожу в пользовательский ввод, он имеет элемент alphaRow1 для 'a', независимо от того, вводю ли я 'b' или'c '. Цикл в то время, как представляется, правильно повторить, так что если я вхожу в аЬс, он будет отображать элемент alphaRow1 для «а» 3 раза:

Actual output when user input is "abc"

Я не уверен, что происходит не так, чтобы он отображал только первый элемент каждый раз. Цикл while выглядит правильно и кажется правильным.

alphaRow1 = [" x ","xxxx "," xxxx"]; 
alphaRow2 = [" x x ","x x","x "]; 
alphaRow3 = [" xxx ","xxxx ","x "]; 
alphaRow4 = ["x x","x x","x "]; 
alphaRow5 = ["x x","xxxx "," xxxx"]; 

input=prompt("Enter something","Enter here"); 
letterCount=0; 

splitInput = input.split(''); 
inputLength = input.length; 



while (letterCount < inputLength){ //while loop for first row. 
    if (splitInput[letterCount] = 'a'){ //if selected element in user input 
     document.write(alphaRow1[0]); //is 'a' display first element from 
     letterCount++;     //alphaRow1 
    } 
    else if (splitInput[letterCount] = 'b'){ 
     document.write(alphaRow1[1]); 
     letterCount++; 
    } 
    else if (splitInput[letterCount] = 'c'){ 
     document.write(alphaRow1[2]); 
     letterCount++; 
    } 
    else{ 
     document.write("error"); 
    } 
} 

Answer 1

В ваших операторах if и else имеется ошибка. Вы используете оператор присваивания =, когда вы должны использовать оператор равенства ==

Answer 2

Проблема с вашим кодом заключается в том, что вы должны использовать double == if if внутри цикла while.

Вы фактически переопределяете значения в операторах if и else if.

Answer 3

Помимо заданий, которые вы выполняете в состоянии if, вы также должны избегать использования document.write. Вместо этого создайте строку в качестве результата и обработайте фактический вывод на странице отдельно. Для этого вы можете использовать элемент pre, а затем установить его свойство textContent в результирующую строку. pre также будет отображать новые строки и использовать шрифт с монослоем, который вам нужен здесь.

Кроме того, структура данных для шаблонов будет проще использовать, если вы назовете шаблоны буквой, которую они представляют, т. Е. Создайте объект с свойством «a», который будет иметь в качестве значения полный шаблон для этой буквы , Таким образом вам не нужны все эти отдельные условия, которые могут закончиться, если вам нужно охватить весь диапазон букв и символов.

Предлагаемый код. Попробуйте.

// Define your patterns keyed by the letter first, not by the line 
 
var pattern = { 
 
    a: [" X ", 
 
     " X X ", 
 
     " XXX ", 
 
     "X X", 
 
     "X X", 
 
     "X X"], 
 
    b: ["XXXX ", 
 
     "X X", 
 
     "XXXX ", 
 
     "X X", 
 
     "X X", 
 
     "XXXX "], 
 
    c: [" XXXX", 
 
     "X ", 
 
     "X ", 
 
     "X ", 
 
     "X ", 
 
     " XXXX"], 
 
    '?': [" XXX ", 
 
      "X X", 
 
      " X ", 
 
      " X ", 
 
      "  ", 
 
      " X "] 
 
}; 
 

 
// Use split/join and map to gather the output string. Do 
 
// not write with document.write 
 
function getOutput(s) { 
 
    return pattern.a.map(function (_, lineNo) { 
 
     return s.split('').map(function(letter) { 
 
      if (!pattern[letter]) letter = '?' // default 
 
      return pattern[letter][lineNo]; 
 
     }).join(' '); 
 
    }).join('\n'); 
 
} 
 

 
// I/O handling: separated from logic 
 
var input = document.querySelector('input'); 
 
// Use pre element to have monospaced font and render all white space 
 
var output = document.querySelector('pre'); 
 

 
input.oninput = function() { 
 
    // At every change in the input, generate the output 
 
    output.textContent = getOutput(this.value); 
 
}

Input: <input> 
 
<pre></pre>