JS数组扁平化、去重与排序操作深度解析

"这篇文章主要讲解了JavaScript中对数组进行扁平化、去重和排序的操作。作者通过实例代码解析了各种方法的实现原理和注意事项，旨在帮助读者掌握这些技巧。" 在JavaScript中，处理嵌套数组时，我们经常会遇到数组扁平化的需求，即把一个多维数组转换为一维数组。接着，去重是为了确保数组中的元素不重复，而排序则是按照特定规则调整数组元素顺序。以下是四种常见的JavaScript数组扁平化、去重和排序的方法： 1. 数组扁平化 - 方法一（toString）：通过将数组转换为字符串，然后利用split()方法分解为数组。但这种方法不适用于包含空数组的情况，且结果中的元素将是字符串而非原始类型。 ```javascript var newArr = arr.toString().split(',') ``` - 方法二（正则表达式）：将数组转换为JSON字符串，然后使用正则表达式去除嵌套的方括号，最后再解析回数组。 ```javascript var newArr1 = JSON.parse("[" + JSON.stringify(arr).replace(/(\[\]\,)|[\[\]]*/g, "") + "]") ``` - 方法三（reduce）：使用Array.prototype.reduce()函数，递归处理数组元素，将非数组元素添加到结果数组中。 ```javascript function flatten(arr) { return arr.reduce((a, b) => [].concat(Array.isArray(a) && a ? flatten(a) : a, Array.isArray(b) && b ? flatten(b) : b), []) } var newArr2 = flatten(arr) ``` - 方法四（遍历数组）：通过循环遍历数组，如果元素是数组，则递归调用自身，否则将元素添加到新数组。 ```javascript var newArr3 = [] function flat(arr) { for (var i = 0; i < arr.length; i++) { if (arr[i] instanceof Array) { flat(arr[i]) } else { newArr3.push(arr[i]) } } } flat(arr) ``` 2. 数组去重 - 可以使用ES6的Set数据结构，它不允许有重复的值。 ```javascript var uniqueArr = [...new Set(newArr)] // 先扁平化，后去重 ``` 或者使用双重for循环检查并移除重复元素。 ```javascript function unique(arr) { var res = []; for (var i = 0; i < arr.length; i++) { for (var j = i + 1; j < arr.length; j++) { if (arr[i] === arr[j]) { j = ++i; } } res.push(arr[i]); } return res; } var uniqueArr = unique(newArr) ``` 3. 数组排序 - 使用Array.prototype.sort()函数，传入比较函数来实现升序或降序排序。 ```javascript function sortArray(arr) { return arr.sort(function(a, b) { return a - b; }) // 升序 } var sortedArr = sortArray(uniqueArr) ``` 综合以上操作，对于题目中的例子，完整的解决方案可能是这样的： ```javascript var arr = [[1, 3, 2, 1], [5, 3, 4, 8, 5, 6, 5], [6, 2, 8, 9, [4, 11, 15, 8, 9, 12, [12, 13, [10], 14]]], 16]; var flatArr = flatten(arr); var uniqueArr = [...new Set(flatArr)]; var sortedArr = sortArray(uniqueArr); console.log(sortedArr); // 输出：[1, 2, 3, 4, 5, 6, 8, 9, 10, 11, 12, 13, 14, 15, 16] ``` 这些技巧在实际开发中非常实用，尤其是在处理复杂数据结构时，了解并熟练运用它们能提高代码的效率和可读性。