Строка или число в string?

254
07 октября 2021, 05:40

Пользователь вводит данные:

//В скрипте пытаюсь рассуждать,что если это не строка, то выводить ошибку 
var registration = document.getElementById("registration"); 
registration.onclick = function() { 
  var name = document.getElementById("name").value; 
  if (typeof(name) === "string") { 
    alert("Вы зарегистрированы"); 
  } else { 
    var nameColor = document.getElementById("name"); 
    nameColor.style.borderColor = "#FF0000"; 
    alert('Имя введено некорректно') 
  } 
}
<p>Введите имя: 
  <input id="name"> 
</p> 
<button id="registration">Зарегистрироваться</button>

И собственно вопрос: как в input узнать, что ввел пользователь: число или строку? К примеру: "12421" и "acaca". Как разделить первый и второй пример?

Answer 1

Input[type="text"] всегда возвращает символы в качестве строки, хоть вы и можете написать там одни цифры. Для такой валидации лучше использовать регулярные выражения.

var registration = document.getElementById("registration"); 
registration.onclick = function() { 
  var input = document.getElementById("name"); 
  var letters = /^[A-Za-z]+$/; 
  if (input.value.match(letters)) { 
    alert("Вы зарегистрированы"); 
  } else { 
    input.style.borderColor = "#FF0000"; 
    alert('Имя введено некорректно'); 
  } 
}
<div>Введите имя:</div> 
<input type="text" id="name"> 
<button id="registration">Зарегистрироваться</button>

Answer 2

function stringOrNumber(str) { 
  if (isNaN(str)) { 
    return "string"; 
  } else { 
    return "number"; 
  } 
} 
 
console.log(stringOrNumber("12421")); 
console.log(stringOrNumber("acaca"));

Answer 3

А можно вообще без скрипта, использовать атрибут pattern )

<form> 
  <input pattern="^[a-zA-Z]$" title="Разрешаются только английские буквы."> 
  <input type="submit"> 
</form>

Answer 4

В JavaScript есть оператор typeof:

typeof undefined // "undefined"
typeof 0 // "number"
typeof true // "boolean"
typeof "foo" // "string"
typeof {} // "object"
typeof null // "object"
typeof function(){} // "function"
Answer 5

Есть много разных способов проверки строки на число, всё зависит от конкретной задачи, например, с помощь функции Number. Приведу несколько примеров (сначала код потом результат):

Number('wrwet');
NaN
Number('1.3');
1.3
Number('1e3');
1000

Как видно эта функция хорошо справляется с задачей, НО она пропускает экспоненциальную форму записи числа, а такой вариант зачастую не подходит.

Можно добавить проверку, является ли значение конечным числом. Лично я обычно делаю такую проверку:

if( !isNaN('1e1000') && isFinite('1e1000') ) { 
  console.log( 'конечное число'); 
} else { 
  console.log( 'не число (или очень большое число или Infinity'); 
}

Ещё важно учитывать должно ли число быть целим или может быть вещественным, может ли оно быть отрицательным или только положительным.

READ ALSO
Не происходит переключение событий jQuery? Не происходит повторный выбор условия

Не происходит переключение событий jQuery? Не происходит повторный выбор условия

Никак не могу понять в чем я ошибаюсьЕсть 3 ссылки и есть обработчик события, который срабатывает при клике на одну из 3-х ссылок

121
Решение задачи сортировка людей в парке по росту

Решение задачи сортировка людей в парке по росту

Вчера на сайте codesignal решал интересное задание сортировка людей по их росту в парке не трогая деревья

170
Селектор и массив

Селектор и массив

Стыдно просить такую мелочь, но голова не работает

113