美文网首页
8个有用的JavaScript单行程序

8个有用的JavaScript单行程序

作者: 前端技术驿站 | 来源:发表于2021-04-21 23:58 被阅读0次

    在实际开发中,同一个业务逻辑往往有不同的实现方式,不同的实现所产生的代码量以及所体现的思路不尽相同,越是精简的实现越能展现代码之美,逼格也会略胜一筹。下面就让我们来了解一下 JavaScript 常见的单行程序吧!

    1、随机 ID 生成

    现在,要你随机生成一个字符串,你该怎么办???能怎么办?就用下面这种方式实现咯:

    const randomString = Math.random().toString(36).substring(2);
    console.log(randomString); // vlxewjdfbk
    

    额,这是什么操作,toString 还带个参数?你可能对这比较陌生,不,我说的就是我自己。

    原来 toString 方法有一个参数,用来把 number 转为什么进制的字符串。

    // radix可选,规定表示数字的基数,是 2 ~ 36 之间的整数。
    // 若省略该参数,则使用基数 10。
    // 但是要注意,如果该参数是 10 以外的其他值,则 ECMAScript 标准允许实现返回任意值。
    // 2-数字以二进制值显示;8 - 数字以八进制值显示;16 - 数字以十六进制值显示。
    number.toString(radix);
    
    // 此外,parseInt也有类似功能,parseInt(string, radix)。
    

    然后通过 substring(2)截取字符串,因为随机数大于等于 0 小于 1,前两位是"0."。这种方法的缺陷是不能包括所有的大小写英文字符。

    2、生成范围内的随机数

    Math.random 是一个功能很强大的函数,能帮助我们生成大于等于 0.0 且小于 1.0 的 double 值。

    let max = 50;
    let min = 30;
    let a = Math.floor(Math.random() * (max - min + 1)) + min;
    

    3、随机排列数组

    随机排序数组也叫做洗牌。

    let arr = ["A", "B", "C", "D", "E"];
    console.log(arr.slice().sort((a, b) => Math.random() - 0.5));
    

    为了不改变原始数组,使用了 slice 获得一个副本,不然 sort 就会修改原始数组。sort 可以传递一个排序规则对当前数组元素进行排序。

    如果结果(Math.random() - 0.5)返回小于 0 的值,数组将按照升序排列(即 a > b,那么就交换位置),大于 0,则降序排序(即 a < b,也要交换位置),等于 0 就不交换位置。
    这里 Math.random() - 0.5 可能大于小于或等于 0,所以就得到了一个乱序的数组。

    4、反转字符串

    反转字符串有很多种方法,现在一行代码解决它:

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

    先对字符串进行分割成数组,使用数组的 reverse 方法进行反转,然后再拼接成字符串。稍加改造就可以用来判断回文字符串:

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

    5、交换两个变量

    利用 ES6 结构赋值,轻轻松松解决:

    [a, b] = [b, a];
    

    当然还有另一种,首先根据运算符的优先级,首先执行 b=a,此时 b 直接得到了 a 的值,然后一步数组索引让 a 得到了 b 的值。(⊙o⊙)…,不明觉厉啊!

    a = [b, (b = a)][0];
    

    6、检查偶数和奇数

    箭头函数的一个优点,就是可以简化代码。

    const isEven = num => num % 2 === 0;
    

    7、合并多个数组

    这个方法就多了,来看看一气就呵成的:

    let student1 = ['A', 'B', 'C'];
    let student2 = ['a', 'b', 'c'];
    
    let result1 = student1.concat(student2);
    let result2 = [].concat(student1, student2);
    let result3 = [...student1, ...student2];
    

    看样子,第三种方法,看起来就挺美。

    8、将文字复制到剪贴板

    将文本复制到剪贴板非常有用,也是一个很难解决的问题,不管难不难,下面的代码就能实现:

    const copyTextToClipboard = async (text) => {
      await navigator.clipboard.writeText(text)
    }
    

    关注公众号【前端技术驿站】让我们共同进步吧!我整理了一些项目实战视频,欢迎来学习!

    相关文章

      网友评论

          本文标题:8个有用的JavaScript单行程序

          本文链接:https://www.haomeiwen.com/subject/ilotrltx.html