JS的一些值得注意的地方

前言

总结的一些js的自带函数的值得注意的点。

已更新:parseInt,sort

[toc]

parseInt

语法

1
parseInt(string, radix)

参数

参数 描述
string 必需。要被解析的字符串。
radix 可选。不传默认为0,表示要解析的数字的基数。该值介于 2 ~ 36 之间。

使用

一般情况

1
2
3
4
5
6
7
8
9
10
console.log(parseInt('5'))        // 5
console.log(parseInt('-5')) // -5
console.log(parseInt('2022年')) // 2022

console.log(parseInt(0.1)) // 0
console.log(parseInt(0.01)) // 0
console.log(parseInt(0.001)) // 0
console.log(parseInt(0.0001)) // 0
console.log(parseInt(0.00001)) // 0
console.log(parseInt(0.000001)) // 0

特殊情况

1
console.log(parseInt(0.0000001))  // 1

问题

parseInt()float 数据 0.0000001 解析为 1

原因

第一个参数默认字符串,如果不是字符串可能在处理时会进行转换。

比如

1
2
3
4
5
6
7
8
console.log(String(0.1))        // '0'
console.log(String(0.01)) // '0'
console.log(String(0.001)) // '0'
console.log(String(0.0001)) // '0'
console.log(String(0.00001)) // '0'
console.log(String(0.000001)) // '0'

console.log(String(0.0000001)) // '1e-7'

字符串 '1e-7'parseInt()会解析为1(在非chrome浏览器中可能无输出)

1
console.log(parseInt('1e-7'))  // 1

当遇到极大/小的数,Js会自动转成指数形式

1
2
3
4
5
6
7
8
console.log(0.0000001)        // 1e-7

console.log(parseInt(1e-7)) // 1

console.log(parseInt('1e-7')) // 1

console.log(parseInt(9999999999999999)) // 10000000000000000
console.log(parseInt(999999999999999999999)) // 1

总结

parseInt()总是将其第一个参数转换为字符串,所以小于10^-6的浮点数将以指数形式表示法编写。然后parseInt()从float的指数表示法中提取整数

解决方案

如果是小于10^-6的浮点数,可以使用Math.floor()函数来处理

1
2
3
4
5
6
7
8
9
10
console.log(Math.floor(0.1))        // 0
console.log(Math.floor(0.01)) // 0
console.log(Math.floor(0.001)) // 0
console.log(Math.floor(0.0001)) // 0
console.log(Math.floor(0.00001)) // 0
console.log(Math.floor(0.000001)) // 0

// 1e-7
console.log(Math.floor(0.0000001)) // 0

sort

语法

1
2
3
4
5
6
7
8
9
10
11
// Functionless
sort()

// Arrow function
sort((a, b) => { /* ... */ } )

// Compare function
sort(compareFn)

// Inline compare function
sort(function compareFn(a, b) { /* ... */ })

参数

参数 描述
compareFn Optional.Specifies a function that defines the sort order. If omitted, the array elements are converted to strings, then sorted according to each character’s Unicode code point value.
a The first element for comparison.
b The second element for comparison.
1
2
3
a 小于 b,在排序后的数组中 a 应该出现在 b 之前,则返回一个小于 0 的值。
a 等于 b,则返回 0
a 大于 b,则返回一个大于 0 的值。

问题

1
2
3
['Xiaomi', 'apple', 'Oppo'].sort(); // ['Oppo', 'Xiaomi", 'apple']

[10, 22, 1, 8, 2].sort(); // [1, 10, 2, 22, 8]

原因

sort()方法是根据字符串ASCII码进行排序,所谓的ASCII码也就是我们常说的unicode编码。而同一个英文字母,大写小写是有区别的,小写字母的ASCII码是排在大写字母的后边。

在unicode码比较大小时,是从前到后逐位进行比较(先是比较数组中所有元素的第一位,接着是第二位,第三位…)。

处理数组时,其实是对数组中的所有元素做了隐式转换,将number类型转换为string类型,然后进行针对上述字符串的排序。

解决方案

针对字母

  • 对所有元素的大小写做了统一大小写处理
1
2
3
4
5
6
7
8
9
10
11
12
var arr = ['Xiaomi', 'apple', 'Oppo'];
arr.sort(function (s1, s2) {
x1 = s1.toUpperCase();
x2 = s2.toUpperCase();
if (x1 < x2) {
return -1;
}
if (x1 > x2) {
return 1;
}
return 0;
}); // ['apple', 'Oppo', 'Xiaomi']

针对数字

1
2
3
4
5
var arr = [10, 22, 1, 8, 2];
arr.sort(function(a,b){
return a-b
});
console.log(arr);// [ 1, 2, 8, 10, 22 ]