社区首页 >专栏 >js 编程题笔记

js 编程题笔记

心念

发布于 2023-01-11 12:53:10

97300

代码可运行

文章被收录于专栏：前端心念前端心念

运行总次数：0

代码可运行

提取url后面的参数

1    const url = "http://localhost:1999/api/article/query?category=all&pageNum=1&pageSize=5"
2
3    const getParams = (url)=>{
4        //提取问号后面的部分,并分割参数
5        let paramsList = url.split("?")[1].split("&")
6        
7        const params = {}
8
9        //将参数再次分割，并放进对象
10        paramsList.forEach(item=>{
11            const [key,value] = item.split("=")
12
13            params[key]=value
14        })
15       return params
16    }
17
18    
19    console.log(getParams(url));
20    //{"category": "all","pageNum": "1","pageSize": "5"}

根据id排序对象数组，并返回name

1// JavaScript;
2// 调用示例
3const source = [
4  { id: 4, name: "test1" },
5  { id: {}, name: "ssdf" },
6  "test",
7  { id: () => {}, name: "sf" },
8  { id: "6", name: "test3" },
9  { id: 6, name: "test4" },
10  { id: 7, name: "test7" },
11  { id: 2, name: "test2" },
12  { name: "sf" },
13  {},
14];
15
16function filterSort(source) {
17  //   过滤数组
18  let newArr = source.filter((item) => item.id && typeof item.id === "number");
19  //   排序
20  newArr = newArr.sort((a, b) => {
21    return a.id - b.id;
22  });
23  // 返回name
24  newArr = newArr.map((item) => item.name);
25  console.log(newArr);
26  return newArr;
27}
28
29filterSort(source);
30// 输出结果如下
31//   ("test2", "test1", "test4", "test7")

判断回文字符串

1const isReverseStr = (str) => {
2  // 先忽略掉字母大小写
3  const toStr = str.toLowerCase();
4  // 将字符串转为数组后颠倒，再转回字符串
5  const reverseStr = toStr.split("").reverse().join("");
6  // 和原字符串做对比
7  return reverseStr === toStr;
8};
9isReverseStr("121");

找出数组中出现次数最多的

1const findMax = (arr) => {
2  // 定义一个对象用来计数
3  const obj = {};
4  // 开始计数，没有的就=1，有的就++
5  arr.forEach((item) => {
6    if (!obj[item]) {
7      obj[item] = 1;
8    } else {
9      obj[item]++;
10    }
11  });
12
13  //   找出出现次数最大的数
14  let maxNum = 0;
15  for (const i in obj) {
16    if (obj[i] > maxNum) {
17      maxNum = obj[i];
18    }
19  }
20
21  //   输出对应的key
22  for (const i in obj) {
23    if (obj[i] === maxNum) {
24      return i;
25    }
26  }
27};
28
29console.log(findMax([1, 2, 44, 44, 2, 2, 44, 12, 44, 12, 12, 33]));

手写防抖函数

利用了闭包

1const debounce = (fn, delay) => {
2  let time = null;
3
4  return () => {
5    if (time) {
6      clearTimeout(time);
7    }
8    time = setTimeout(fn, delay);
9  };
10};

数组去重1

new Set() 真的是数组去重界的天花板

利用Set不能接收重复数据的特点

再利用展开运算符可以把一个类数组转为真实数组的特点

秒去重

1const arr = [1,9,8,8,7,2,5,3,3,3,2,3,1,4,5,444,55,22];
2
3  function noRepeat(arr){
4 
5    const newArr = [...new Set(arr)]; //利用了Set结构不能接收重复数据的特点
6 
7    return newArr
8 
9  }
10 
11 console.log(noRepeat(arr)) 
12 //[1, 9, 8,7, 2,5, 3, 4, 444, 55 ,22]

数组去重2

利用了indexOf只能查找到第一个的下标机制

1const arr = [1, 9, 8, 8, 7, 2, 5, 3, 3, 3, 2, 3, 1, 4, 5, 444, 55, 22];
2
3function noRepeat(arr) {
4  return arr.filter((item, index) => {
5    console.log(arr.indexOf(item), index);
6    return arr.indexOf(item) === index;
7  });
8}
9
10console.log(noRepeat(arr));
11//[1, 9, 8,7, 2,5, 3, 4, 444, 55 ,22]
12