JS

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) { /* ... */ })

参数

参数描述
compareFnOptional.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.
aThe first element for comparison.
bThe 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 ]