Learn JavaScript

toFixed() - метод для форматирования числа с фиксированным количеством знаков после запятой в JavaScript

toFixed() форматирует число так, чтобы после запятой было заданное количество знаков.

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

Синтаксис

number.toFixed(digits)
  • number - число
  • digits - сколько знаков оставить после запятой

Что делает toFixed()

Метод берёт число, округляет его при необходимости и возвращает строку с фиксированным количеством знаков после запятой.

console.log((12.345).toFixed(2)); // "12.35"
console.log((12).toFixed(2));     // "12.00"

Если дробных знаков не хватает, toFixed() дописывает нули.

Что возвращает toFixed()

Это очень важный момент: toFixed() возвращает не число, а строку.

const result = (12.3).toFixed(2);

console.log(result);        // "12.30"
console.log(typeof result); // "string"

Если потом нужно именно число, его обычно приводят отдельно:

const value = Number((12.3).toFixed(2));

console.log(value);        // 12.3
console.log(typeof value); // "number"

Округление

toFixed() округляет число до нужного количества знаков.

console.log((12.345).toFixed(2)); // "12.35"
console.log((2.35).toFixed(1));   // "2.4"
console.log((1.23).toFixed(0));   // "1"

То есть метод не просто обрезает дробную часть, а именно округляет.

digits = 0

Если передать 0, результат будет без дробной части.

console.log((12.9).toFixed(0)); // "13"
console.log((12.1).toFixed(0)); // "12"

Это похоже на округление до целого, но результат всё равно остаётся строкой.

Число не меняется

toFixed() не изменяет исходное значение. Он просто возвращает новую строку.

const price = 12.345;
const formatted = price.toFixed(2);

console.log(price);     // 12.345
console.log(formatted); // "12.35"

Нюанс с плавающей точкой

Как и другие операции с дробными числами в JavaScript, toFixed() может показывать странности из-за особенностей хранения number.

console.log((2.55).toFixed(1)); // "2.5"
console.log((0.3).toFixed(50));
// "0.29999999999999998889776975374843459576368331909180"

Это не ошибка самого toFixed(), а обычная проблема точности у чисел с плавающей точкой.

Слишком большие числа

Для очень больших чисел метод может вернуть результат в экспоненциальной записи.

console.log((1e21).toFixed(2)); // "1e+21"

Это важно помнить, если вы ожидаете длинную обычную запись числа.

Допустимый диапазон digits

Аргумент digits должен быть в диапазоне от 0 до 100.

Если выйти за пределы, будет ошибка RangeError.

(1.23).toFixed(101); // RangeError

toFixed() и шаблоны интерфейса

Чаще всего toFixed() нужен именно для вывода.

const price = 199.9;

console.log(`Цена: ${price.toFixed(2)} ₽`);

Для отображения денег или процентов это очень частый сценарий.

Частая ошибка с целыми литералами

Так писать нельзя:

123.toFixed(2)

У числа без дробной части точка воспринимается как часть литерала. Поэтому обычно пишут так:

console.log((123).toFixed(2)); // "123.00"
console.log(123..toFixed(2));  // "123.00"

Первый вариант читается понятнее.

Когда это полезно

toFixed() удобно использовать, когда:

  • нужно показать цену с двумя знаками после запятой
  • важно вывести ровное количество дробных знаков
  • число нужно подготовить для интерфейса, таблицы или отчёта

Пример:

const discount = 7;

console.log(`${discount.toFixed(2)}%`); // "7.00%"

Частые ошибки

Думать, что toFixed() возвращает число

const result = (12.3).toFixed(2);

console.log(typeof result); // "string"

Если потом нужен именно number, его придётся получить отдельно.

Думать, что метод просто обрезает дробную часть

console.log((12.349).toFixed(2)); // "12.35"

Метод округляет, а не отрезает лишние цифры.

Удивляться неточностям на дробных числах

console.log((2.55).toFixed(1)); // "2.5"

Здесь проблема не в toFixed(), а в том, как JavaScript хранит дробные числа.

Быстрая памятка

  • toFixed() задаёт фиксированное количество знаков после запятой
  • метод возвращает строку, а не число
  • он округляет число, а не просто обрезает дробную часть
  • digits должен быть от 0 до 100
  • на дробных числах возможны обычные проблемы точности JavaScript

Коротко

toFixed() - это удобный способ красиво отформатировать число для вывода. Главное, что стоит запомнить: метод возвращает строку, умеет округлять и иногда показывает особенности работы JavaScript с дробными числами.