今天来向各位分享以下js常见的函数工具,比如数组去重啦,获取url地址啦!各种,今天我也算是记笔记了,以后有新的再补充,好了,不多说了,下面直接上代码!
还是先说一句吧!三哥最帅!三哥是最棒的!!!!
1.数组去重复
duplicate(arr,type){
var newArr = [];
var tArr = [];
if(arr.length == 0){
return arr;
}else{
if(type){
for(var i = 0; i < arr.length;i++){
if(!tArr[arr[i][type]]){
newArr.push(arr[i]);
tArr[arr[i][type]] = true;
}
}
return newArr;
}else{
for(var i = 0; i < arr.length;i++){
if(!tArr[arr[i]]){
newArr.push(arr[i]);
tArr[arr[i]] = true;
}
}
return newArr;
}
}
},
2.判断是否为pc端浏览器模式
//判断浏览器是否为pc端浏览器模式
function isPCBroswer(){
let e = navigator.userAgent.toLowerCase();
let t = "ipad" == e.match(/ipad/i);
let i = "iphone" == e.match(/iphone/i);
let r = "midp" == e.match(/midp/i);
let n = "rv:1.2.3.4" == e.match(/rv:1.2.3.4/i);
let a = "ucweb" == e.match(/ucweb/i);
let o = "android" == e.match(/android/i);
let s = "windows ce" == e.match(/windows ce/i);
let l = "windows mobile" == e.match(/windows mobile/i);
console.log(e);
return !(t || i || r || n || a || o || s || l);
}
console.log(isPCBroswer());
3.格式化时间
function dateFormater(formater,t){
let date = t?new Date(t):new Date();
let Y = date.getFullYear() + '';
let M = date.getMonth() + 1;
let D = date.getDate();
let H = date.getHours();
let m = date.getMinutes();
let s = date.getMinutes();
console.log(Y);
console.log(Y.substr(2,2));
return formater.replace(/YYYY|yyyy/g,Y)
.replace(/YY|yy/g,Y.substr(2,2))
.replace(/MM/g,(M<10?'0':'') + M)
.replace(/DD/g,(D<10?'0':'') + D)
.replace(/HH|hh/g,(H<10?'0':'') + H)
.replace(/mm/g,(m<10?'0':'') + m)
.replace(/ss/g,(s<10?'0':'') + s)
}
console.log(dateFormater('YYYY-MM-DD HH:mm:ss'));
console.log(dateFormater('YYYYMMDDHHmmss'));
console.log(dateFormater('YYYY-MM-DD','2018/08/13'));
4.获取地址栏或者传入的url参数返回对象
function GetUrlParams(URL){
let url = URL?URL:document.location.toString();
let arrObj = url.split("?");
let params = Object.create(null);
if(arrObj.length > 1){
arrObj = arrObj[1].split("&");
arrObj.forEach(item => {
item = item.split("=");
params[item[0]] = item[1]
})
}
return params;
}
let url = 'http://192.168.0.117:8000/pages/dataView.html?type=1&id=4cbe083006234f51a4b2782368b3f38f&did=3';
console.log(GetUrlParams(url));
5.全屏和退出全屏
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>全屏和退出全屏</title>
<style>
:not(:root):-webkit-full-screen::backdrop{
background: #fff !important;
}
:not(:root):-moz-full-screen::backdrop{
background: #fff !important;
}
:not(:root):-ms-fullscreen::backdrop{
background: #fff !important;
}
</style>
</head>
<body>
<button onclick = "toFullScreen()">全屏</button>
<button onclick = "exitFullscreen()">退出全屏</button>
<script>
//全屏
function toFullScreen(){
let elem = document.body;
elem.webkitRequestFullScreen
? elem.webkitRequestFullScreen()
: elem.mozRequestFullScreen
? elem.mozRequestFullScreen()
: elem.msRequestFullscreen
? elem.msRequestFullscreen()
: elem.requestFullScreen
? elem.requestFullScreen()
: alert("浏览器不支持全屏");
}
//退出全屏
function exitFullscreen(){
let elem = parent.document;
elem.webkitCancelFullScreen
? elem.webkitCancelFullScreen()
: elem.mozCancelFullScreen
? elem.mozCancelFullScreen()
: elem.cancelFullScreen
? elem.cancelFullScreen()
: elem.msExitFullscreen
? elem.msExitFullscreen()
: elem.exitFullscreen
? elem.exitFullscreen()
: alert("切换失败,可尝试Esc退出");
}
</script>
</body>
</html>
6.window动画(这个是看的别人的,具体我也不咋会使)
window.requestAnimationFrame = window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame ||
window.msRequestAnimationFrame ||
window.oRequestAnimationFrame ||
function (callback) {
//为了使setTimteout的尽可能的接近每秒60帧的效果
window.setTimeout(callback, 1000 / 60);
};
window.cancelAnimationFrame = window.cancelAnimationFrame ||
Window.webkitCancelAnimationFrame ||
window.mozCancelAnimationFrame ||
window.msCancelAnimationFrame ||
window.oCancelAnimationFrame ||
function (id) {
//为了使setTimteout的尽可能的接近每秒60帧的效果
window.clearTimeout(id);
}
let num = 0
let tiemr;
(function animate(){
num++;
console.log(2333,num);
timer = requestAnimationFrame(animate);
if(num > 10){
cancelAnimationFrame(timer);
}
//动画
})();
7.返回范围随机数
function random(lower,upper){
lower = +lower || 0
upper = +upper || 0
return Math.random()*(upper - lower) + lower;
}
console.log(random(0,0.5));
console.log(random(2,1));
console.log(random(-2,-1));
8.禁止右键、选择、复制
['contextmenu', 'selectstart', 'copy'].forEach(function(ev){
document.addEventListener(ev, function(event){
return event.returnValue = false
})
});
9.保留小数点后几位
const round = (n, decimals = 0) => Number(`${Math.round(`${n}e${decimals}`)}e-${decimals}`);
console.log(round(1.345,2)); //1.35
忽略第二个参数会被四舍五入到一个整数
10.统计数组中相同项的个数
let cars = ["BMW",'Benz','Tesla','Tesla','BMW','Toyota'];
let getNumbers = arr => arr.reduce((obj,name) =>{
obj[name] = obj[name] ? ++obj[name] : 1;
return obj;
},{});
console.log('哈哈哈',getNumbers(cars));
11.判断浏览器是否为微信浏览器
//判断浏览器是否为微信
function is_weixin() {
var ua = navigator.userAgent.toLowerCase();
if(ua.match(/MicroMessenger/i) == "micromessenger") {
return true;
} else {
return false;
}
}
今天就先写这么多吧,以后如果还有,再补充!三哥最帅!三哥是最棒的!!!