Javascript округление до десятков. Объект Math в javascript - Методы round, ceil и floor - Округление дробных чисел. Усечение десятичных чисел
Часто результатом расчётов бывает число с большим количеством знаков после запятой. Если это число будет использовано для дальнейших расчётов, то его можно оставить в таком виде. Но иногда требуется округление числа, например для вывода на страницу. В JavaScript округление чисел осуществляется несколькими методами.
Метод Math.round() округляет значение до целого числа.
Math.round (число)
Округление числа производится по математическим правилам. То есть, если после запятой идёт цифра от 0 до 4, то дробная часть просто отбрасывается. А если после запятой идёт цифра от 5 до 9, то дробрая часть отбрасывается, а к целой части прибавляется единица. пример:
JavaScript:
Есть ещё два метода, которые округляют число до целого значения. Метод Math.floor() округляет в меньшую сторону. Он отбрасывает дробную часть числа. А метод Math.ceil() округляет в большую сторону. Он отбрасывает дробную часть, а к целой части прибавляет единицу. Пример:
Конечно, 5 - (-2) это 5+2. Не завбывайте, что число 5 Вы в этой формуле не получите. Максимальное будет 4.999999999. Полученные значения можно округлить до нужной точности.
Если нужны только целые числа, то полученные значения можно округлять до целого в меньшую сторону. К максимуму нужно прибавить единицу, чтобы этот максимум тоже был возможен. Формула получается такая:
целое число = Math.floor (минимум + Math.random() * (максимум + 1 - минимум)
Выведем числа от 10 до 15:
20 |
for (i=1; i 0.020000000000000004
0.3 - 0.1
> 0.19999999999999998
Для практических целей эта неточность не имеет никакого значения, в нашем случае мы говорим об ошибке в квинтиллионных долях, однако, кого-то это может разочаровать. Мы можем получить несколько странный результат и при работе с числами, которые представляют собой значения валют, процентов или размеров файла. Для того, чтобы исправить эти неточности, нам как раз и необходимо уметь округлять результаты, при этом достаточно установить десятичную точность. Округление чисел имеет практическое применение, мы можем манипулировать числом в некотором диапазоне, например, хотим округлить значение до ближайшего целого числа, а не работать только с десятичной частью. Округление десятичных чисел Для того, чтобы отсечь десятичное число, используйте toFixed или метод toPrecision . Оба они принимают единственный аргумент, который определяет, соответственно, сколько значащих цифр (т.е. общее количество цифр, используемых в числе) или знаков после запятой (количество после десятичной точки) должен включать в себя результат:Оба метода toFixed() и toPrecision() возвращают строковое представление результата, а не число. Это означает, что при суммировании округленного значения с randNum будет произведена конкатенация строк, а не сумма чисел: Let randNum = 6.25;
let rounded = randNum.toFixed(); // "6"
console.log(randNum + rounded);
> "6.256"
Let randNum = 6.25;
let rounded = parseFloat(randNum.toFixed(1));
console.log(rounded);
> 6.3
Методы toFixed() и toPrecision() являются полезными, ибо они могут не только отсекать дробную часть, но и дополнять знаки после запятой, что удобно при работе с валютой: Let wholeNum = 1
let dollarsCents = wholeNum.toFixed(2);
console.log(dollarsCents);
> "1.00"
Let num = 123.435 num.toPrecision(2); > "1.2e+2" Как избежать ошибок округления с десятичными числами В некоторых случаях, toFixed и toPrecision округляет значение 5 в меньшую сторону, а в большую:Let numTest = 1.005;
numTest.toFixed(2);
> "1.00"
Function round(value, decimals) {
return Number(Math.round(value+"e"+decimals)+"e-"+decimals);
}
Round(1.005,2);
> 1.01
0.1 + 0.2 === 0.3
> false
Function epsEqu(x, y) {
return Math.abs(x - y) < Number.EPSILON * Math.max(Math.abs(x), Math.abs(y));
}
EpsEqu(0.1 + 0.2, 0.3)
> true
Function truncated(num) {
return Math.trunc(num * 100) / 100;
}
truncated(3.1416)
> 3.14
Function truncated(num, decimalPlaces) {
let numPowerConverter = Math.pow(10, decimalPlaces);
return ~~(num * numPowerConverter)/numPowerConverter;
}
Let randInt = 35.874993; truncated(randInt,3); > 35.874 Округление до ближайшего числа Для того, чтобы округлить десятичное число до ближайшего числа в большую или в меньшую сторону, в зависимости от того, к чему мы ближе всего, используйте Math.round():Math.round(4.3)
> 4
Math.round(4.5)
> 5
Math.floor(42.23);
> 42
Math.floor(36.93);
> 36
Math.floor(-2.5);
> -3
Math.trunc(-41.43);
> -41
Math.ceil(42.23); > 43 Math.ceil(36.93); > 37 Math.ceil(-36.93); > -36 Округление до большего/меньшего необходимого числа Если мы хотим, чтобы округлить до ближайшего числа, кратного 5, самый простой способ создать функцию, которая делит число на 5, округляет его, а затем умножает его на ту же сумму:Function roundTo5(num) {
return Math.round(num/5)*5;
}
RoundTo5(11);
> 10
Function roundToMultiple(num, multiple) {
return Math.round(num/multiple)*multiple;
}
Let initialNumber = 11; let multiple = 10; roundToMultiple(initialNumber, multiple); > 10; Фиксирование числа в диапазоне Есть много случаев, когда мы хотим получить значение х, лежащее в пределах диапазона. Например, нам может понадобиться значение от 1 до 100, но при этом мы получили значение 123. Для того, чтобы исправить это, мы можем использовать минимальное (возвращает наименьшее из набора чисел) и максимальное (возвращает наибольшее из любого множества чисел). В нашем примере, диапазон от 1 до 100:Let lowBound = 1;
let highBound = 100;
let numInput = 123;
let clamped = Math.max(lowBound, Math.min(numInput, highBound));
console.log(clamped);
> 100;
Number.prototype.clamp = function(min, max) {
return Math.min(Math.max(this, min), max);
};
NumInput.clamp(lowBound, highBound); > 100; Гауссово округление Гауссово округление, также известное как банковское округлением, заключается в том, что округление для этого случая происходит к ближайшему чётному. Этот метод округления работает без статистической погрешности. Лучшее решение было предложено Tim Down :Function gaussRound(num, decimalPlaces) {
let d = decimalPlaces || 0,
m = Math.pow(10, d),
n = +(d ? num * m: num).toFixed(8),
i = Math.floor(n), f = n - i,
e = 1e-8,
r = (f > 0.5 - e && f < 0.5 + e) ?
((i % 2 == 0) ? i: i + 1) : Math.round(n);
return d ? r / m: r;
}
GaussRound(2.5)
> 2
gaussRound(3.5)
> 4
gaussRound(2.57,1)
> 2.6
Так как JavaScript часто используется для создания позиционного преобразования HTML-элементов, вы можете задаться вопросом, что произойдет, если мы cгенерируем десятичные значения для наших элементов: #box { width: 63.667731993px; }
Let fruit = ["butternut squash", "apricot", "cantaloupe"];
fruit.sort();
> "apricot", "butternut squash", "cantaloupe"]
Let fruit = ["butternut squash", "apricot", "Cantalope"];
fruit.sort();
> "Cantaloupe", "apricot", "butternut squash"]
Чтобы отсортировать массив, который может содержать смешанные регистры первых букв, нам необходимо либо преобразовать все элементы временно в нижний регистру, или определить свой порядок сортировки при помощи метода localeCompare() c некоторыми аргументами. Как правило, для такого случая, лучше сразу создать функцию для многократного использования: Function alphaSort(arr) {
arr.sort(function (a, b) {
return a.localeCompare(b, "en", {"sensitivity": "base"});
});
}
let fruit = ["butternut squash", "apricot", "Cantaloupe"];
alphaSort(fruit)
> Function alphaSort(arr) {
arr.sort(function (a, b) {
return b.localeCompare(a, "en", {"sensitivity": "base"});
});
}
let fruit = ["butternut squash", "apricot", "Cantaloupe"];
alphaSort(fruit)
> ["Cantaloupe", "butternut squash", "apricot"]
Function caseSort(arr) { arr.sort(function (a, b) { return a.toLowerCase().localeCompare(b.toLowerCase()); }); } let fruit = ["butternut squash", "apricot", "Cantaloupe"]; caseSort(fruit) > ["apricot", "butternut squash", "Cantaloupe"] Числовая сортировка Все это не относится к тому примеру, о котором мы говорили выше про массив игровых рекордов. С некоторыми числовыми массивами сортировка работает просто идеально, но в какой-то момент результат может быть непредсказуемым:Let highScores = ;
highScores.sort();
>
Let highScores = ;
highScores.sort(function(a,b) { return a - b; });
>
Let scores = [
{
"name": "Daniel",
"score": 21768
},
{
"name": "Michael",
"score": 33579
},
{
"name": "Alison",
"score": 38395
}
];
Scores.sort((a, b) => b.score - a.score));
Scores.sort(function(a, b) { return a.score - b.score });
В JavaScript степенная функция представлена как Math.pow(), в новом стандарте ES7 был представлен новый оператор возведения в степень - " * * ". Возведение в степень Для того, чтобы возвести число в n-ую степень, используйте функцию Math.pow(), где первый аргумент это число, которое будет возведено в степень, второй аргумент это показатель степени:Math.pow(3,2)
> 9
Math.pow(5,3);
> 125
ECMAScript 7 - это следующая версия JavaScript, в принципе, мы можем использовать новый предложенный оператор возведения в степень - * *, такая форма записи может быть более наглядной: 3 ** 2
> 9
Степенная функция может пригодиться в самых разных ситуациях. Простой пример, вычисление количества секунд в часе: Math.pow (60,2). Квадратный и кубический корень Math.sqrt() и Math.cbrt() противоположны функции Math.pow(). Как мы помним, квадратный корень из числа a - число, дающее a при возведении в квадрат.Math.sqrt(9)
> 3
Math.cbrt(125)
> 5
Math.pow(1.25, 2);
> 1.5625
Math.cbrt(56.57)
> 3.8387991760286138
Math.pow(-5,2)
> 25
Math.pow(10,-2)
> 0.01
Math.sqrt(-9)
> NaN
Вы можете использовать дробные значения в Math.pow(), чтобы найти квадратные и кубические корни чисел. Квадратный корень использует показатель 0.5: Math.pow(5, 0.5); // = Math.sqrt(5) = 5 ** (1/2)
> 2.23606797749979
Math.pow(2.23606797749979,2)
> 5.000000000000001
Некоторые, по непонятным причинам в JavaScript путают функцию Math.pow() с Math.exp() , которая является экспоненциальной функцией для чисел, в целом. Примечание: в английском языке «показатель степени» переводится как «exponent», поэтому это скорее относится к англоговорящим, хотя существуют и альтернативные названия показателя степени , такие как index, power. Математические константы Работа с математикой в JavaScript облегчается за счет ряда встроенных констант. Эти константы являются свойствами объекта Math. Стоит обратить внимание, что константы пишутся в верхнем регистре, а не CamelCase нотации. Math.abs, parseInt, parseFloat Работа с числами в JavaScript может быть куда более сложной, чем кажется. Полученные значения не всегда попадают внутрь ожидаемых диапазонов, иногда результат может оказаться вовсе не тем, что мы ожидали. Math.abs() Метод Math.abs() возвращает абсолютное значение числа, что напоминает нам аналогичную математическую функцию модуля числа a .Let newVal = -57.64;
Math.abs(newVal);
> 57.64
Math.abs(0); > -0 parseInt() Мы знаем, что JavaScript понимает, что «15» это строка, а не число и, например, при разборе CSS-свойств средствами JavaScript, или получив какое-либо значение из неподготовленного массива, наши результаты могут получиться непредсказуемыми. Мы могли получить на вход строку представленную как «17px», и для нас это не является редкостью. Вопрос заключается в том, как преобразовать эту строку в фактическое значение и использовать его в дальнейших расчетах.Синтаксис: parseInt(string, radix); Функция parseInt преобразует первый переданный ей аргумент в строковый тип, интерпретирует его и возвращает целое число или значение NaN. Результат (если не NaN) является целым числом и представляет собой первый аргумент (string), рассматривающийся как число в указанной системе счисления (radix). Например, основание 10 указывает на преобразование из десятичного числа, 8 - восьмеричного, 16 - шестнадцатеричного и так далее. Если основание больше 10, то для обозначения цифр больше 9 используются буквы. Например, для шестнадцатеричных чисел (основание 16) используются буквы от A до F. Рассмотрим пример работы с CSS-свойствами, где, условно говоря, мы можем получить такое значение: Let elem = document.body;
let centerPoint = window.getComputedStyle(elem).transformOrigin;
> "454px 2087.19px"
Let centers = centerPoint.split(" ");
> ["454px", "2087.19px"]
Let centerX = parseInt(centers, 10);
> 454
let centerY = parseInt(centers, 10);
> 2087
Синтаксис: parseFloat(string) Let FP = "33.33333%";
console.log(parseFloat(FP));
> 33.33333
Мы понимаем, что parseInt() и parseFloat() являются чрезвычайно полезными функциями, важно учитывать, что и тут не обойтись без ошибок, поэтому необходимо проверять диапазон ожидаемых значений и в конечном счете анализировать результат, чтобы гарантировать, что полученные значения верны. В этой статье подробно рассмотрим числа, математические операторы, способы преобразования числа в строку и наоборот, а также много других важных моментов. Функция isFiniteФункция isFinite позволяет проверить, является ли аргумент конечным числом. В качестве ответа данная функция возвращает false , если аргумент является Infinity , -Infinity , NaN или будет быть приведён к одному из этих специальных числовых значений. В противном случае данная функция вернёт значение true . IsFinite(73); // true isFinite(-1/0); // false isFinite(Infinity); // false isFinite(NaN); // false isFinite("Текст"); // false Кроме глобальной функции isFinite в JavaScript имеется ещё метод Number.isFinite . Он в отличие от isFinite не осуществляет принудительное приведения аргумента к числу. IsFinite("73"); // true Number.isFinite("73"); // false Функция isNaNФункция isNaN предназначена для определения того, является ли аргумент числом или может ли быть преобразован к нему. Если это так, то функция isNaN возвращает false. В противном случае она возвращает true. IsNaN(NaN); //true isNaN("25px"); //true, т.к. 20px - это не число isNaN(25.5); //false isNaN("25.5"); //false isNaN(" "); //false, т.к. пробел или неcколько пробелов преобразуется к 0 isNaN(null); //false, т.к. значение null преобразуется к 0 isNaN(true); //false, т.к. значение true преобразуется к 1 isNaN(false); //false, т.к. значение false преобразуется к 0 Если это действие нужно выполнить без приведения типа, то используйте метод Number.isNaN . Данный метод был введён в язык, начиная с ECMAScript 6. Как явно преобразовать строку в число?Явно привести строку в число можно посредством следующих способов: 1. Использовать унарный оператор + , который необходимо поместить перед значением. +"7.35"; // 7.35 +"текст"; // NaN Этот способ пренебрегает пробелами в начале и конце строки, а также \n (переводом строки). +" 7.35 "; //7.35 +"7.35 \n "; //7.35 Используя данный способ необходимо обратить внимание на то, что пустая строка или строка, состоящая из пробелов и \n , переводится в число 0. Кроме этого она также преобразует тип данных null и логические значения к числу. Null; //0 +true; //1 +false; //0 +" "; //0 2. Функция parseInt . Данная функция предназначена для преобразования аргумента в целое число . В отличие от использования унарного оператора + , данный метод позволяет преобразовать строку в число, в которой не все символы являются цифровыми . Начинает она преобразовывать строку, начиная с первого символа. И как только она встречает символ, не являющийся цифровым, данная функция останавливает свою работу и возвращает полученное число. ParseInt("18px"); //18 parseInt("33.3%"); //33 Данная функция может работать с разными системами счисления (двоичной, восьмеричной, десятичной, шестнадцатеричной). Указание основание системы счисления осуществляется посредством 2 аргумента. ParseInt("18px", 10); //18 parseInt("33.3%", 10); //33 parseInt("101",2); //5 parseInt("B5",16); //181 Кроме функции parseInt в JavaScript имеется метод Number.parseInt . Данный метод ничем не отличается от функции parseInt и был введён в JavaScript со спецификацией ECMASCRIPT 2015 (6). 3. Функция parseFloat . Функция parseFloat аналогична parseInt , за исключением того что позволяет выполнить преобразование аргумента в дробное число. ParseFloat("33.3%"); //33.3 Кроме этого функция parseFloat в отличие от parseInt не имеет 2 аргумента, и следовательно она всегда пытается рассмотреть строку как число в десятичной системе счисления. ParseFloat("3.14"); parseFloat("314e-2"); parseFloat("0.0314E+2"); Кроме функции parseFloat в JavaScript имеется метод Number.parseFloat . Данный метод ничем не отличается от функции parseFloat и был введён в JavaScript со спецификацией ECMASCRIPT 2015 (6). Преобразование числа в строкуПревратить число в строку можно с помощью метода toString . (12.8).toString(); //"12.8" Метод toString позволяет также указать основание системы счисления с учётом которой необходимо явно привести число к строке: (255).toString(16); //"ff" Как проверить является ли переменная числомОпределить является ли значение переменной числом можно используя один из следующих способов: 1. С использованием функций isNaN и isFinite: // myVar - переменная if (!isNaN(parseFloat(myVar)) && isFinite(parseFloat(myVar))) { //myVar - это число или может быть приведено к нему }; В виде функции: // функция function isNumeric(value) { return !isNaN(parseFloat(value)) && isFinite(parseFloat(value)); } // использование var myVar = "12px"; console.log(isNumeric(myVar)); //true Этот способ позволяет определить является ли указанное значение числом или может быть приведено к нему. Данный вариант не считает числом пустую строку, строку из пробелов, значение null , Infinity , -Infinity , true и false . 2. С использованием оператора typeof и функций isFinite, isNaN: // функция которая проверяет является ли значение числом function isNumber(value) { return typeof value === "number" && isFinite(value) && !isNaN(value); }; // использование функции isNumber isNumber(18); //true // использование функций для проверки текстовых значений isNumber(parseFloat("")); //false isNumber(parseFloat("Infinity")); //false isNumber(parseFloat("12px")); //true Эта функция определяет имеет ли указанное значение тип Number, а также не принадлежит ли оно к одному из специальных значений Infinity, -Infinity и NaN. Эсли это так, то данная функция возвращает значение true. 3. С помощью метода ECMAScript 6 Number.isInteger(value) . Данный метод позволяет определить, является ли указанное значение целым числом. Number.isInteger("20"); //false, т.к. данный метод не выполняет перевод строки в число Number.isInteger(20); //true, т.к. данное значение является числом Чётные и нечётные числаПроверить является ли число чётным или нечётным можно посредством следующих функций: // Функция для проверки числа на чётность function isEven(n) { return n % 2 == 0; } // Функция для проверки числа на нечётность function isOdd(n) { return Math.abs(n % 2) == 1; } Но перед тем как проводить такую проверку желательно убедиться что указанное значение является числом: Value = 20; if (Number.isInteger(value)) { if (isEven(value)) { console.log("Число " + value.toString() + " - чётное"); } } Простые числа в JavascriptРассмотрим пример в котором выведем с помощью Javascript простые числа от 2 до 100. // Функция, которая проверяет является ли число простым function isPrime(value) { if (isNaN(value) || !isFinite(value) || value%1 || value < 2) return false; var max=Math.floor(Math.sqrt(value)); for (var i = 2; i< = max; i++) { if (value%i==0) { return false; } } return true; } // создать массив, который будет содержать простые числа от 2 до 100 var primaryNumber = ; for (var i = 2; i (больше), < (меньше), >= (больше или равно), 3); //false console.log(5>=3); //true При сравнении чисел с дробной частью необходимо учитывать погрешности, которые могут возникать во время этих вычислений. Например, в JavaScript сумма чисел (0.2 + 0.4) не равна 0.6: Console.log((0.2+0.4)==0.6); //false Погрешности происходят потому что все вычисления компьютер или другое электронное устройство производит в 2 системе счисления. Т.е. перед тем как выполнить какие-то действия компьютер сначала должен преобразовать представленные в выражении числа в 2 систему счисления. Но, не любое дробное десятичное число можно представить в 2 системе счисления точно. Например, число 0.25 10 в двоичную систему преобразуется точно. 0.125 × 2 = 0.25 | 0 0.25 × 2 = 0.5 | 0 0.5 × 2 = 1 | 1 0.125 10 = 0.001 2 Например, число 0.2 10 можно преобразовать в 2 систему только с определённой точностью: 0.2 × 2 = 0.4 | 0 0.4 × 2 = 0.8 | 0 0.8 × 2 = 1.6 | 1 0.6 × 2 = 1.2 | 1 0.2 × 2 = 0.4 | 0 0.4 × 2 = 0.8 | 0 0.8 × 2 = 1.6 | 1 0.6 × 2 = 1.2 | 1 0.2 × 2 = 0.4 | 0 0.4 × 2 = 0.8 | 0 0.8 × 2 = 1.6 | 1 0.6 × 2 = 1.2 | 1 ... 0.2 10 = 0.001100110011... 2 В результате эти погрешности скажутся при вычисления суммы двух чисел и результатах сравнения. Т.е. получится что на самом деле JavaScript будет видет эту запись следующим образом: 0.6000000000000001==0.6 При вычислениях или отображении чисел с дробной частью необходимо всегда указывать точность, с которой это необходимо делать. Например, сравнить числа до 2 знаков после запятой используя методы toFixed() и toPrecision() : //метод toFixed() console.log((0.2+0.4).toFixed(2)==(0.6).toFixed(2)); //true //метод toPrecision() console.log((0.2+0.4).toPrecision(2)==(0.6).toPrecision(2)); //true Основные математические операцииВ JavaScript существуют следующие математические операторы: + (сложение), - (вычитание), * (умножение), / (деление), % (остаток от деления), ++ (увелить значение на 1), -- (уменьшить значение на 1). 6+3 //9 6-3 //3 6*3 //18 6/3 //2 6%3 //0, т.е. 6:3=2 => 6-3*2 => ост(0) 5%2 //1, т.е. 5:2=2(.5) => 5-2*2 => ост(1) 7.3%2 //1.3, т.е. 7.3:2=3(.65) => 7.3-2*3 => ост(1.3) //знак результата операции % равен знаку первого значения -9%2.5 //-1.5, т.е. 9:2.5=3(.6) => 9-2.5*3 => ост(1.5) -9%-2.5 //-1.5, т.е. 9:2.5=3(.6) => 9-2.5*3 => ост(1.5) -2%5 //-2, т.е. 2:5=0(.4) => 2-5*0 => ост(2) x = 3; console.log(x++); //выводит 3, у уже потом устанавливает 4 console.log(x); //4 x = 3; console.log(++x); //устанавливает 4 и выводит x = 5; console.log(x--); //выводит 5, у уже потом устанавливает 4 console.log(x); //4 x = 5; console.log(--x); //устанавливает 4 и выводит Кроме этого в JavaScript есть комбинированные операторы: x+=y (x=x+y), x-=y (x=x-y), x*=y (x=x*y), x/=y (x=x/y), x%=y (x=x%y). x = 3; y = 6; x+=y; console.log(x); //9 x = 3; y = 6; x-=y; console.log(x); //-3 x = 3; y = 6; x*=y; console.log(x); //18 x = 3; y = 6; x/=y; console.log(x); //0.5 x = 3; y = 6; x%=y; console.log(x); //3 |