在 JavaScript 中,对数值进行四舍五入操作的场景有以下几种:

  • 向上取整:ceil
  • 向下取整:floor
  • 四舍五入:round
  • 固定精度:toFixed
  • 固定长度:toPrecision
  • 取整:parseInt、位运算

本文将对这 6 个 API 进行简单的讲解和总结。

1、向上取整: ceil

ceil 是`天花板`的意思,表示在一个数值之上,且距离该数最近的整数。ceil 是 Math 对象的静态方法,需要传递一个参数,其调用方法如下:

Math.ceil(12.34); //13
Math.ceil(12.68); //13

2、向下取整: floor

floor 是`地板`的意思,表示在一个数值之下,且距离该数最近的整数。floor 是 Math 对象的静态方法,需要传递一个参数,其调用方法如下:

Math.floor(12.34); // 12
Math.floor(12.68); // 12

3、四舍五入: round

round 的作用是对一个浮点数进行四舍五入,并保留整数位。round 也是 Math 对象的静态方法,也需要传递一个参数,其调用方法如下:

Math.round(12.34); // 12
Math.round(12.54); // 13

4、固定精度: toFixed

toFixed 和上面三个方法不同,它是 Number 原型上实现的一个方法,其作用是对一个浮点数进行四舍五入并保留固定小数位。 toFixed 需要传递一个参数,其调用方式如下:

100.456001.toFixed(2); // 100.46
100.456001.toFixed(3); // 100.456

5、固定长度: toPrecision

toPrecison 也是 Number 原型上实现的一个处理浮点数的方法,和 toFixed 不同的是,它是对一个浮点数进行四舍五入并保留固定长度的有效数字,包括整数部分。

99.456001.toPrecision(5);  // 99.456
100.456001.toPrecision(5); // 100.46

6、取整: parseInt

parseInt 是 全局对象 window上的一个方法,其作用是对一个可转换的数值取整,分为以下两种情况:

1. 将字符串数值转化为 Number 整数,对字符串的每一个字符进行转化,直到遇到不可转化的字符(包括小数点)停止。

2. 对浮点类型数值取整,忽略小数部分,不做四舍五入处理

// 字符串数值
parseInt('100') ; // 100
parseInt('100axt'); // 100
parseInt('100xh20'); // 100
parseInt('100.78'); // 123
// Number 类型
parseInt(100.12) ; // 100
parseInt(100.78); // 100

7、取整: 位运算

  • | 0   : 和 0 进行 按位或 操作,原值不变
  • ~~   : 两次 按位非 操作得到的也是原值
  • >> 0 : 右移 0 位
  • << 0 : 左移 0 位
  • >>> 0: 无符号右移 0 位

这些位运算符在实现取整操作时,会表现出一些共同的特征:

  • 对于 Number 类型来说,直接应用位操作, 和 parseInt 得到的结果几乎一样;
  • 对于其他类型,内部会先通过 Number() 将其转换为一个数值,然后再应用位操作。
  • 对特殊 NaN 和 Infinity 值应用位操作时,这两个值都会被当成 0 来处理 。

对于 Number 类型,直接应用位运算。

~~ 100.12;  //  100
100.78 | 0; // 100
100.45 >> 0; // 100
100.50 << 0; // 100
100.96 >>> 0; // 100

对于其他类型,先使用 Number() 转换为数值类型,再进行位运算。

~~ '100.12'  // 100, Number('100.12') == 100.12
'100.50' >> 0; // 100,Number('100.50') == 100.50
'100.96' << 0; // 100,Number('100.96') == 100.96
~~ 'abc' // 0 , Number('abc') == NaN
'12abc' >> 0; // 0, Number('12abc') == NaN
undefined | 0 ; // 0, Number(undefined) == NaN
~~null; // 0 , Number(null) == 0
true >> 0; // 1 , Number(true) == 1
false >> 0; //0 , Number(false) == 0
[] << 0; // 0 , Number([]) == 0
~~NaN; // 0
Infinity >>> 0; // 0

位运算作用于最基本的层次上,即按内存中表示数值的位来操作数值。

位运算能取整的原因是:

ECMAScript 中的数值以64位双精度浮点数存储,但位运算只能作用于整数,因此要先将 64 位的浮点数转换成 32 位的整数,然后再进行位运算,最后再将计算结果转换成64位浮点数存储。

原创发布 @ 一像素  2018.06

