Определение типа данных в JavaScript: число или строка

Пройдите тест, узнайте какой профессии подходите

Я предпочитаю
0%
Работать самостоятельно и не зависеть от других
Работать в команде и рассчитывать на помощь коллег
Организовывать и контролировать процесс работы

Быстрый ответ

Для быстрого определения числа или строки взгляните на результат работы оператора typeof в JavaScript:

JS
Скопировать код
let varNum = 42, varStr = "hello";
let isNumber = typeof varNum === 'number';  // true – если число, иначе false
let isString = typeof varStr === 'string';  // true – если строка, иначе false

Оператор typeof значительно облегчает задачу идентификации типов данных.

Кинга Идем в IT: пошаговый план для смены профессии

Ограничения оператора 'typeof'

Отметим, что оператор typeof не является универсальным. Например, typeof new String('asdf') выдаст 'object'. Для более аккуратной проверки типов string и number используется Object.prototype.toString:

JS
Скопировать код
let isTrueString = Object.prototype.toString.call(varStr) === '[object String]'; // самый надёжный способ проверки строк
let isTrueNumber = Object.prototype.toString.call(varNum) === '[object Number]'; // безупречное распознавание числа

Для исключения NaN, Infinity и -Infinity из числовых значений используется Number.isFinite(value):

JS
Скопировать код
let varInfinity = Infinity;
let isFiniteNumber = Number.isFinite(varNum); // возвращает true только для конечных чисел

Когда нужно определить, является ли строка числовой, используйте регулярное выражение:

JS
Скопировать код
let isNumericString = /^-?\d+(\.\d+)?([eE][+-]?\d+)?$/.test(varStr); // проверяет, является ли строка числовой

"Серые места" JavaScript

JavaScript не всегда предельно очевиден. Справиться с числовыми строками и строками, содержащими числа, поможет преобразование типов с использованием функции parseFloat и isNaN:

JS
Скопировать код
let isNumberCasted = !isNaN(parseFloat(varStr)) && isFinite(varStr); // определение числа в строке

Не забывайте, что NaN — это единственное значение в JavaScript, которое не равно самому себе. Неравенство varNum !== varNum намекнет вам на наличие NaN.

Визуализация

Разгадка того, является ли значение числом или строкой, напоминает детективное расследование:

Markdown
Скопировать код
Чтобы разобраться с 'x':

1. Используем `typeof`:
   `typeof x === 'number'` → 📊 Отлично: это число!
   `typeof x === 'string'` → 📜 Прекрасно: это строка!

2. Пробуем применить `isNaN`:
   `!isNaN(x)` → 💡 Это число!

3. Применяем `parseFloat`:
   `x == parseFloat(x)` → 🔍 Найдено закрытое число!

**Тайна раскрыта**: все элементы головоломки собраны, 'x' раскритикован.

Помните:

  • typeof — ваш первый ассистент.
  • isNaN — надёжный визави.
  • parseFloat — искатель замаскированных чисел.

Применяя эти инструменты, вы успешно справитесь с головоломками типов данных в JavaScript!

Обработка реальных ситуаций

В практических задачах важно уметь различать числа и строки для корректного управления данными. Вот несколько типичных примеров:

1. Обработка данных формы

JS
Скопировать код
function validateInput(input) {
  return Number.isFinite(+input) || input.trim().length > 0; // надёжная валидация пользовательского ввода
}

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

2. Обработка данных JSON

Часто в данных JSON строки маскируются под числа. Чтобы раскрыть их истинное лицо:

JS
Скопировать код
function coerceType(value) {
  if (!isNaN(value) && value !== '') {
    return +value; // обнажаем внутреннее число
  }
  return value;
}

Такая функция помогает почистить строковые представления чисел и вернуть их к первоначальному числовому облику.

3. Интерпретация ввода пользователя

Порядок сортировки введенных данных зависит от их типа:

JS
Скопировать код
function sortByType(a, b) {
  let aIsNumber = typeof a === 'number';
  let bIsNumber = typeof b === 'number';
  if (aIsNumber && bIsNumber) {
    return a – b; // числа сравниваются просто
  } else if (!aIsNumber && !bIsNumber) {
    return a.localeCompare(b); // строки сортируются лексикографически
  }
  return aIsNumber ? -1 : 1;
}

В примере выше числа и строки упорядочиваются согласно своим местам в итоговом расположении.

Паломничество к underscore.js

Для облегчения жизни разработчикам библиотека underscore.js предлагает метод _.isString(obj), который умеет определить строки:

JS
Скопировать код
let isUnderscoreString = _.isString(varStr); // underscore.js сообщит нам, что перед нами именно строка

Такой "утиной" подход к типизации позволяет выявить, ведет ли себя объект как строка, на основе его методов или свойств.

Полезные материалы

  1. typeof – JavaScript | MDN — документация по оператору typeof.
  2. JavaScript typeof — обучающее пособие по typeof.
  3. Detecting an "invalid date" Date instance in JavaScript – Stack Overflow — дискуссия о датах и типах в JavaScript.
  4. Преобразования типов — детальное рассмотрение преобразований между строками и числами.
  5. ECMAScript® 2024 Language Specification — официальная спецификация языка о числовых преобразованиях.
  6. JavaScript: The World's Most Misunderstood Programming Language — Дуглас Крокфорд о сложностях понимания JavaScript.
  7. Medium: JavaScript Type Checking with TypeScript — использование TypeScript для проверки типов.