复制文本到剪切板
const copyToClipboard = (text)=> navigator.clipboard.writeText(text)
获取某个日期位于当年的第几天
let dayOfYear = (date)=> Math.floor((date- new Date(date.getFullYear(),0,0)) / 1000/60/60/24)
dayOfYear(new Date(202,10,27)) //331
将rgb颜色灰度化(基于光感加平均)
let gary = (r, g, b)=>0.2126 * r + 0.7152 * g + 0.0722 * b
gary(50,100,150) // 92.97999999999999
// 把新获取的灰度值当做rbg的值, rgb(92.97,92.97,92.97)
解析url中的参数
let parseQuery=url=>{ let q={}
url.replace(/([^?&=]+)=([^&]+)/g,(_,k,v)=>q[k] = v)
return q
}
console.log(parseQuery('http://a.com/?a=1&b=2'),parseQuery('c=3&d=4'))
// {"a": "1","b": "2"} {"c": "3","d": "4"}
筛选对象属性,返回一个新对象
let pick = (obj,...props)=> Object.fromEntries(Object.entries(obj).filter(([k])=>props.includes(k)))
pick({a:1,b:2,c:3},'a','b')
// {"a": 1,"b": 2}
生成随机字符串
let randomString =()=> Math.random().toString(36).slice(2)
randomString() // x8vyxp5ke9
去掉字符串中的元素标记
let removeTag = (fragment)=> new DOMParser().parseFromString(fragment,'text/html').body.textContent || ''
removeTag(`hello world`)
// hello world
滚动到页面顶部/底部
// 滚动到页面顶部
let scrollToTop = ()=>{ window.scrollTo({ top:0,
left:0,
behavior:'smooth'
})
}
// 滚动到页面底部
let scrollToBottom = ()=>{ window.scrollTo({ top:document.documentElement.offsetHeight,
left:0,
behavior:'smooth'
})
}
生成指定范围内的随机数
const randomNum = (min, max) => Math.floor(Math.random() * (max - min + 1)) + min;
randomNum(1, 10) // 6
randomNum(10, 20) // 11
打乱数组的顺序
const shuffleArray = (array) => { return array.sort(() => 0.5 - Math.random())
}
let arr = [ 1, -1, 10, 5 ]
shuffleArray(arr) // [5, -1, 10, 1]
shuffleArray(arr) // [1, 10, -1, 5]
从数组中获取随机值
// 可以用来抽奖之类的
const getRandomValue = array => array[Math.floor(Math.random() * array.length)];
const prizes = [ '谢谢惠顾', '再来一次', '10块' ]
getRandomValue(prizes)
格式化货币
// 第一种方式
const formatMoney = (money) => { return money.replace(new RegExp(`(?!^)(?=(\\d{3})+${money.includes('.') ? '\\.' : '$'})`, 'g'), ',')
}
formatMoney('123456789') // '123,456,789'
formatMoney('123456789.123') // '123,456,789.123'
formatMoney('123') // '123'
// 第二种方式
const formatMoney2 = (money) => { return money.toLocaleString()
}
formatMoney2(123456789) // '123,456,789'
formatMoney2(123456789.123) // '123,456,789.123'
formatMoney2(123) // '123'
确定设备类型
const isMobile = () => { return !!navigator.userAgent.match(
/(iPhone|iPod|Android|ios|iOS|iPad|Backerry|WebOS|Symbian|Windows Phone|Phone)/i
);
};
判断设备是Android还是IOS
const isAndroid = () => { return /android/i.test(navigator.userAgent.toLowerCase());
};
const isIOS = () => { let reg = /iPhone|iPad|iPod|iOS|Macintosh/i;
return reg.test(navigator.userAgent.toLowerCase());
};
深拷贝
const deepCopy = (obj, hash = new WeakMap()) => { if (obj instanceof Date) { return new Date(obj);
}
if (obj instanceof RegExp) { return new RegExp(obj);
}
if (hash.has(obj)) { return hash.get(obj);
}
let allDesc = Object.getOwnPropertyDescriptors(obj);
let cloneObj = Object.create(Object.getPrototypeOf(obj), allDesc);
hash.set(obj, cloneObj);
for (let key of Reflect.ownKeys(obj)) { if (obj[key] && typeof obj[key] === "object") { cloneObj[key] = deepCopy(obj[key], hash);
} else { cloneObj[key] = obj[key];
}
}
return cloneObj;
};
全屏显示元素/退出浏览器全屏状态
// 全屏
const goToFullScreen = (element) => { element = element || document.body;
if (element.requestFullscreen) { element.requestFullscreen();
} else if (element.mozRequestFullScreen) { element.mozRequestFullScreen();
} else if (element.msRequestFullscreen) { element.msRequestFullscreen();
} else if (element.webkitRequestFullscreen) { element.webkitRequestFullScreen();
}
};
// 退出全屏
const goExitFullscreen = () => { if (document.exitFullscreen) { document.exitFullscreen();
} else if (document.msExitFullscreen) { document.msExitFullscreen();
} else if (document.mozCancelFullScreen) { document.mozCancelFullScreen();
} else if (document.webkitExitFullscreen) { document.webkitExitFullscreen();
}
};