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

参数

参数 描述
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 ]