本文介绍了JavaScript中五种不同的数组去重方法：基于对象属性的判断、双重循环splice、indexOf判断、ES6Set以及自定义比较。作者还提供了相应的代码示例和效果截图，寻求读者反馈和建议。
一、代码区域
<body>
<script>
// 1.利用对象key的唯一性，实现数组去重, 封装一个去重的函数
var arr = ['width', 'color', 'color', 'width', 'height', 100, 300, 100];
// console.log(arr);//['width', 'color', 'color', 'width', 'height', 100, 300, 100]
// 封装一个数组去重的函数
function quchong(array) {
// 新数组
var newArr = [];
// 空对象
var newObj = {};
// 循环数组
for (var i = 0; i < array.length; i++) {
// 判断对象是否存在这个属性
if (newObj[array[i]] == undefined) {
// 把首次出现的属性添加newArr这个数组中
newArr.push(array[i]);
// 赋值给对象的这个属性
newObj[array[i]] = 1;
}
}
// 循环结束，返回新数组
return newArr;
}
var result = quchong(arr);
console.log(result);//['width', 'color', 'height', 100, 300]
// 方案2：利用双重循环 splice：替换
// 用splice的特性，比较两个数是否相同，获得相同元素的下标，
// 删除相同元素，改变原数组，获得去重后的数组
function quchong01(array) {
for (var i = 0; i < array.length; i++) {
for (var j = i + 1; j < array.length; j++) {
if (array[i] == array[j]) {
array.splice(j, 1);
}
}
}
return arr;
}
var result01 = quchong01(arr);
console.log(result01);
// 方案3.利用indexof()判断数组中是否存在该数据
// 设置一个新的数据用来接收数据，利用indexOf 来判断数据是否存在于新数组中，
// 不存在，则添加进去，获得去重后的新数组
function quchong02(array) {
var newArr = [];
for (var i = 0; i < array.length; i++) {
if (newArr.indexOf(array[i]) < 0) {
newArr.push(array[i]);
}
}
return newArr;
}
var result02 = quchong02(arr);
console.log(result02);
// 方案4.ES6 Set（）方法:不允许存在重复数据，
// 但返回的是一个类数组，所以要用 Array.from()方法转换成数组
function quchong03(array) {
return Array.from(new Set(array));
}
var result03 = quchong03(arr);
console.log(result03);
// 方案5.定义一个新数组，将 arr 的第一个值添加到新数组中作为比较对象，
// 遍历从数组的第二个值开始逐一比较 push 后的新数组中每个元素比较，
// 看是否有相同的，不同就添加，获得不重复新数组
function quchong04(array) {
var newArr = [array[0]];
for (var i = 1; i < array.length; i++) {
var flag = false; // 用于判断俩数据是否相同
for (var j = 0; j < newArr.length; j++) {
if (newArr[j] === array[i]) {
flag = true;
break;
}
}
if (!flag) newArr.push(array[i]);
}
return newArr;
}
var result04 = quchong04(arr);
console.log(result04);
</script>
</body>
二、效果截图
注： 博主如有写的不好之处，希望您能不吝赐教，给我一些关于这个项目的意见和建议。各位的宝贵意见将对我产生深远的影响，我将认真倾听并尽力改进。谢谢各位~~
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
