有哪些短小却令人惊叹的 JavaScript 代码？|前端常见面试问题数组去重_WEB前端后端开发面试问题

每天学习10个实用JavaScript代码片段，加深对 JavaScript 语法的理解，积累代码优化经验。

1、FizzBuzz

下面代码用于实现经典的 FizzBuzz 问题，将1到100的数字遍历，如果是3的倍数则输出 Fizz ，如果是5的倍数则输出 Buzz，如果既是3的倍数又是5的倍数则输出 FizzBuzz。

const fizzBuzz = () => {
    for (let i = 1; i <= 100; )
        console.log((i % 3 ? "" : "Fizz") + (i % 5 ? "" : "Buzz") || i), i++;
};
console.log(fizzBuzz());

2、斐波那契数列

斐波那契数列（Fibonacci sequence），又称黄金分割数列，因数学家莱昂纳多·斐波那契（Leonardo Fibonacci）以兔子繁殖为例子而引入，故又称为“兔子数列”，指的是这样一个数列：1、1、2、3、5、8、13、21、34、…… 在数学上，斐波那契数列以如下被以递推的方法定义：F(0)=1，F(1)=1, F(n)=F(n - 1)+F(n - 2)（n ≥ 2，n ∈ N*），在现代物理、准晶体结构、化学等领域，斐波那契数列都有直接的应用

斐波那契数列通常是面试常见的问题，下面代码是用一个非常简短的递归函数，返回斐波那契数列中第n个数字的值。

const fib = (n) => (n <= 2 ? 1 : fib(n - 1) + fib(n - 2));

const createFibNumber = (count = 10) => {
    const arrayFibs = [];
    for (let i = 0; i < count; i++) {
        arrayFibs.push(fib(i));
    }
    return arrayFibs;
};

console.log(createFibNumber(10)); // [ 1, 1,  1,  2,  3, 5, 8, 13, 21, 34 ]

3、快速排序

下面代码实现了快速排序，通过递归将数组分割成较小和较大的两个子数组，最终将它们合并以获得排序的结果。

const quickSort = (arrayNums) =>
    arrayNums.length
        ? [
              ...quickSort(arrayNums.slice(1).filter((x) => x <= arrayNums[0])),
              arrayNums[0],
              ...quickSort(arrayNums.slice(1).filter((x) => x > arrayNums[0])),
          ]
        : [];

const arrayNumbers = [1, 3, 5, 6, 2, 4, 11, 30, 100, 40];
console.log(quickSort(arrayNumbers)); // [ 1,  2,  3,  4,   5, 6, 11, 30, 40, 100 ]

4、判断是否为回文

下面代码用于判断一个字符串是否为回文，它将字符串转换为一个字符数组并翻转它，然后将它们重新连接起来，并将其与原字符串进行比较。

const isPalindrome = (str) => str == str.split("").reverse().join("");

console.log(isPalindrome("deved")); // true
console.log(isPalindrome("devedev")); // false

5、数组去重

下面代码用于对一个数组进行去重操作，使用ES6中的Set数据结构，将数组转换为一个Set，然后再将其转换为一个数组。

const unique = (arr) => [...new Set(arr)];

const arrayNumbers = [1, 2, 3, 4, 2, 1];
console.log(unique(arrayNumbers)); // [ 1, 2, 3, 4 ]

6、打印九九乘法表

下面代码可以打印出九九乘法表，它通过两个嵌套的for循环遍历每个数字，然后打印出相应的乘法表达式及其结果。

const createNumbers = () => {
    const array = [];
    for (let i = 1; i <= 9; i++)
        for (let j = 1; j <= i; j++)
            array.push(`${j}*${i}=${j * i}${j === i ? "\n" : "  "}`);
    return array.join("");
};
console.log(createNumbers());

输出结果如下：

1*1=1
1*2=2  2*2=4
1*3=3  2*3=6  3*3=9
1*4=4  2*4=8  3*4=12  4*4=16
1*5=5  2*5=10  3*5=15  4*5=20  5*5=25
1*6=6  2*6=12  3*6=18  4*6=24  5*6=30  6*6=36
1*7=7  2*7=14  3*7=21  4*7=28  5*7=35  6*7=42  7*7=49
1*8=8  2*8=16  3*8=24  4*8=32  5*8=40  6*8=48  7*8=56  8*8=64
1*9=9  2*9=18  3*9=27  4*9=36  5*9=45  6*9=54  7*9=63  8*9=72  9*9=81

7、数组求和

下面代码用于对一个数组中的数字进行求和，使用 reduce 方法将数组中的所有数字相加起来，并返回最终的结果。

const sum = (arr) => arr.reduce((acc, current) => acc + current, 0);
console.log(sum([1, 3, 5, 7, 9, 10])); // 35

8、获取URL参数

下面代码用于从URL中获取特定的参数值，使用 URLSearchParams API来获取URL查询参数，并使用get方法获取特定的参数值。

const getParam = (url, name) =>
    new URLSearchParams(new URL(url).search).get(name);

console.log(getParam("https://www.devpoint.cn?name=devpoint", "name")); // devpoint

9、判断一个数字是否为质数

下面代码用于判断一个数字是否为质数，使用一个for循环遍历2到数字的平方根之间的所有数字，并检查它们是否可以整除该数字。

const isPrime = (n) => {
    if (n <= 1) return false;
    for (let i = 2; i <= Math.sqrt(n); i++) {
        if (n % i === 0) return false;
    }
    return true;
};
console.log(isPrime(1)); // false
console.log(isPrime(2)); // true
console.log(isPrime(3)); // true

10、数组扁平化

下面代码用于将一个嵌套的数组扁平化为一个一维数组，使用 reduce 方法递归地遍历嵌套数组，并将其合并为一个新的数组。

const flatten = (arr) =>
    arr.reduce(
        (acc, val) => acc.concat(Array.isArray(val) ? flatten(val) : val),
        []
    );

console.log(flatten([1, [1, 3], [4, 5, 6], [7, [8, [9]]]])); // [ 1, 1, 3, 4, 5, 6, 7, 8, 9 ]

11、阶乘

下面代码用于计算一个数字的阶乘，使用递归方法，将数字乘以它减一的阶乘。

const factorial = (n) => (n < 2 ? 1 : n * factorial(n - 1));
console.log(factorial(4)); // 24

总结

阅读开源项目是学习提升编码能力最快捷的方式，当然现在可能可以借助 ChatGPT 来生成一些函数，其生成的函数技巧性也很高。

devpoint.cn