js平时有可能用到的的函数工具-上

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;
                }
            }

猜你喜欢

转载自blog.csdn.net/wenmin1987/article/details/108962817
今日推荐