JavaScript题目解析与解答

---

前言

提示：这里可以添加本文要记录的大概内容：

在日常的开发工作中，我们经常会遇到各种各样的问题，而解决这些问题需要我们熟练掌握编程语言的基础知识和常用的技巧。本文将解析并解答一些常见的JavaScript题目，包括字符串翻转、分数统计、域名截取、参数解析、数组去重和元素统计。

---

提示：以下是本篇文章正文内容，下面案例可供参考

一、将字符串翻转

有一个字符串 str，需要将其翻转。

let str = "abcdefghijk";
let finalresult = str.split('').reverse().join('');
console.log(finalresult);   //输出结果为："kjihgfedcba"

使用 split(‘’) 方法将字符串转换为字符数组。split(‘’) 方法会将字符串按照每个字符拆分成一个数组元素。
使用 reverse() 方法翻转字符数组的顺序。reverse() 方法会反转数组元素的顺序。
使用 join(‘’) 方法将翻转后的字符数组转换回字符串。join(‘’) 方法会将数组元素按照指定的分隔符连接成一个字符串，这里我们使用空字符串作为分隔符。

二、分别统计及格和不及格的分数总和

一个包含分数的数组 subjectList，需要统计及格和不及格的分数总和。
下面是解题代码：

let subjectList = [
  { score: 10 },
  { score: 20 },
  { score: 30 },
  { score: 40 },
  { score: 50 },
  { score: 60 },
  { score: 70 },
  { score: 80 },
  { score: 90 },
  { score: 100 },
];

const passSum = subjectList
  .filter((item) => item.score > 59)
  .reduce((acc, item) => (acc += item.score), 0);

const failSum = subjectList
  .filter((item) => item.score < 60)
  .reduce((acc, item) => (acc += item.score), 0);

console.log("及格的分数总和：" + passSum);
console.log("不及格的分数总和：" + failSum);    //输出结果为：及格的分数总和：550  不及格的分数总和：150

使用 filter() 方法筛选出分数大于 59 的学科对象，这样得到的数组只包含及格的学科对象。
使用 reduce() 方法对筛选后的数组进行累加求和操作。初始值为 0，累加每个学科对象的 score 属性值。
将及格分数的总和赋值给变量 passSum。
使用 filter() 方法筛选出分数小于 60 的学科对象，这样得到的数组只包含不及格的学科对象。
使用 reduce() 方法对筛选后的数组进行累加求和操作。初始值为 0，累加每个学科对象的 score 属性值。
将不及格分数的总和赋值给变量 failSum。

三、截取域名

有一个完整的URL字符串 href，需要截取出域名部分，前提是不能用slice方法。
下面是解题代码：

let href = "http://www.baidu.com?name=zs&age=18&sex=男";
let domain = href.split('?')[0];
console.log(domain);   //输出结果为："http://www.baidu.com"

使用 split(‘?’) 方法将 URL 字符串以问号为分隔符进行拆分，得到一个数组。
数组的第一个元素即为域名部分，将其赋值给变量 domain。
使用 console.log() 方法输出 domain。

四、获取问号后面的参数并转成对象

有一个完整的URL字符串 href，需要获取问号后面的参数，并将其转换成对象。
下面是解题代码：

let href = "http://www.baidu.com?name=zs&age=18&sex=男";
const paramsStr = href.split("?")[1]; // name=zs&age=18&sex=男
const paramsArr = paramsStr.split("&"); //  ['name=zs', 'age=18', 'sex=男']

let obj = {};
paramsArr.forEach((it) => {
  obj[it.split("=")[0]] = it.split("=")[1];
});
console.log(obj);    //输出结果为：{ name: 'zs', age: '18', sex: '男' }

使用索引 [1] 提取查询参数部分，将其赋值给变量 paramsStr。
使用 split(‘&’) 方法将 paramsStr 字符串以 & 符号为分隔符进行拆分，得到一个数组 paramsArr。数组中的每个元素都是一个参数的键值对字符串。
定义一个空对象 obj，用于存储参数的键值对。
使用 forEach() 方法遍历 paramsArr 数组中的每个元素。
在遍历的过程中，使用 split(‘=’) 方法将每个参数的键值对字符串以等号为分隔符进行拆分，得到一个数组。

五、数组去重

有一个数组 arr，需要对其中的数字进行去重。
下面是解题代码：
第一种方法：

      let newArr = []
      arr.forEach(it=>{
          // includes（ture/false）  find（值） findIndex（索引/-1）
          if(!newArr.includes(it)){
            newArr.push(it)
          }
      })
      console.log(newArr);    //输出结果为：[1, 2, 3, 4, 5]

使用 forEach() 方法遍历原始数组 arr 中的每个元素。
在遍历的过程中，使用 includes() 方法检查 newArr 数组是否已经包含当前元素。如果 newArr 中不包含当前元素，则将其添加到 newArr 数组中。
第二种方法：

let arr = [1, 2, 3, 4, 5, 1, 2, 3];
const newArr = arr.reduce(
  (acc, item) => (acc.includes(item) ? acc : [...acc, item]),
  []
);
console.log(newArr);    //输出结果为：[1, 2, 3, 4, 5]

六、统计数组中每个元素出现的次数

有一个数组 arr，需要统计其中每个元素出现的次数。
下面是解题代码：
第一种方法：

   let obj1 = {};
       arr.forEach((it) => {
        if (obj1[it]) {
          obj1[it]++;
        } else {
          obj1[it] = 1;
        }
      });

      console.log(obj1);    //输出结果为：{ '1': 2, '2': 2, '3': 2, '4': 1, '5': 1 }

使用 forEach() 方法遍历数组 arr 中的每个元素。在遍历过程中，判断对象 obj1 中是否已经存在当前元素作为属性。
如果 obj1 中已经存在当前元素作为属性，则将该属性对应的值加1，表示该元素又出现了一次。
如果 obj1 中不存在当前元素作为属性，则将该元素作为属性添加到 obj1 对象中，并将属性值初始化为1，表示该元素第一次出现。
第二种方法：

arr.forEach((it) => {
        obj1[it] ? obj1[it]++ : (obj1[it] = 1);
      });
      console.log(obj1);    //输出结果为：{ '1': 2, '2': 2, '3': 2, '4': 1, '5': 1 }

总结

通过解答以上题目，我们可以看到在JavaScript中，我们可以利用字符串和数组的方法来解决各种问题。掌握这些基本的方法和技巧对于日常的开发工作非常重要。同时，我们还可以通过编写简洁、高效的代码来提高工作效率。希望本文对你在JavaScript编程中有所帮助！