Number.parseInt() в JavaScript — рядок у ціле число

Загальний опис

Number.parseInt() - це метод у JavaScript, призначений для перетворення рядка на ціле число. Основна його задача - аналізувати рядкові значення та видавати відповідне ціле число. Це особливо корисно, коли потрібно працювати з числовими даними, які отримані у вигляді тексту з різних джерел, таких як веб-форми, API чи файли конфігурації.

Для використання Number.parseInt(), передайте рядок, який ви бажаєте перетворити, як аргумент. Розглянемо простий приклад:

let number = Number.parseInt("10");
console.log(number); // Виведе 10

Метод Number.parseInt() буде аналізувати рядок зліва направо до тих пір, поки не зіткнеться з символом, який не є частиною цілого числа:

let number = Number.parseInt("34abc");
console.log(number); // Виведе 34

Якщо рядок починається з символу, який не може бути конвертований у число, метод поверне NaN:

let number = Number.parseInt("abc34");
console.log(number); // Виведе NaN

Особливість Number.parseInt() полягає в тому, що ви також можете вказати основу системи числення, як другий аргумент. Наприклад, якщо ви хочете перетворити число у шістнадцятковій системі:

let hexNumber = Number.parseInt("A", 16);
console.log(hexNumber); // Виведе 10

Додаткові особливості Number.parseInt():

1. Якщо рядок починається з "0x" або "0X", метод розглядає його як шістнадцяткове число, незалежно від того, чи була вказана основа.
2. Метод також ігнорує ведучі пробільні символи в рядку.

правити

Порада

автор: Bond правити

Порада

Якщо перший символ не може бути перетворений на число, Number.parseInt() поверне NaN. Тож завжди перевіряйте вивід на валідність.

let value = Number.parseInt("abc");
if (isNaN(value)) {
    console.log("Це не ціле число!");
}

автор: Bond правити

Нотатка

Number.parseInt() автоматично ігнорує лідируючі пробіли у рядку. Тож рядок " 42" буде успішно перетворений на число 42.

автор: Bond правити

Нотатка

На відміну від Number.parseFloat(), Number.parseInt() може приймати другий аргумент — систему числення. Це корисно, коли потрібно аналізувати числа не тільки у десятковій, але й у інших системах числення, як-от двійковій, вісімковій або шістнадцятковій.

let binary = "1011";
let decimal = Number.parseInt(binary, 2); // 11 у десятковій системі

автор: Bond правити

+ додати пораду чи нотатку

Синтаксис

Number.parseInt(string)
Number.parseInt(string, radix)

Параметри

string

Значення для аналізу, яке приводиться до рядкового типу. Початкові пробіли в цьому аргументі ігноруються.

автор: Bond

правити

radix

Ціле число між 2 та 36, яке представляє основу системи числення для даного рядка.

автор: Bond

правити

Повернення

integer

Повертає ціле число, отримане з заданого рядка. Якщо основа менша за 2 або більша за 36, або перший символ, що не є пробільним, не може бути конвертований у число, повертається значення NaN (Not-a-Number).

автор: Bond

правити

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі Серверні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
	34	25	9	21	12	—

Підтримка: мобільні переглядачі

Переглядач
	37	34	25	9

Підтримка: серверні переглядачі

Переглядач
	0.12.0	1.0

Приклади

+ запропонувати свій приклад у пісочниці

<header>
  <h2 class="title">Number.parseInt()</h2>
  <p class="description">Перетворює рядок на ціле число.</p>
</header>
<main>
  <div class="result">
    <label for="inputString">Введіть рядок з числом:</label>
    <input id="inputString" type="text" value="56abc">
    <button onclick="convertString()">Конвертувати</button>
    <p id="output">Результат: </p>
  </div>
</main>

body {
  font-size: 16px;
  line-height: 1.5;
  font-family: monospace;
}

header {
  background-color: #f1f1f1;
  margin-bottom: 25px;
  padding: 15px;
  -webkit-box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
  -moz-box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
  box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
}

header h2.title {
  padding-bottom: 15px;
  border-bottom: 1px solid #999;
}

header p.description {
  font-style: italic;
  color: #222;
}

.result {
  background-color: #f8f8f8;
  padding: 15px;
  -webkit-box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
  -moz-box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
  box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
}

button {
  margin-top: 10px;
  padding: 5px 10px;
  cursor: pointer;
}

function convertString() {
  // Отримуємо рядок з інпута
  const inputString = document.getElementById('inputString').value;

  // Використовуємо Number.parseInt() для конвертації рядка у ціле число
  const number = Number.parseInt(inputString);

  // Виводимо результат на сторінку
  document.getElementById('output').textContent = 'Результат: ' + number;
}
//# sourceURL=pen.js

// Оголошення рядкової змінної із числом у шістнадцятковій системі числення
const hexString = "A3F";

// Конвертація рядкового значення у ціле число використовуючи основу системи числення 16
const decimalNumber = Number.parseInt(hexString, 16);

// Виведення результату
console.log(decimalNumber);  // 2623

// Оголошення рядкової змінної із числом та текстом
const stringWithNumber = "123привіт";

// Конвертація рядкового значення у ціле число
const number = Number.parseInt(stringWithNumber);

// Виведення результату
console.log(number);  // 123