前言
Hello~大家好。我是秋天的一阵风
在项目开发过程中,我们经常会遇到需要对数字进行 取整处理 的情形,比如在计算统计数据、处理图表坐标或是实现某些算法逻辑时。对于JavaScript
开发者而言,Math.floor
和 parseInt
是两种常用的取整方法,它们虽然都能达到取整的目的,但在实际应用中却有着本质的区别,接下来我们就一起探讨这两个方法的不同之处!
一、Math.floor
1. 简单介绍
在MDN
中,明确解释了Math.floor
的作用:
Math.floor()
函数总是返回小于等于一个给定数字的最大整数。
例如,Math.floor(3.7)
返回 3
,Math.floor(-3.7)
返回 -4
。这个函数总是执行向下取整,即使对于负数也是向绝对值更大的方向取整。
另外,Math.floor
有且只有一个参数。
2. 实践案例
我们来看几个例子:
Math.floor(3.1); // 3
Math.floor(3.9); // 3
Math.floor(-3.1); // -4比-3小,向下取整,所以是 -4
Math.floor(-3.9); // -4比-3小,向下取整,所以是 -4
不管是正数还是负数,同学们只需要记得Math.floor
返回的值永远是比当前值要小,另外floor
的英语也有地板
的意思,floor
就可以记成向下取整。
二、Number.parseInt
1.简单介绍
-
parseInt()
函数解析一个字符串参数并返回一个指定基数的整数。它的行为不仅仅是对数字进行取整。 -
parseInt
相对于floor方法来说复杂一点,对于正数,向下取整。对于负数,向上取整。 -
例如,
parseInt("3.7")
返回3
,因为它将字符串转换为整数,忽略了小数点和后续数字。如果字符串以非数字开始,则返回NaN
(不是数字)。 -
parseInt()
还可以处理不同的数制(基数),如二进制、八进制、十六进制等,通过第二个参数指定。
2. 实践案例
Number.parseInt(3.1) // 3 正数,向下取整。比3.1小的是3
Number.parseInt(3.9) // 3 正数,向下取整。比3.9小的是3
Number.parseInt(-3.1) // -3 负数,向上取整。比-3.1大的是-3
Number.parseInt(-3.9) // -3 负数,向上取整。比-3.9大的是-3
3. 特殊用法
parseInt
会忽略数字后面的字符串,但如果第一个数字就是非数字,会返回NAN
Number.parseInt('123abc') // 123
Number.parseInt('abc123') //NAN
Number.parseInt('1ab12')) //1
parseInt
还有第二个参数:radix
-
radix
可选 -
2
到36
之间的整数,表示string
的基数(数学记数系统中的基)。如果
radix
为undefined
或0
,则radix
将被默认设置为10
,除非该数字以码元对0x
或0X
开头,在这种情况下,radix
将被默认设置为16
。
Number.parseInt(10,2) // 2 ,2的二进制就是10
Number.parseInt(11,2) // 3 ,3的二进制就是11
Number.parseInt(100,2) // 4, 4的二进制就是100
Number.parseInt('0xa',16) //10, 10的十六进制就是0xa
Number.parseInt('0xb',16) //11, 11的十六进制就是0x
4. 经典面试题
const arr = ["10", "10", "10", "10", "10"];
const result = arr.map(parseInt);
console.log(result);
对于这段代码,会输出什么呢?同学们可以先思考一下~
我们知道map
函数有两个参数,一个是数组项item
,一个是索引值index
。
上面的代码我们可以先转换为普通写法:
const result1 = arr.map((item, index) => {
return parseInt(item, index);
});
console.log(result1);
所以map
执行的顺序和传参就是下面这个顺序:
parseInt("10", 0);
parseInt("10", 1);
parseInt("10", 2);
parseInt("10", 3);
parseInt("10", 4);
我们先把上面第二个参数radix
的介绍复制下来,接着一个个来分析:
radix
可选。表示要解析的数字的基数。该值介于 2 ~ 36 之间。
如果省略该参数或其值为 0,则数字将以 10 为基础来解析。如果它以 “0x” 或 “0X” 开头,将以 16 为基数。
如果该参数小于 2 或者大于 36,则 parseInt() 将返回 NaN。
parseInt("10", 0); 0 就是默认值十进制, "10" 以十进制解析, 那就是10
parseInt("10", 1); 1 不在2 ~36区间, 返回NAN
parseInt("10", 2); 2 就是二进制 , "10" 以二进制解析, 那就是 2
parseInt("10", 3); 3 就是三进制 , "10" 以三进制解析, 那就是 3
parseInt("10", 4); 4 就是四进制 , "10" 以四进制解析, 那就是 4
所以打印的结果就是:
const arr = ["10", "10", "10", "10", "10"];
const result = arr.map(parseInt);
console.log(result);
// [10, NaN, 2, 3, 4]
三、总结
parseInt
parseInt
是一个全局函数,用于将字符串转换成整数。其主要特点包括:
-
功能:从给定的字符串开始解析数字,直到遇到非数字字符为止。
-
参数:
-
字符串:必需,要解析的字符串。
-
radix(基数):可选,默认为 10,表示要解析的数字的基数。该值范围为 2 到 36。
- 如果省略或为 0,且字符串以 "0x" 或 "0X" 开头,则基数为 16;否则基数为 10。
- 若基数不在 2 至 36 的范围内,
parseInt
返回NaN
。
-
-
返回值:返回字符串开头解析出的整数。若无法解析则返回
NaN
。
floor
Math.floor
是一个数学函数,用于向下取整到最接近的整数。
- 功能:返回小于或等于给定数值的最大整数。
- 参数:一个数值。
- 返回值:小于或等于该数值的最大整数。