JavaScript 中的四舍五入的更多相关文章

  1. JavaScript 中的数据类型

    Javascript中的数据类型有以下几种情况: 基本类型:string,number,boolean 特殊类型:undefined,null 引用类型:Object,Function,Date,Ar ...

  2. 了解 JavaScript 中的内置对象

    所有编程语言都具有内部(或内置的)对象来创建 语言的基本功能.内部对象是 您编写自定义代码所用语言的基础, 该代码基于您的想象实现自定义功能.JavaScript 有许多 将其定义为语言的内部对象.本 ...

  3. ExtJS学习-----------Ext.Number,ExtJS对javascript中的Number的扩展

    关于ExtJS对javascript中的Number的扩展,能够參考其帮助文档,文档下载地址:http://download.csdn.net/detail/z1137730824/7748893 以 ...

  4. 关于JavaScript中计算精度丢失的问题

    摘要: 由于计算机是用二进制来存储和处理数字,不能精确表示浮点数,而JavaScript中没有相应的封装类来处理浮点数运算,直接计算会导致运算精度丢失. 为了避免产生精度差异,把需要计算的数字升级(乘 ...

  5. JavaScript中的EcMAScript学习笔记

    一.Javascript概述(知道)    a.一种基于对象和事件驱动的脚本语言    b.作用: 给页面添加动态效果    c.历史: 原名叫做livescript.W3c组织开发的标准叫ECMAs ...

  6. JavaScript中的两个“0”(翻译)

    本文翻译自JavaScript’s two zeros JavaScript has two zeros: −0 and +0. This post explains why that is and ...

  7. Javascript中的函数数学运算

    1.Math函数与属性使用语法 Math.方法名(参数1,参数2,...); Math.属性; 说明 Math函数可以没有参数,比如Math.random()函数,或有多个参数,比如Math.max( ...

  8. JavaScript中的两个“0” -0和+0

    JavaScript中的两个“0”(翻译)   本文翻译自JavaScript’s two zeros JavaScript has two zeros: −0 and +0. This post e ...

  9. C#保留2位小数几种场景总结 游标遍历所有数据库循环执行修改数据库的sql命令 原生js轮盘抽奖实例分析(幸运大转盘抽奖) javascript中的typeof和类型判断

    C#保留2位小数几种场景总结   场景1: C#保留2位小数,.ToString("f2")确实可以,但是如果这个数字本来就小数点后面三位比如1.253,那么转化之后就会变成1.2 ...

随机推荐

  1. Get,Post请求方式经典详解

    本文转自:http://blog.csdn.net/findsafety/article/details/47129021 前几天工作中,所有表单我都采用post方法,头儿说那样不好,大型网站上一般都 ...

  2. Kali Linux中下载工具Axel的安装和使用

    前言: Axel是一个多线程的HTTP/FTP下载工具,支持断点续传. Axel的安装 apt-get install axel Axel的卸载 apt remove axel 安装完成之后输入 ax ...

  3. .NET Orm 性能测试

    .NET Orm 性能测试 简介 OrmBenchmark 这个项目主要是为了测试主要的Orm对于 SqlServer 数据库的查询并将数据转换成所需 POCO 对象的耗时情况(好吧,实际上不完全or ...

  4. npm install 遇到问题的解决

    在利用npm install 命令时,要以管理员权限运行CMD,然后进入到npm-modules目录,然后再执行install命令

  5. Python字符编码与转码

    字符编码与转码 注: 该图转自 http://www.cnblogs.com/luotianshuai/p/5735051.html. Python2 解码,编码 #Python2 #-*- codi ...

  6. Django中模板过滤器总结

    一.形式:小写: {{ name | lower }} 二.串联:先转义文本到HTML,再转换每行到 <p> 标签: {{ my_text|escape|linebreaks } 三.过滤 ...

  7. conn.go 源码阅读

    ),         Conn: conn,     }     return k, v } // 返回远程节点地址 func (self *Connect) Addr() string {      ...

  8. I/O-----字节输入流

    package io.day03; import java.io.FileInputStream; import java.io.InputStream; public class day03 { p ...

  9. 第十四章——循环神经网络(Recurrent Neural Networks)(第二部分)

    本章共两部分,这是第二部分: 第十四章--循环神经网络(Recurrent Neural Networks)(第一部分) 第十四章--循环神经网络(Recurrent Neural Networks) ...

  10. Robot Framework源码解析(2) - 执行测试的入口点

    我们再来看 src/robot/run.py 的工作原理.摘录部分代码: from robot.conf import RobotSettings from robot.model import Mo ...