史上最牛逼的5道题，学不会前端我带你！

前言

5道JS能力评测题个人觉得是非常好的5道js基础检测题，基本就是对自己的JavaScript基础做一个比较全面的评估，包括if语句、循环体、基础操作符、setInterval、setTimeout、流程控制、常用数组方法及es6相关（解构、Map、Set、...等）。之前我已经做过一遍了，我记得以前牛客网不支持es6的写法，这两天花了点时间把所有题目又做了一遍，发现支持es6了。这次每个题目我都尽力用了不同的方法实现，建议各位看官收藏，需要的时候方便查看。当然如果你有更好更新颖的实现方法，欢迎评论区留言交流。

我也把常用的数组方法和字符串方法贴在这里，可以自测掌握程度

 

如果还在IT编程的世界里迷茫，不知道自己的未来规划，学习没有动力，东也学一下，西也学习一下，那你可以加入web前端学习交流Q群：733581373, 里面有大神一起交流并走出迷茫。新手可进群免费领取学习资料，分享一些学习的方法和需要注意的小细节，每晚八点也会准时的讲一些前端的小案例项目。

 

1、查找数组元素位置

第一题比较简单，就直接上答案：

// 方法一
function indexOf(arr, item) {
    if(Array.prototype.indexOf){// 判断浏览器是否支持indexOf方法
        return arr.indexOf(item);
    }else{
        for(var i=0;i 0) {
        return arr.indexOf(item)
    }else{
        return -1
    }
}

这里顺便说一下Array.prototype.indexOf

indexOf()方法返回在数组中可以找到一个给定元素的第一个索引，如果不存在，则返回-1。

语法：

 arr.indexOf(searchElement) //查找searchElement元素在数组中的第一个位置
 arr.indexOf(searchElement[, fromIndex = 0]) //从fromIndex开始查找searchElement元素在数组中的第一个位置

还有另外一个查找字符串的方法String.prototype.indexOf()

str.indexOf(searchValue[, fromIndex])

• searchValue：一个字符串表示被查找的值。
• fromIndex （可选）：表示调用该方法的字符串中开始查找的位置。可以是任意整数。默认值为 0。如果 fromIndex < 0 则查找整个字符串（如同传进了 0）。如果 fromIndex >= str.length，则该方法返回 -1，除非被查找的字符串是一个空字符串，此时返回 str.length。

具体可以看看MDN

2、添加元素(末尾添加)

方法一：普通的for循环拷贝+push

function append(arr, item) {
    let resArr = []
    for(let i = 0;i 
  

方法二：使用concat将传入的数组或非数组值与原数组合并,组成一个新的数组并返回

function append(arr, item) {
    return arr.concat(item);
}

方法三：使用slice浅拷贝+push

function append(arr, item) {
     let newArr = arr.slice(0);  // slice(start, end)浅拷贝数组
    newArr.push(item);
    return newArr;
}

方法四：...扩展运算符 如果不知道的，可以看看es6的相关知识

function append(arr, item) {
let resArr = [...arr,item]
return resArr
}

3、移除数组中的元素(返回原数组)

这里需要注意理解题目，是直接操作原数组，所以不能出现newArr

方法一：普通for循环+splice

function removeWithoutCopy(arr, item) {
    for(let i=arr.length;i>=0;i--){
        if(arr[i]==item){
            arr.splice(i,1);
        }
    }
    return arr;
}

方法二：方法一的另外一种写法

在这里要注意在删除掉一个元素时，要 i–，即删除这个元素后，其他元素位置往前移。

function removeWithoutCopy(arr, item) {
    for(let i = 0; i< arr.length; i++) {
        if(arr[i]===item) {
            arr.splice(i,1);
            i--;
        }
    }
    return arr;
}

把第3题稍微变一下，看下一题

4、移除数组中的元素(返回新的数组)

方法一：filter过滤

function remove(arr, item) {
     return arr.filter(res =>{
         return res != item;
    })
}

方法二：for循环+push

function remove(arr, item) {
    let resArr = []
    for(let i = 0;i 
  

方法三：forEach+push（效率高于for循环）

function remove(arr, item) {
    let resArr=[];
    arr.forEach(v=>{
        if(v!==item){
            resArr.push(v);
        }
    })
    return resArr;
}

方法四：for循环+splice

function remove(arr,item){
    let resArr= arr.slice(0);
    for(let i=0;i 
  
5、数组求和
 
  
 
  
方法一：普通for循环
 
  
function sum(arr) {
    let res = 0
    for(let i=0;i<=arr.length;i++){
        res +=arr[i]
    }
    return res
}

 
  
方法二：forEach循环
 
  
 
   
function sum(arr) {
    let res = 0
arr.forEach((value,index,array)=>{
    array[index] == value;    //结果为true
     res+=value;  
    });
    return res;
};

 
  
 
  
方法三：reduce
 
  
reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值，具体可以看看es6相关知识。
 
  
 
   
function sum(arr) {
    return arr.reduce((pre,cur)=>{
        return pre+cur;
    })
}

 
  
 
  
方法四：eval
 
  
eval() 函数可计算某个字符串，并执行其中的的 JavaScript 代码。
 
  
 
   
function sum(arr) {
     return eval(arr.join("+"));
}

 
  
 
  
结语
 
  
看完如果觉得对你有帮助，劳烦点个赞哈，你的鼓励就是我更新最大的动力！
 
  
学习使我快乐！
 
  
最后，想学习前端的小伙伴们！
 
  
如果还在IT编程的世界里迷茫，不知道自己的未来规划，学习没有动力，东也学一下，西也学习一下，那你可以加入web前端学习交流Q群：733581373, 里面有大神一起交流并走出迷茫。新手可进群免费领取学习资料，分享一些学习的方法和需要注意的小细节，每晚八点也会准时的讲一些前端的小案例项目。