джава скрипт модуль числа
Базовые операторы, математика
В этой главе мы начнём с простых операторов, а потом сконцентрируемся на специфических для JavaScript аспектах, которые не проходят в школьном курсе арифметики.
Термины: «унарный», «бинарный», «операнд»
Прежде, чем мы двинемся дальше, давайте разберёмся с терминологией.
Унарным называется оператор, который применяется к одному операнду. Например, оператор унарный минус «-» меняет знак числа на противоположный:
Бинарным называется оператор, который применяется к двум операндам. Тот же минус существует и в бинарной форме:
Формально, в последних примерах мы говорим о двух разных операторах, использующих один символ: оператор отрицания (унарный оператор, который обращает знак) и оператор вычитания (бинарный оператор, который вычитает одно число из другого).
Математика
Поддерживаются следующие математические операторы:
Первые четыре оператора очевидны, а про % и ** стоит сказать несколько слов.
Взятие остатка %
Возведение в степень **
В выражении a ** b оператор возведения в степень умножает a на само себя b раз.
Математически, оператор работает и для нецелых чисел. Например, квадратный корень является возведением в степень 1/2 :
Сложение строк при помощи бинарного +
Давайте рассмотрим специальные возможности операторов JavaScript, которые выходят за рамки школьной арифметики.
Обычно при помощи плюса ‘+’ складывают числа.
Но если бинарный оператор ‘+’ применить к строкам, то он их объединяет в одну:
Обратите внимание, если хотя бы один операнд является строкой, то второй будет также преобразован в строку.
Как видите, не важно, первый или второй операнд является строкой.
Вот пример посложнее:
Например, вычитание и деление:
Приведение к числу, унарный +
Плюс + существует в двух формах: бинарной, которую мы использовали выше, и унарной.
Унарный, то есть применённый к одному значению, плюс + ничего не делает с числами. Но если операнд не число, унарный плюс преобразует его в число.
Необходимость преобразовывать строки в числа возникает очень часто. Например, обычно значения полей HTML-формы — это строки. А что, если их нужно, к примеру, сложить?
Бинарный плюс сложит их как строки:
Поэтому используем унарный плюс, чтобы преобразовать к числу:
С точки зрения математика, такое изобилие плюсов выглядит странным. Но с точки зрения программиста тут нет ничего особенного: сначала выполнятся унарные плюсы, которые приведут строки к числам, а затем бинарный ‘+’ их сложит.
Почему унарные плюсы выполнились до бинарного сложения? Как мы сейчас увидим, дело в их приоритете.
Приоритет операторов
В том случае, если в выражении есть несколько операторов – порядок их выполнения определяется приоритетом, или, другими словами, существует определённый порядок выполнения операторов.
Из школы мы знаем, что умножение в выражении 1 + 2 * 2 выполнится раньше сложения. Это как раз и есть «приоритет». Говорят, что умножение имеет более высокий приоритет, чем сложение.
В JavaScript много операторов. Каждый оператор имеет соответствующий номер приоритета. Тот, у кого это число больше, – выполнится раньше. Если приоритет одинаковый, то порядок выполнения – слева направо.
Отрывок из таблицы приоритетов (нет необходимости всё запоминать, обратите внимание, что приоритет унарных операторов выше, чем соответствующих бинарных):
| Приоритет | Название | Обозначение |
|---|---|---|
| … | … | … |
| 17 | унарный плюс | + |
| 17 | унарный минус | — |
| 16 | возведение в степень | ** |
| 15 | умножение | * |
| 15 | деление | / |
| 13 | сложение | + |
| 13 | вычитание | — |
| … | … | … |
| 3 | присваивание | = |
| … | … | … |
Присваивание
Присваивание = возвращает значение
Тот факт, что = является оператором, а не «магической» конструкцией языка, имеет интересные последствия.
Вызов x = value записывает value в x и возвращает его.
Благодаря этому присваивание можно использовать как часть более сложного выражения:
В примере выше результатом (a = b + 1) будет значение, которое присваивается переменной a (то есть 3 ). Потом оно используется для дальнейших вычислений.
Забавное применение присваивания, не так ли? Нам нужно понимать, как это работает, потому что иногда это можно увидеть в JavaScript-библиотеках.
Однако писать самим в таком стиле не рекомендуется. Такие трюки не сделают ваш код более понятным или читабельным.
Присваивание по цепочке
Рассмотрим ещё одну интересную возможность: цепочку присваиваний.
Опять-таки, чтобы код читался легче, лучше разделять подобные конструкции на несколько строчек:
Польза от такого стиля особенно ощущается при быстром просмотре кода.
Сокращённая арифметика с присваиванием
Часто нужно применить оператор к переменной и сохранить результат в ней же.
Эту запись можно укоротить при помощи совмещённых операторов += и *= :
Арифметические операторы в JavaScript
Математические операции являются одними из самых базовых и универсальных функций любого языка программирования. В JavaScript числа часто используются в общих задачах, таких как определение размеров окна браузера, вычисление окончательной цены денежной транзакции или расстояния между элементами в документе сайта.
Чтобы быть хорошим разработчиком, иметь высокие навыки в математике не обязательно, однако для этого важно знать, какие типы операций доступны в JavaScript и как использовать их для выполнения практических задач.
В отличие от других языков программирования, JavaScript имеет только один числовой тип данных; он не разделяет целые числа и числа с плавающей точкой.
Это руководство расскажет об арифметических операторах, операторах присваивания и порядке операций с числовыми данными JavaScript.
Арифметические операторы
Арифметические операторы – это символы, которые определяют математические операции и возвращают результат. К примеру, в 3 + 7 = 10 символ + определяет синтаксис операции сложения.
Многие операторы JavaScript знакомы вам из базовой математики, но есть также и несколько дополнительных операторов.
Все арифметические операторы JavaScript представлены в следующей таблице.
| Оператор | Синтаксис | Пример | Определение |
| Сложение | + | x + y | Сумма x и y |
| Вычитание | – | x – y | Разница между x и y |
| Умножение | * | x * y | Производное x и y |
| Деление | / | x / y | Частное x и y |
| Модуль | % | x % y | Остаток x / y |
| Возведение в степень | ** | x ** y | x в степени y |
| Инкремент | ++ | x++ | x плюс один |
| Декремент | — | x– | x минус один |
Сложение и вычитание
Операторы сложения и вычитания доступны в JavaScript и могут использоваться для нахождения суммы и разности числовых значений. JavaScript имеет встроенный калькулятор, а математические операции могут выполняться непосредственно в консоли.
Знак плюса позволяет складывать числа, например:
Помимо операций с простыми числами JavaScript позволяет присваивать числа переменным и выполнять с ними вычисления. Для примера можно присвоить числовые значения переменным x и y, а результат поместить в z.
// Assign values to x and y
let x = 10;
let y = 20;
// Add x and y and assign the sum to z
let z = x + y;
console.log(z);
30
Символ минус позволяет вычитать числа или выполнять операции с переменными:
Также можно складывать и вычитать отрицательные числа и числа с плавающей запятой.
В JavaScript есть одна интересная особенность, которую следует учитывать и знать, – это результат сложения числа и строки. Мы знаем, что 1 + 1 должно равняться 2, но это уравнение выдаст неожиданный результат.
let x = 1 + «1»;
console.log(x);
typeof x;
11
‘string’
Вместо сложения чисел JavaScript преобразует все выражение в строки и объединяет их. Важно быть осторожным с динамической типизацией JavaScript, поскольку она может иметь нежелательные результаты.
Сложение и вычитание в JavaScript часто используются для прокрутки панели навигации.
В этом случае панель будет прокручиваться на 60 пикселей от id.
Умножение и деление
Операторы умножения и деления JavaScript используются для поиска производного и частного числовых значений.
Звездочка является оператором умножения.
// Assign values to x and y
let x = 20;
let y = 5;
// Multiply x by y to get the product
let z = x * y;
console.log(z);
100
Умножение можно использовать для расчета цены товара после введения налога с продаж.
const price = 26.5; // Price of item before tax
const taxRate = 0.082; // 8.2% tax rate
// Calculate total after tax to two decimal places
let totalPrice = price + (price * taxRate);
totalPrice.toFixed(2);
console.log(«Total:», totalPrice);
Total: 28.67
Слеш – оператор деления.
// Assign values to x and y
let x = 20;
let y = 5;
// Divide y into x to get the quotient
let z = x / y;
console.log(z);
4
Деление особенно полезно при расчете времени, например, при вычислении количества часов или процента правильных ответов в тесте.
Модуль числа
Модуль – еще один арифметический оператор, менее популярный, чем предыдущие. Представлен символом %. Он возвращает остаток при делении первого числа на второе.
К примеру, мы знаем, что 9 делится на 3 без остатка:
Модуль числа позволяет определить четное или нечетное число, например:
// Initialize function to test if a number is even
const isEven = x => <
// If the remainder after dividing by two is 0, return true
if (x % 2 === 0) <
return true;
>
// If the number is odd, return false
return false;
>
// Test the number
isEven(12);
true
В этом примере 12 делится на 2, следовательно, это четное число.
В программировании модуль числа часто используется в сочетании с условными операторами.
Возведение в степень
Возведение в степень – один из самых новых операторов JavaScript. Синтаксис возведения в степень – две звездочки подряд (**).
К примеру, 10 в пятой степени (10^5) записывается так:
Операция 10 ** 5 имеет тот же результат, что 10 * 10, повторенная 5 раз.
10 * 10 * 10 * 10 * 10;
Также эту операцию можно записать с помощью метода Math.pow().
Math.pow(10, 5);
100000
Использование оператора возведения в степень – быстрый способ определить степень заданного числа, но, как обычно, при выборе между методом и оператором важно быть последовательными и писать код в одном стиле.
Инкремент и декремент
Операторы инкремента и декремента увеличивают или уменьшают числовое значение переменной на единицу. Они представлены двумя плюсами (++) или двумя минусами (–) и часто используются в циклах.
Обратите внимание: операторы инкремента и декремента могут использоваться только с переменными. Попытка использовать их с простыми числами приведет к ошибке.
7++
Uncaught ReferenceError: Invalid left-hand side expression in postfix operation
Операторы инкремента и декремента можно классифицировать как префиксные и постфиксные операции, в зависимости от того, где по отношению к переменной размещен оператор.
Префиксный инкремент записывается как ++х.
// Set a variable
let x = 7;
// Use the prefix increment operation
let prefix = ++x;
console.log(prefix);
8
Значение х увеличилось на 1. Постфиксный инкремент пишется как у++.
// Set a variable
let y = 7;
// Use the prefix increment operation
let postfix = y++;
console.log(postfix);
7
Постфиксная операция не увеличила значение. Это значение не будет увеличиваться до тех пор, пока выражение не будет оценено. Для этого нужно запустить операцию дважды:
Чаще всего эти операторы встречаются в циклах. В данном цикле for оператор запускается 10 раз, начиная с 0.
// Run a loop ten times
for (let i = 0; i
В этом примере итерация цикла выполняется с помощью оператора инкремента.
Проще говоря, х++ можно воспринимать как сокращение от х = х + 1, а х—как сокращение от х = х – 1.
Операторы присваивания
Одним из наиболее часто используемых операторов является оператор присваивания, который уже встречался в этом мануале. Он представлен знаком равенства (=). Символ = используется для присвоения значения справа переменной слева.
// Assign 27 to age variable
let age = 27;
Помимо стандартного оператора присваивания JavaScript имеет составные операторы присваивания, которые комбинируют арифметический оператор с оператором =.
К примеру, оператор добавления начнет с исходного значения и добавит к нему новое значение.
// Assign 27 to age variable
let age = 27;
age += 3;
console.log(age);
30
По сути, age += 3 – то же самое, что и age = age + 3.
Все арифметические операторы можно объединять с оператором присваивания. Ниже приведена справочная таблица операторов присваивания в JavaScript.
| Оператор | Синтаксис |
| Присваивание | = |
| Присваивание со сложением | += |
| Присваивание с вычитанием | -= |
| Присваивание с умножением | *= |
| Присваивание с делением | /= |
| Присваивание по модулю | %= |
| Присваивание с возведением в степень | **= |
Составные операторы присваивания часто используются в циклах, как инкременты и декременты.
Приоритет операторов
Операторы выполняются в порядке приоритетности, как и в обычной математике.
К примеру, умножение имеет более высокий приоритет, чем сложение.
// First multiply 3 by 5, then add 10
10 + 3 * 5;
25
Если сначала нужно выполнить операцию сложения, возьмите ее в круглые скобки – такие операции всегда имеют наивысший приоритет.
// First add 10 and 3, then multiply by 5
(10 + 3) * 5;
65
Ниже вы найдете таблицу приоритета арифметических операторов в JavaScript. Для инкремента и декремента постфикс имеет более высокий приоритет, чем префикс.
Инкремент/декремент, умножение/деление и сложение/вычитание имеют одинаковый уровень приоритета.
| Оператор | Синтаксис |
| Круглые скобки | () |
| Инкремент | ++ |
| Декремент | — |
| Возведение в степень | ** |
| Умножение | * |
| Деление | / |
| Сложение | + |
| Вычитание | – |
Приоритет имеют не только арифметические операторы, но и операторы присваивания, логические операторы, условные операторы и т. д. Полный список можно посмотреть здесь.
Базовая математика в JavaScript — числа и операторы
В этой части курса мы обсуждаем математику в JavaScript — как мы можем использовать operators (en-US) и другие функции, чтобы успешно манипулировать числами для выполнения наших задач.
| Необходимые условия: | Базовая компьютерная грамотность, базовое понимание HTML и CSS, понимание того, что такое JavaScript. |
|---|---|
| Цель: | Ознакомление с основами математики в JavaScript. |
Все любят математику
Хорошо, может быть, не все. Некоторые из нас любят математику, некоторые из нас ненавидели математику с тех пор, как мы изучали таблицу умножения в школе, а некоторые из нас находятся где-то между ними. Но никто из нас не может отрицать, что математика является фундаментальной частью жизни, и мы не можем обойтись без неё. Это особенно актуально, когда мы учимся программировать на JavaScript (или на любом другом языке, если на то пошло) — большая часть того, что мы делаем, опирается на обработку числовых данных, вычисление новых значений и т.д. Так что не удивительно, что JavaScript имеет полнофункциональный набор математических функций.
В этой статье обсуждаются только основные разделы, которые вам нужно знать сейчас.
Типы чисел
В программировании даже скромная система десятичных чисел, которую мы все так хорошо знаем, сложнее, чем вы думаете. Мы используем разные термины для описания различных типов десятичных чисел. Например:
У нас даже есть разные типы числовых систем:
Прежде чем взорвётся ваш мозг, остановитесь прямо здесь и сейчас!
Во-первых, мы просто будем придерживаться десятичных чисел на протяжении всего курса; вы редко когда будете сталкиваться с необходимостью думать в других числовых системах, если вообще когда-либо с ней столкнётесь.
Для меня всё — числа
Давайте быстро поиграем с некоторыми числами, чтобы снова познакомиться с основным синтаксисом, который нам нужен. Введите команды, перечисленные ниже, в вашу консоль (developer tools JavaScript console), или используйте простую встроенную консоль.
Арифметические операторы
Арифметические операторы — это основные операторы, которые мы используем для различных математических операций, например таких, как сложение или вычитание:
Возвращает значение остатка при делении первого числа на второе. Результат будет иметь тот же знак, что и первое число.
11 % 3 = 2 (поскольку число 3 вмещается три раза, остатком будет число 2)
Примечание: Иногда числа участвующие в математических операциях называют операндами ( operands (en-US) ).
Нам, вероятно, не нужно учить вас базовым математическим операциям, но мы хотели бы проверить ваше понимание синтаксиса. Попробуйте ввести приведённые ниже примеры в свою консоль (developer tools JavaScript console), или используйте встроенную консоль, с которой вы уже знакомы, чтобы ознакомиться с синтаксисом.
Некоторые примеры выше могут дать вам не тот результат, которого вы ожидали; приведённый ниже раздел может дать ответ на вопрос о том, почему.
Приоритет операторов
Давайте взглянем на последний пример сверху. Предположим, что num2 содержит значение 50 и num1 содержит значение 10 (как и было обозначено выше):
Будучи человеком, вы, вероятно, прочитаете это как «50 плюс 10 равно 60», затем «8 плюс 2 равно 10», и, наконец, «60 делить на 10 равно 6».
Но браузер видит это по-другому: «10 делить на 8 равно 1.25», затем «50 плюс 1.25 плюс 2 равно 53.25».
Если вы хотите переопределить порядок выполнения операторов, вы можете окружить парными скобками часть выражения, которая должна быть выполнена первой. Для получения результата 6 вам следует сделать следующее:
Результат этого выражения равен 6.
Примечание: полный список операторов JavaScript и приоритетов их выполнения можно найти по этой ссылке: Expressions and operators.
Операторы инкремента и декремента
Давайте попробуем сыграть с этим в вашей консоли. Для начала заметим, что вы не можете использовать инкремент/декремент непосредственно к числу, что может показаться странным. Дело в том, что мы присваиваем к переменной новое обновлённое число, а не просто вычисляем значение. Следующий пример приведёт к ошибке:
Таким образом, вы можете применить инкремент только к существующим переменным:
Операторы присваивания
Однако есть ещё несколько сложных конструкций, которые позволяют делать ваш код более простым и аккуратным. Наиболее часто используемые перечислены ниже:
x *= 3;
x = x * 3;
x /= 5;
x = x / 5;
Попробуйте использовать такие конструкции, что понять, как они работают. Сможете ли вы определить значение до того, как напишите вторую строку?
Заметьте, что значение справа может быть как числом (константой), так и переменной, например:
Примечание: есть ещё другие операторы присваивания, в этой статье перечислены только самые базовые.
Активное обучение: меняем размеры коробки
В коде сверху, который вы можете изменять, под комментарием есть две строчки, с помощью которых вы можете увеличивать/уменьшать размеры коробки. Мы хотим, чтобы вы выполнили несколько заданий:
Не расстраивайтесь, если вы не поняли код сверху. Нажмите кнопку Reset для запуска программы снова. Если вы смогли ответить верно на все вопросы, попробуйте поэкспериментировать с кодом ещё (или, например, предложить друзьям несколько заданий).
Операторы сравнения
Если вы попробуете использовать эти операторы в консоли, вы увидите, что все они возвращают значения true / false — о типе данных boolean мы писали в прошлой статье. С их помощью мы можем принимать решения в нашей программе, например:
Мы взглянем на то, как реализовать такую логику после знакомства с условными выражениями в следующей статье. Сейчас мы рассмотрим небольшой пример:
Примечание: Такой элемент управления, который переключается между двумя состояниями, обычно называется тумблером. Он переключается между одним состоянием и другим: свет включён, свет выключен и т. д.
Итого
В этой статье мы привели основную информацию, необходимую для работы с числами в JavaScript. Вы постоянно будете использовать числа в процессе обучения языку, поэтому желательно разобраться в этом сейчас. Если вам действительно не нравится математика, пусть вас утешит, что эта статья была сравнительно короткой.
В следующей статье мы изучим текст и то, как мы работаем с ним в JavaScript.
Математика в JavaScript
Введение
Наличие чисел и числовых данных позволяет вам каким-либо образом работать с языком. Но помимо работы с арифметическими операторами в JavaScript, математические конструкции могут быть сложной задачей для новичков. По этой причине, нужно концентрироваться не на синтаксисе, а на общих математических функциях, этот список начинается с таких вещей как сортировка, округление и генерация случайных значений, этого достаточно, прежде чем углубляться в детали. Чтобы работать с математикой в JavaScript, вам достаточно иметь понятия о таких вещах как функция, операнд и оператор.
От переводчиков
Работа со случайными числами
Случайные числа часто требуются в JavaScript, к примеру, для отрисовки звезд, разбросанных по ночному небу. Но есть много различных видов случайностей, и в зависимости от логики и потребностей вашего приложения вам может понадобиться один из них.
Основной случай
Самая простая форма случайности — это функция Math.random(), встроенная в JavaScript.
Math.random() всегда возвращает число с плавающей точкой между 0 и 1. С технической точки зрения число, возвращаемое при помощи Math.random() может быть 0, но никогда не будет равно 1.
Если вы часто используйте Math.random(), используйте свою собственную функцию в сценариях:
Проблема, конечно, в том, что данная функция всегда будет создавать случайное число в пределах весьма ограниченного диапазона, далее мы постараемся рассмотреть некоторые рекомендации предназначенные для решения этой проблемы.
Случайное число в интервале [min, max)
Расширение такой функциональности требует немного математики:
Случайное число с плавающей точкой:
Целочисленное случайное число:
Случайное число в интервале [min, max]
Булевские случайные величины (true/false)
Если вы хотите простую случайность 0 или 1, представляющую подбрасывание монеты:
Если вам нужно получить true или false:
Если вы хотите связать конкретные слова со сторонами монеты (да / нет, верх / низ и т.д.):
Случайные величины с исключениями
Для ограниченного диапазона целых чисел необходимо создать массив чисел, которые вы хотели бы извлечь и в дальнейшем выбрать случайным образом из этого массива:
Можно также использовать массив чисел, которые вы хотите исключить, и приготовить пустой массив, в котором будет содержаться результат фильтрации из первого массива во второй:
Затем в цикле прогоняем массив numPool, если выпавшее число существует и находится в массиве excludePool, помещаем результат в filteredPool:
И, наконец, получаем случайные числа из массива filteredPool:
Случайные величины без повторений
Для небольшого набора чисел необходимо создать массив, заполненный элементами, далее перетасуйте их в случайном порядке, поместите результат в новый массив, а затем вытаскивайте по одному:
Для получения более широкого диапазона чисел, создайте и заполните массив случайными числами, исключая любые, которые были ранее сгенерированы:
В приведенном выше коде numReserve заполняется 12ю случайными числами от 0 до 1000.
Криптографические случайные величины
К сожалению, ни один из выше методов не создает число с достаточной хаотичностью для криптографически защищенных функций (Math.random() не является достаточной функцией, которая генерирует случайные числа). Поэтому, мы можем использовать Web Cryptography API путем создания typedArray:
В этом случае мы создаем массив с восемью различными слотами, каждый из которых содержит беззнаковое 16-разрядное целое число. Существуют и другие варианты Int8Array, Uint8Array, int16Array, Int32Array и Uint32Array.
Затем, необходимо заполнить массив случайными числами определенного типа:
Ко всему прочему, Web Cryptography API имеет хорошую поддержку в современных браузерах.
К прочтению:
Округления
Очень часто вычисления в JavaScript дают не совсем те результаты, которые мы хотим. Разумеется, мы можем делать с числами что угодно — округлять в большую или меньшую сторону, устанавливать диапазоны, отсекать ненужные числа до определенного количества знаков после запятой, все зависит от того, что вы хотите сделать в дальнейшем с этим числом.
Зачем необходимо округление?
Одним из любопытных аспектов JavaScript является то, что он на самом деле не хранит целые числа, мы сразу же работаем с числами с плавающей точкой. Это, в сочетании с тем фактом, что многие дробные значения не могут быть выражены конечным числом знаков после запятой, в JavaScript мы можем получить такие результаты:
Для практических целей эта неточность не имеет никакого значения, в нашем случае мы говорим об ошибке в квинтиллионных долях, однако, кого-то это может разочаровать. Мы можем получить несколько странный результат и при работе с числами, которые представляют собой значения валют, процентов или размеров файла. Для того, чтобы исправить эти неточности, нам как раз и необходимо уметь округлять результаты, при этом достаточно установить десятичную точность.
Округление чисел имеет практическое применение, мы можем манипулировать числом в некотором диапазоне, например, хотим округлить значение до ближайшего целого числа, а не работать только с десятичной частью.
Округление десятичных чисел
Для того, чтобы отсечь десятичное число, используйте toFixed или метод toPrecision. Оба они принимают единственный аргумент, который определяет, соответственно, сколько значащих цифр (т.е. общее количество цифр, используемых в числе) или знаков после запятой (количество после десятичной точки) должен включать в себя результат:
Оба метода toFixed() и toPrecision() возвращают строковое представление результата, а не число. Это означает, что при суммировании округленного значения с randNum будет произведена конкатенация строк, а не сумма чисел:
Если вы хотите, чтобы результат имел числовой тип данных, то вам необходимо будет применить parseFloat:
Обратите внимание, что значения 5 округлены, за исключением редких случаев.
Методы toFixed() и toPrecision() являются полезными, ибо они могут не только отсекать дробную часть, но и дополнять знаки после запятой, что удобно при работе с валютой:
Стоить обратите внимание, что toPrecision будет давать результат в экспоненциальной записи, если число целых чисел больше, чем сам сама точность:
Как избежать ошибок округления с десятичными числами
В некоторых случаях, toFixed и toPrecision округляет значение 5 в меньшую сторону, а в большую:
Результат расчета выше должен был быть 1.01, а не 1. Если вы хотите избежать подобную ошибку, мы можем использовать решение, предложенное Jack L Moore, которое использует экспоненциальные числа для расчета:
Если вы хотите более надежное решение, чем решение показанное выше, вы можете перейти на MDN.
Машинное эпсилон округление
Альтернативный метод округления десятичных чисел был введен в ES6. Машинное эпсилон округление обеспечивает разумный предел погрешности при сравнении двух чисел с плавающей точкой. Без округления, сравнения могут дать результаты, подобные следующим:
Мы используем Math.EPSILON в нашей функции для получения корректного сравнения:
Функция принимает два аргумента: первый — текущий расчет, второй — ожидаемый результат. Она возвращает сравнение двух:
Все современные браузеры уже поддерживают ES6 математические функции, но если вы хотите получить поддержку в таких браузерах, как IE 11, используйте polyfills.
Отсечение дробной части
Все методы, представленные выше умеют округлять до десятичных чисел. Для того, чтобы просто отсечь число до двух знаков после запятой, необходимо сначала умножить его на 100, а затем полученный результат уже разделить на 100:
Если вы хотите приспособить метод под любое количество знаков после запятой, вы можете воспользоваться двойным побитовым отрицанием:
Округление до ближайшего числа
Для того, чтобы округлить десятичное число до ближайшего числа в большую или в меньшую сторону, в зависимости от того, к чему мы ближе всего, используйте Math.round():
Обратите внимание, что «половина значения», 0.5 округляется в большую сторону по правилам математики.
Округление к меньшему до ближайшего целого числа
Если вы хотите всегда округлять в меньшую сторону, используйте Math.floor:
Но если вы хотите избежать подобной ситуации, используйте Math.trunc, поддерживаемый во всех современных браузерах (кроме IE / Edge):
На MDN вы найдете polyfill, который обеспечит поддержку Math.trunc в браузерах и IE / Edge.
Округление к большему до ближайшего целого числа
С другой стороны, если вам нужно всегда округлять в большую сторону, используйте Math.ceil. Опять же, вспоминаем бесконечный лифт: Math.ceil всегда будет идти «вверх», независимо от того, является ли число отрицательное или нет:
Округление до большего/меньшего необходимого числа
Если мы хотим, чтобы округлить до ближайшего числа, кратного 5, самый простой способ создать функцию, которая делит число на 5, округляет его, а затем умножает его на ту же сумму:
Если вы хотите округлять до кратных своему значению, мы использовать более общую функцию, передавая в нее начальное значение и кратное:
Фиксирование числа в диапазоне
Есть много случаев, когда мы хотим получить значение х, лежащее в пределах диапазона. Например, нам может понадобиться значение от 1 до 100, но при этом мы получили значение 123. Для того, чтобы исправить это, мы можем использовать минимальное (возвращает наименьшее из набора чисел) и максимальное (возвращает наибольшее из любого множества чисел). В нашем примере, диапазон от 1 до 100:
Опять же, мы можем переиспользовать операцию и обернуть все это в функцию, воспользуемся решением предложенное Daniel X. Moore:
Гауссово округление
Гауссово округление, также известное как банковское округлением, заключается в том, что округление для этого случая происходит к ближайшему чётному. Этот метод округления работает без статистической погрешности. Лучшее решение было предложено Tim Down:
Десятичный знак в CSS:
Так как JavaScript часто используется для создания позиционного преобразования HTML-элементов, вы можете задаться вопросом, что произойдет, если мы cгенерируем десятичные значения для наших элементов:
Хорошая новость заключается в том, что современные браузеры будут учитывать десятичные значения в блочной модели, в том числе в процентных или пиксельных единицах измерения.
К прочтению:
Сортировка
Очень часто нам приходится сортировать какие-либо элементы, например, у нас есть массив игровых рекордов, при этом они должны быть организованы по убыванию ранга игроков. К сожалению, стандартный метод sort() имеет некоторые удивительные ограничения: он хорошо работает с часто употребляемыми английскими словами, но сразу же ломается при встрече с числами, уникальными символами или словами в верхнем регистре.
Сортировка в алфавитном порядке
Казалось бы, сортировки массива по алфавиту должна быть простейшей задачей:
Тем не менее мы сталкиваемся с проблемой, как только один из элементов находится в верхнем регистре:
Это связано с тем, что, по умолчанию, сортировщик сравнивает первый символ представленный в Unicode. Unicode — это уникальный код для любого символа, независимо от платформы, независимо от программы, независимо от языка. Например, если смотреть по кодовой таблице символ «a» имеет значение U+0061 (в шестнадцатеричной системе 0x61), в то время как символ «C» имеет код U+0043 (0x43), который идет раньше в Unicode-таблице, чем символ «a».
Чтобы отсортировать массив, который может содержать смешанные регистры первых букв, нам необходимо либо преобразовать все элементы временно в нижний регистру, или определить свой порядок сортировки при помощи метода localeCompare() c некоторыми аргументами. Как правило, для такого случая, лучше сразу создать функцию для многократного использования:
Если вы хотите получить массив отсортированный в обратный алфавитном порядке, просто поменяйте позициями а и b в функции:
Тут стоит обратить внимание, что localeCompare используется с аргументами, еще надо помнить, что он поддерживается IE11+, для более старых версий IE, мы можем использовать его без аргументов, и в нижнем регистре:
Числовая сортировка
Все это не относится к тому примеру, о котором мы говорили выше про массив игровых рекордов. С некоторыми числовыми массивами сортировка работает просто идеально, но в какой-то момент результат может быть непредсказуемым:
Дело в том, что метод sort() производит лексикографическую сравнение: а это означает, что числа будут преобразованы в строку и сравнения будут снова проводиться путем сопоставления первого символа этой строки в порядке символов Unicode-таблицы. Поэтому нам снова необходимо определить свой порядок сортировки:
Опять же, для сортировки чисел в обратном порядке, поменяйте позициями a и b в функции.
Сортировка JSON-подобной структуры
И наконец, если у нас есть JSON-подобная структура данных, представленная как массив игровых рекордов:
В ES6+, вы можете использовать стрелочные функции:
Для старых браузеров, не имеющих такую поддержку:
Как видите, сортировка в JavaScript это довольно не очевидная вещь, я надеюсь, что эти примеры облегчат как-нибудь жизнь.
К прочтению:
Работа со степенными функциями
Возведение в степень — операция, первоначально определяемая как результат многократного умножения натурального числа на себя, квадратный корень из числа a — число, дающее a при возведении в квадрат. Этими функциями мы могли пользоваться постоянно в повседневной жизни на уроках математики, в том числе при вычислении площадей, объемов или даже при физическом моделировании.
В JavaScript степенная функция представлена как Math.pow(), в новом стандарте ES7 был представлен новый оператор возведения в степень — » * * «.
Возведение в степень
Для того, чтобы возвести число в n-ую степень, используйте функцию Math.pow(), где первый аргумент это число, которое будет возведено в степень, второй аргумент это показатель степени:
Такая форма записи означает 3 в квадрате, или 3 × 3, что приводит к результату 9. Можно привести еще пример, конечно:
То есть, 5 в кубе, или 5 × 5 × 5, равно 125.
ECMAScript 7 — это следующая версия JavaScript, в принципе, мы можем использовать новый предложенный оператор возведения в степень — * *, такая форма записи может быть более наглядной:
На данный момент поддержка этого оператора довольно ограниченная, поэтому его не рекомендуется использовать.
Степенная функция может пригодиться в самых разных ситуациях. Простой пример, вычисление количества секунд в часе: Math.pow (60,2).
Квадратный и кубический корень
Math.sqrt() и Math.cbrt() противоположны функции Math.pow(). Как мы помним, квадратный корень из числа a — число, дающее a при возведении в квадрат.
В тоже время кубический корень из числа a — число, дающее a при возведении в куб.
Math.cbrt() был введен в спецификацию JavaScript совсем недавно, и поэтому поддерживается только в современных браузерах: Chrome 38+, Firefox и Opera 25+ и Safari 7.1+. Вы заметите, что Internet Explorer отсутствует в этом списке, однако на MDN вы найдете полифилл.
Примеры
Конечно, мы можем использовать и не целые значения в одной из этих функций:
Обратите внимание, что это вполне себе работает и при использовании отрицательных значениях аргументов:
Тем не менее, для квадратного корня это не будет работать:
Из математического анализа мы знаем, что под мнимым числом понимают квадратные корни из отрицательных чисел. И это может привести нас к еще одной технике работы с комплексными числами, но это уже другая история.
Вы можете использовать дробные значения в Math.pow(), чтобы найти квадратные и кубические корни чисел. Квадратный корень использует показатель 0.5:
Однако, из-за капризов с плавающей точкой, вы не можете точно предположить правильный результат:
В таких ситуациях, вы вам придется прибегать к отсечению знаков у числа или округление до какого-либо значения.
Некоторые, по непонятным причинам в JavaScript путают функцию Math.pow() с Math.exp(), которая является экспоненциальной функцией для чисел, в целом. Примечание: в английском языке «показатель степени» переводится как «exponent», поэтому это скорее относится к англоговорящим, хотя существуют и альтернативные названия показателя степени, такие как index, power.
К прочтению:
Математические константы
Работа с математикой в JavaScript облегчается за счет ряда встроенных констант. Эти константы являются свойствами объекта Math. Стоит обратить внимание, что константы пишутся в верхнем регистре, а не CamelCase нотации.
Math.PI
Число Пи — математическая константа, равная отношению длины окружности к длине её диаметра. Старое название — лудольфово число. Пи — иррациональное число, то есть его значение не может быть точно выражено в виде дроби m/n, где m и n — целые числа. Следовательно, его десятичное представление никогда не заканчивается и не является периодическим. На бумаге популярно использовать его короткую форму записи — 3.14159.
Ваш браузер не может хранить бесконечное число, так что JavaScript округляет число Пи до такого значения 3,141592653589793, что более чем достаточно для большинства задач.
Хотя это число наиболее распространено в задачах на нахождении длин, площади окружности, число Пи также используется в вероятности, статистики, инженерных и естественных науках: это как универсальная константа.
Math.SQRT2
Квадратный корень из числа 2 — положительное вещественное число, которое при умножении само на себя даёт число 2. Геометрически корень из 2 можно представить как длину диагонали квадрата со стороной 1 (это следует из теоремы Пифагора). Это было первое известное в истории математики иррациональное число. JavaScript округляет это число до такого значения 1.4142135623730951. (Из-за ошибок округления в JavaScript: Math.SQRT2 * Math.SQRT2 не равно 2).
Math.SQRT1_2
Квадратный корень из 0.5 — это единица, деленная на корень квадратный из 2. И опять же, это иррациональное число.
Простейшими преобразованиями на бумаге мы можем записать это так:
Но из-за проблем с плавающей точкой, мы можем получить такой результат:
Math.E
Как ни странно, в математике константа е всегда записывалась в нижнем регистре, в JavaScript же это число используют в верхнем регистре. Число e — основание натурального логарифма, математическая константа, иррациональное и трансцендентное число. Иногда число e называют числом Эйлера или числом Непера. JavaScript округляет его как 2,718281828459045. Число e играет важную роль в дифференциальном и интегральном исчислении, а также во многих других разделах математики.
Натуральный логарифм
Натуральный логарифм — это логарифм по основанию e, где e — иррациональная константа, равная приблизительно 2,718281828. Натуральный логарифм числа x — это показатель степени, в которую нужно возвести число e, чтобы получить x. Math.log(х) — это натуральный из x по основанию e.
Если вам нужно получить логарифм из y по основанию x:
Однако, из-за особенностей округления чисел с плавающей точкой, ответ получается не всегда точный и только близок к правильному значению:
Math.LN2
Свойство Math.LN2 представляет натуральный логарифм из 2 равный 0.6931471805599453.
Math.LN10
Свойство Math.LN10 представляет натуральный логарифм из 10 равный 2.302585092994046
Math.LOG2E
Свойство Math.LOG2E представляет двоичный логарифм из e равный 1.4426950408889634
Math.LOG10E
Свойство Math.LOG10E представляет десятичный логарифм из e равный 0.4342944819032518
К прочтению:
Math.abs, parseInt, parseFloat
Работа с числами в JavaScript может быть куда более сложной, чем кажется. Полученные значения не всегда попадают внутрь ожидаемых диапазонов, иногда результат может оказаться вовсе не тем, что мы ожидали.
Math.abs()
Метод Math.abs() возвращает абсолютное значение числа, что напоминает нам аналогичную математическую функцию модуля числа a.
parseInt()
Мы знаем, что JavaScript понимает, что «15» это строка, а не число и, например, при разборе CSS-свойств средствами JavaScript, или получив какое-либо значение из неподготовленного массива, наши результаты могут получиться непредсказуемыми. Мы могли получить на вход строку представленную как «17px», и для нас это не является редкостью. Вопрос заключается в том, как преобразовать эту строку в фактическое значение и использовать его в дальнейших расчетах.
Синтаксис: parseInt(string, radix);
Функция parseInt преобразует первый переданный ей аргумент в строковый тип, интерпретирует его и возвращает целое число или значение NaN. Результат (если не NaN) является целым числом и представляет собой первый аргумент (string), рассматривающийся как число в указанной системе счисления (radix). Например, основание 10 указывает на преобразование из десятичного числа, 8 — восьмеричного, 16 — шестнадцатеричного и так далее. Если основание больше 10, то для обозначения цифр больше 9 используются буквы. Например, для шестнадцатеричных чисел (основание 16) используются буквы от A до F.
Рассмотрим пример работы с CSS-свойствами, где, условно говоря, мы можем получить такое значение:
Мы можем разделить значения по пробелам:
Однако, каждый элемент все еще есть строка, мы можем избавиться от этого применив нашу функцию:
Как видите, вторым аргументом мы указываем систему счисления, в которую будет преобразовано число, этот параметр необязательный, но его рекомендуется использовать, в случае, если вы не знаете какая строка поступит на вход.
parseFloat()
Из примера выше, вы наверное заметили, что parseInt отбрасывает дробную часть. В нашем случае, parseFloat умеет работать с числами с плавающей точкой. Опять же, это может быть полезным при разборе CSS и других задачах, особенно при работе с плавающей точкой в процентах.
Обратите внимание, что в синтаксисе parseFloat нет второго аргумента.
Мы понимаем, что parseInt() и parseFloat() являются чрезвычайно полезными функциями, важно учитывать, что и тут не обойтись без ошибок, поэтому необходимо проверять диапазон ожидаемых значений и в конечном счете анализировать результат, чтобы гарантировать, что полученные значения верны.