JavaScript数组去重五种方法及字符串奇数位转换实战
本文详细解析了JavaScript中数组去重的五种常见实现方式，包括indexOf、sort排序、对象属性标记、计数法及双重循环法，并对比了各方法的兼容性与优缺点。同时，通过一道面试题演示了如何遍历字符串，识别奇数位置的小写英文字母并将其转换为大写，非字母字符保留原样。
JavaScript数组去重五种方法及字符串奇数位转换实战
在前端开发面试中，数组去重是一个高频考点。作为专业的前端工程师，掌握多种去重方案是基本要求。接下来我们将直接切入具体实现方法。
利用 indexOf() 方法去重
一、利用 indexOf() 方法
核心思路：遍历原数组，利用 indexOf() 检查新数组中是否已存在该元素。如果不存在（即 indexOf 返回 -1），则将该元素添加至新数组。
//先定义一个数组
var arr = [,'','',,,,,,,,];
function remov(array) {
var arr=[];
for (var i=,len=array.length;i<len;i++){
if (arr.indexOf(array[i])==-){
arr.push(array[i])
}
}
return arr;
}
console.log(remov(arr));//[, "", "", , , , , , , ]代码实现较为直观。需要注意的是，indexOf() 是 ES5 标准引入的方法，在 IE8 及更低版本的浏览器中不支持，因此在实际项目中使用前需评估兼容性需求。
结合 sort() 排序与相邻元素判断
二、结合 sort() 排序与相邻元素判断
核心思路：首先调用数组的 sort() 方法对数组进行升序排序，使相同元素相邻。接着遍历排序后的数组，比较当前元素与下一个元素是否相等，若不相等则将当前元素推入新数组。
var arr = [,'','',,,,,,,,];
function remov(array) {
var linArr = [];
array.sort();
for (var i = , len = array.length; i < len; i++) {
if (array[i + ] !== array[i]) {
linArr.push(array[i])
}
}
return linArr;
}
console.log(remov(arr));//["", , , , , "", , , , ]利用空对象与空数组配合去重
三、利用空对象与空数组配合
核心思路：在 for 循环中检查对象是否包含当前数组项。若不包含，则将该项推入新数组，并将该项作为对象的属性赋值为 1。
var arr = [,'','',,,,,,,,];
function remov(array) {
var res = [];
var obj={};
for (var i=;i<array.length;i++){
if(!obj[array[i]]){
res.push(array[i]);
obj[array[i]]=;
}
}
return res;
}
console.log(remov(arr));//[, "", "", , , , , , ]这里将当前项设为对象属性并赋值为 1 的原因在于：例如数组中的数字 5，首次遇到时对象中无此属性，故将其加入新数组。若不为该属性赋值，后续再次遇到相同的 5 时，对象中仍无此属性，导致重复添加。通过赋值标记，可确保后续相同的值不再被加入新数组。当然，属性值也可设为其他非 falsy 值，此处仅为示意。
需注意，此方法在处理字符串 '4' 与数值 4 时，由于对象键名统一转为字符串，两者会被视为相同键，导致无法区分，存在一定局限性。
基于对象属性的计数法去重
四、基于第三种方法的改进：计数法
核心思路：在 for 循环中，若对象不包含当前项，则将其属性值设为 1；若已存在，则将属性值加 1。循环结束后，使用 for...in 遍历对象的所有属性。
var arr = [,'','',,,,,,,,];
function remov(array) {
var obj = {};
var res = [];
for (var i=;i<array.length;i++){
if(!obj[array[i]]){
obj[array[i]]=;
}else{
obj[array[i]]++;
}
}
for (var k in obj){
res.push(k);//b.这里将遍历的对象属性push到新创建的数组中
// console.log(k);//a.直接将遍历的对象的属性打印出来
}
return res;//b.这里返回新创建的数组
}
console.log(remov(arr));//b.这里将remov(arr)函数的执行结果打印出来["", "", "", "", "", "", "", "", ""]
// remov(arr);//a此方法存在一个值得注意的现象：若直接在 for...in 循环中打印属性（如注释 a 所示），结果如图 a4 所示。
若将遍历到的属性值推入新数组（如注释 b 所示），最终打印出的数组元素均为字符串类型，如图 a4 所示。
双重 for 循环遍历法去重
五、双重 for 循环遍历法
核心思路：此方法应用较为广泛。创建一个新数组，外层 for 循环将原数组元素存入变量 item。内层 for 循环将新数组元素与 item 进行比较，若发现相等则执行 break 跳出内层循环。内层循环结束后，检查新数组长度是否等于内层循环变量 j 的值，若相等说明未找到重复项，则将 item 加入新数组。
var arr = [,'','',,,,,,,,];
function remov(array) {
var res = [];
for (var i=,len=array.length;i<len;i++){
var item = array[i];
for (var j=;j<res.length;j++){
if (res[j]==item){
break;
}
}
if (res.length==j){
res.push(item);
}
}
return res;
}
console.log(remov(arr));//[, "", "", , , , , , ]
上述几种为常见的数组去重方案，实际开发中还有其他实现方式。如有错误或疏漏，欢迎指正与探讨。
字符串奇数位置小写转大写实战
补充一道相关面试题：
题目要求：对输入的字符串进行编号，从 1 开始。若遇到奇数位置的小写英文字母，则将其转换为对应的大写字母；若遇到非英文字母字符，不参与奇偶计数，但在结果中保留该字符。
var str = 'sdt$^uygGTdgabN';
document.write(str+"<br/>");//将原字符串输出到文档
var j=,reg=/[a-zA-Z]/;//j变量用于计数、定义一个正则表达式用来判断是否是字母
var sArr = str.split("");//将字符串转换成数组
for (var i=;i<sArr.length;i++){
if(reg.test(sArr[i])){//如果是字母j++
j+=;
if (j%==){//如果是奇数将当前项转换成大写
sArr[i] = sArr[i].toUpperCase();
}
}
}
str = sArr.join('');//将数组转换成字符串
document.write(str);//将转换后的字符串输出到文档
转换前后的字符串对比效果如图 a7 所示。
以上内容为本文的全部总结，希望能为读者的学习提供有益参考，欢迎继续支持本站。
JS动态构建复杂嵌套JSON对象的方法
2026-11-05 15:41:52
JS负数取余为什么是负数？详解余数与模运算区别
2026-11-05 13:34:41
JS 解压出现乱码或报错怎么解决？
2026-11-05 12:32:38
JS 中 startsWith、indexOf 与正则判断字符串前缀的对比
2026-11-04 22:19:43
JS解析Excel后怎么将数据转换为JSON格式
2026-11-04 20:58:28