Не удается прочитать разделение свойства Undefined для ввода текста - PullRequest
Новая
       21

Не удается прочитать разделение свойства Undefined для ввода текста

0 голосов
/ 01 мая 2020

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

var inputValue = getInputValue();
var inputValueLetters = inputValue.split();
function getInputValue(){
    // Selecting the input element and get its value 
    var inputVal = document.querySelector("#myInput").value;
    
    // Displaying the value
    console.log(inputVal);
};
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Get Text Input Field Value in JavaScript</title>
</head>
<body>
    <h1>Morsi: Translate Plain Text Into Morse Code</h1>
    <input type="text" placeholder="Type something..." id="myInput">
    <button type="button" onclick="getInputValue();">Get Value</button>
    
<script src="morsi.js"></script>
</body>
</html>

Ответы [ 3 ]

1 голос
/ 01 мая 2020

Эта строка: 

var inputValue = getInputValue();

Назначает ли функция getInputValue(); возврат к переменной inputValue

Эта функция возвращает undefined, что в принципе ничего, потому что есть внутри него нет оператора return, поэтому вторая строка выглядит следующим образом: 

var inputValueLetters = undefined.split();

Ошибка, которую вы получаете Cannot read property 'split' of undefined" достаточно ясна undefined равна nothing, а nothing имеет nothing так как вы можете ожидать, что nothing будет иметь split().

Что вам нужно, это только когда нажата кнопка, получить значение ввода, затем вызвать split() для этого значения.

Также, если вы хотите разбить текст на массив букв, вам нужно указать функции разбиения, по какой символ он хочет, чтобы она разбивала space или forward slash (/) et c ..

В нашем случае это ничего, поэтому мы пропускаем пустую строку ""

function getInputValue() {
  // Selecting the input element and get its value 
  var inputValue = document.querySelector("#myInput").value;
  var inputValueLetters = inputValue.split("");
  // Displaying the value
  console.log(inputValueLetters);
};
<h1>Morsi: Translate Plain Text Into Morse Code</h1>
<input type="text" placeholder="Type something..." id="myInput" value="text">
<button type="button" onclick="getInputValue();">Get Value</button>
1 голос
/ 01 мая 2020

Вы вызвали функцию "getInputValue" в первой строке вашего скрипта. 

var inputValue = getInputValue();

Эта функция возвращает undefined, а затем вы пытаетесь вызвать .split метод undefined и получили эту ошибку.

Если вы удалите первые две строки вашего скрипта - вы не получите ошибки. Если вам нужны дополнительные логики c, а не просто выводить входное значение на консоль, то вам нужно поместить этот лог c в функцию getInputValue после считывания значения ввода. Например: 

function getInputValue(){
  // Selecting the input element and get its value 
  var inputVal = document.querySelector("#myInput").value;

  // Displaying the value
  console.log(inputVal);
  const letters = inputVal.split('');
  console.log(letters);
};

Кроме того, убедитесь, что я использовал пустой строковый аргумент в функции разделения для разделения значения по буквам. Если вы этого не сделаете, у вас будет массив только с одним элементом, то есть целым входным значением

0 голосов
/ 01 мая 2020

Вы должны использовать .split('')

const hello = 'hello'
console.log(hello.split())
console.log(hello.split(''))
...