记录JS一些比较实用便捷的小技巧(三)

1.日历获取过去7天的日期等

[...Array(7).keys()].map(day=>new Date(Date.now()-86400000*day).getDate());//里面的getDate()可以根据实际需要变其他日期方法
//获取当月全部日期
let year = new Date().getFullYear();
let month = new Date().getMonth()+1;
let daynum = new Date(year,month,0).getDate();//在new Date里设置0是当月,上月是-1,获取对应月的天数
let dayArray = [];
for(let i=1;i<=daynum;i++){
      dayArray  = [...dayArray ,`${year}-${('0'+month).slice(-2)}-${('0'+i).slice(-2)}`]
}//["2019-05-01", "2019-05-02", "2019-05-03", "2019-05-04", "2019-05-05", "2019-05-06",...]日期的格式也可以自定

2.uuid生成
有时会碰到后台要前端生成一个uuid给他,那只能自己生成啦

 let d = new Date().getTime();
 const uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
            var r = (d + Math.random() * 16) % 16 | 0;
            d = Math.floor(d / 16);
            return (c == 'x' ? r : (r & 0x3 | 0x8)).toString(16);
        });
简单一点也有这种用法,看具体了:
Math.random().toString(36).substring(2);

3.获取url的查询参数

假设url是https://www.baidu.com/?title=chouchou&name=super
let q ={};
location.search.replace(/([^?&]+)=([^&]+)/g,(_,k,v)=>q[k]=v);
console.log(q)//{title: "chouchou", name: "super"}

正则含义

reg.png

4.数组混淆

let arr=[1,2,3,4,5];
let f = (arr)=>arr.slice().sort(()=>Math.random()-0.5);
console.log(f(arr))

5.生成随机的十六进制颜色代码

'#'+Math.floor(Math.random()* 0xffffff).toString(16).padEnd(6,'0');
还有种好理解的方法
let color = "";
let str = "0123456789abcdef";
let length = str.length + 1;
for (let j = 0; j < 6; j++) { //随机改变每个数字的颜色
            color += str.substr(parseInt(Math.random() * length), 1); //取颜色(循环，每次提取一位，进行拼接组成6为颜色的值)
        }
color='#'+color;

6.数据类型的检验
一.typeof:返回结果包括 number,boolean,string,symbol,object,undefined,function, 因此不能判断null,array

typeof [1,2,3]//object
typeof null/object
typeof new Date()/object
typeof new RegExp()/object

二.instanceof:判断A是否为B的实例,但是因为是实例判断,就会造成字面量方式和实例方式的结果不一致,另外也不能判断null和undefined

[] instanceof Array;//true,现在es6也可以直接用Array.isArray([1,2,3])来判断
new Date() instanceof  Date;//true
new RegExp() instanceof  RegExp;//true
1 instanceof  Number;//false
new Number(1) instanceof  Number;//true

三.判断null和undefined:

null ===null//true
undefined ===undefined//true

四.终极方法Object.prototype.toString.call(),效果如下~

Object.prototype.toString.call('') ;   // [object String]
Object.prototype.toString.call(1) ;    // [object Number]
Object.prototype.toString.call(true) ; // [object Boolean]
Object.prototype.toString.call(undefined) ; // [object Undefined]
Object.prototype.toString.call(null) ; // [object Null]
Object.prototype.toString.call(new Function()) ; // [object Function]
Object.prototype.toString.call(new Date()) ; // [object Date]
Object.prototype.toString.call([]) ; // [object Array]
Object.prototype.toString.call(new RegExp()) ; // [object RegExp]
Object.prototype.toString.call(new Error()) ; // [object Error]
Object.prototype.toString.call(document) ; // [object HTMLDocument]
Object.prototype.toString.call(window) ; //[object global] window是全局对象global的引用