一篇文章带你用好这几个Javascript方法，在工作中至少可以提高30%效率

最近摊上了一个比较闹心的项目，在这个项目上呆了4个月了，上周周末以为终于迎来了一个正常的双休了，没想到周六上午好不容易刚睡醒，这烦人的测试又在群里疯狂的@，就跟消息轰炸似的，说实话我感觉过年放鞭炮都没这个来得抖，浑浑噩噩的打开消息记录以为是什么bug修改，没想到好家伙又是需求变更，这需求变更就需求变更嘛，你这把原来的逻辑直接覆盖了这算怎么一回事（当时接项目的时候说是8个系统联调的项目就知道会是令人难忘的项目，因为和别人系统联调难免会遇到各种问题，但没想到这xxx项目是这样啊）

这里博主趁着手上暂时还没有需求需要变更给小伙伴们分享一些实用的项目总结：放在全局封装成公用的方法在合适不过了。

1、数组排序

  // 如果降序把( a-b )换成 ( b-a )
    const setSorting = (arr)=>arr.sort((a,b)=>a-b) 
    console.log(setSorting([2,3,1,6,4])) // 1 2 3 4 6

2、数组过滤

  // 把 (item > 2) 换成过滤条件就行
    const setFilter = (arr)=>arr.filter(item =>item > 2)
    console.log(setFilter([1,2,3,4,5])) // 3 4 5

3、计算两日期之间相差的天数

  // 例: new Date("2022-10-21") 打印出来是 Fri Oct 21 2022 08:00:00 GMT+0800 (中国标准时间)
    const dayDiff = (date1, date2) => Math.ceil(Math.abs(date1.getTime() - date2.getTime()) / 86400000);
    console.log(dayDiff(new Date("2022-10-21"), new Date("2022-12-12")))  // 52

4、检查用户是pc端还是手机端

  // 可以用于布置手机端电脑端两套代码
    const judgeDeviceType =() => /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|OperaMini/i.test(navigator.userAgent) ? 'Mobile' : 'PC';
    console.log(judgeDeviceType()) // PC | Mobile

5、检查对象是否为空

  // 适用于对象检查 对象是否为{}
    const isEmpty = obj => Reflect.ownKeys(obj).length === 0 && obj.constructor === Object;
    console.log(isEmpty({})) // true

6、获取Url传参

  // 用来查询接口传值这些再合适不过了
    const getParameters = URL => JSON.parse(`{"${decodeURI(URL.split("?")[1]).replace(/"/g, '\\"').replace(/&/g, '","').replace(/=/g, '":"')}"}`)
    console.log(getParameters("https://www.google.com.hk/search?q=js+md&newwindow=1")) //{q: 'js+md', newwindow: '1'}

7、数组去重

 // 实现一行代码去重
    const uniqueArr = (arr) => [...new Set(arr)];
    console.log(uniqueArr([1,2,3,4,5,3,2])) // 1 2 3 4 5

8、根据对象里面的某个属性进行累加（获取累加和）

 // 使用时把 'age' 属性换成要累加的属性就可以了
    const calcCumulative = (arr)=>arr.reduce((x,y) => x + y?.age,0)  // 10
    calcCumulative([
            {age:1},
            {age:2},
            {age:3},
            {age:4}
          ])

9、检查数据类型

 // 与typeof类似 但弥补了typeof 的不足之处
    const checktestType  =(str)=> Object.prototype.toString.call(str)
    checktestType({}) // [object Object]

10、判断是不是数字

 // 数字类型返回 false; 其它类型返回 true
    const checkForNumbers = (e)=> e && e!==true?isNaN(e):true;
    console.log(checkForNumbers('1')) // false

11、数组内容自动填充

 // num是自动填充个数  val是自动填充类容
    const automaticFilling = (num,val)=> Array(num).fill(val)
    console.log(automaticFilling(3,''))  // ['', '', '']

12、设置sessionStorage

 // 'data' 设置为获取数值的key 随便写但需要前后对应, '测试'是要设置的内容
    sessionStorage.setItem('data','测试');
    console.log(sessionStorage.getItem('data')) // 测试

13、设置uuid主键唯一值

 // 一般用于id赋值;赋值UUid
    const  getrandomGuid = () => Math.random().toString(36).slice(2);
    console.log(getrandomGuid()) // 3ep8w7qndnq

14、判断 a == 1 && a==2 && a==3

 // 这个仅作了解使用,实际项目中用不到
        let  a ={
            n : 1,
            valueOf :function(){
              return  this.n ++;
            }
        }
        console.log(a == 1 && a == 2 && a ==3) // true

总结：

以上就是今天要讲的内容，本文仅仅简单介绍了一些感觉工作中常用的方法；后续有工作中遇到的常用方法会在这篇博客中持续更新；别划走，希望小伙伴们能点赞、收藏、关注一波，也是对小晓的支持，非常感谢！（对了希望这周能双休。。。。。）

一篇文章带你用好这几个Javascript方法，在工作中至少可以提高30%效率

猜你喜欢