js 项目中常用方法总结(持续更新)

本文提供了一系列实用的JavaScript代码片段,包括数字格式化、时间戳转换、字符串参数解析、深拷贝、数组去重、身份证验证、格式检测、事件兼容性写法、随机数生成、cookie操作、iOS键盘bug修复等,覆盖了日常开发中常见的需求。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1、//数字加0转换

  formatNumber: function(n) {
    n = n.toString()
    return n[1] ? n : '0' + n
  },

2、时间戳的转换

//时间戳转换
formatTime: function(date) {
	var date=new Date(date);
	var year = date.getFullYear()
	var month = date.getMonth() + 1
	var day = date.getDate()
  
	var hour = date.getHours()
	var minute = date.getMinutes()
	var second = date.getSeconds()
  
  
	return [year, month, day].map(this.formatNumber).join('-') + ' ' + [hour, minute, second].map(this.formatNumber).join(':')
},

3、解析字符串中的参数

getQueryVariable(variable)
    {
        if (!window.location.hash.split("?")[1]) return false;
        let query = window.location.hash.split("?")[1];
        let vars = query.split("&");
        for (let i = 0;i < vars.length; i++) {
            let pair = vars[i].split("=");
            if(pair[0] == variable){return unescape(pair[1]);}
            console.log(pair,'pair')
        }
        return(false);
    },

4、深拷贝

copy(obj) {
    if(obj == null) return
	var dst = obj.constructor === Array ? [] : {};
	for (var prop in obj) {
	if (obj.hasOwnProperty(prop)) {
		if(typeof obj[prop] == 'object'){
		dst[prop] = this.copy(obj[prop])
		}else{
		dst[prop] = obj[prop];
		}
	}
	}
	return dst;
},
//(2)比较粗鲁的复制
JSON.parse(JSON.stringify(_arr));

5、数组去重 和 字符串里面的重复字符

// 去除数组的重复成员
[...new Set(array)]

//去除字符串里面的重复字符。
[...new Set('ababbc')].join('')

6、身份证验证

 //身份证验证
  checkidCard(card) {
    var code = card.toUpperCase();
    var city = {
      11: "北京",
      12: "天津",
      13: "河北",
      14: "山西",
      15: "内蒙古",
      21: "辽宁",
      22: "吉林",
      23: "黑龙江 ",
      31: "上海",
      32: "江苏",
      33: "浙江",
      34: "安徽",
      35: "福建",
      36: "江西",
      37: "山东",
      41: "河南",
      42: "湖北 ",
      43: "湖南",
      44: "广东",
      45: "广西",
      46: "海南",
      50: "重庆",
      51: "四川",
      52: "贵州",
      53: "云南",
      54: "西藏 ",
      61: "陕西",
      62: "甘肃",
      63: "青海",
      64: "宁夏",
      65: "新疆",
      71: "台湾",
      81: "香港",
      82: "澳门",
      91: "国外 "
    };
    var tip = "";
    var pass = true;

    if (!code ||
      !/^[1-9][0-9]{5}(19[0-9]{2}|200[0-9]|2010)(0[1-9]|1[0-2])(0[1-9]|[12][0-9]|3[01])[0-9]{3}[0-9xX]$/i
      .test(code)) {
      tip = "身份证号格式错误";
      pass = false;
    } else if (!city[code.substr(0, 2)]) {
      tip = "地址编码错误";
      pass = false;
    } else {
      //18位身份证需要验证最后一位校验位
      if (code.length == 18) {
        code = code.split('');
        //∑(ai×Wi)(mod 11)
        //加权因子
        var factor = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8,
          4, 2
        ];
        //校验位
        var parity = [1, 0, 'X', 9, 8, 7, 6, 5, 4, 3, 2];
        var sum = 0;
        var ai = 0;
        var wi = 0;
        for (var i = 0; i < 17; i++) {
          ai = code[i];
          wi = factor[i];
          sum += ai * wi;
        }
        var last = parity[sum % 11];
        if (parity[sum % 11] != code[17]) {
          //tip = "校验位错误";
          pass = false;
        }
      }
    }
    if (!pass) {
      return false;
    } else {
      return true;
    }
  },

7、检测常用格式,邮箱,手机号,名字,大写,小写

function checkType (str, type) {
    switch (type) {
        case 'email':
            return /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/.test(str);
        case 'phone':
            return /^1[3|4|5|7|8][0-9]{9}$/.test(str);
        case 'tel':
            return /^(0\d{2,3}-\d{7,8})(-\d{1,4})?$/.test(str);
        case 'number':
            return /^[0-9]$/.test(str);
        case 'english':
            return /^[a-zA-Z]+$/.test(str);
        case 'chinese':
            return /^[\u4E00-\u9FA5]+$/.test(str);
        case 'lower':
            return /^[a-z]+$/.test(str);
        case 'upper':
            return /^[A-Z]+$/.test(str);
        default :
            return true;
    }
}

8、js 事件的兼容性写法

var EventUtil = {
    addHandler:function(element,type,handler){
        if(element.addEventListener){
            element.addEventListener(type,handler,false)
        }else if(element.attachEvent){
            element.attachEvent("on"+type, handler)
        }else{
            element['on'+type] = handler
        }
    },
    removeHandler:function(element,type,handler){
        if(element.removeHandler){
            element.removeEventListener(type,handler,false)
        }else if(element.detachEvent){
            element.detachEvent(type,handler)
        }else{
            element["on"+type] = null
        }
    },
    getEvent:function (event) {
        return event ? event : window.event
    },
    getCharCode:function(event){
        if(typeof event.charCode == 'number' && event.charCode!=0){
            return event.charCode
        }else{
            return event.keyCode
        }
    },
    preventDefault:function(event){
        if(event.preventDefault){
            event.preventDefault()
        }else{
            event.returnValue = false
        }
    },
}

9、生成随机数

function randombetween(min, max){
    return min + (Math.random() * (max-min +1));
}

10、操作cookie

let $cookie = {

set(cname, cvalue, ctime = 24, domain = null, path = '/') {
    let data = `${cname}=${cvalue}`;
    let cpath = `path=${path}`;
    let cdomain = `domain=${domain}`;

    let time = new Date();
    time.setTime(time.getTime() + (ctime * 1000 * 60 * 60));
    let expires = `expires=${time.toGMTString()}`

    let cookie = `${data};${expires};${cpath};${domain == null ? '' : cdomain}`
    document.cookie = cookie;
},
/**
 * 获取cookie
 * @param {string} cname 要获取的coolie名
 * @returns {string || null} 返回找到的cookie值,如果找不到,返回null
 */
get(cname) {
    let cookies = document.cookie.split(';');
    let cookieData = {};
    cookies.forEach(v => {
        let arr = v.trim().split('=');
        cookieData[arr[0]] = arr[1];
    });

    let value = cookieData[cname]

    if (value) {
        return value;
    } else {
        return null;
    }
},
/**
 * 删除cookie
 * @param {string} cname 要删除的cookie名
 * @param {string} domain 要删除cookie的域名
 * @param {string} path 要删除cookie的路径
 * 
 * ! tips: 设置域名是如果没有传域名和路径,删除时可以不传。 设置时传了,删除时就要传一模一样的,否则无法删除
 */
del(cname, domain = null, path = '/') {
    let data = `${cname}=''`;
    let expires = 'expires=Thu, 18 Dec 1998 12:00:00 GM';
    let cpath = `path=${path}`;
    let cdomain = `domain=${domain}`;
    let cookie = `${data};${expires};${cpath};${domain == null ? '' : cdomain}`
    document.cookie = cookie;
}

}

11、iOS升级后 手机端键盘不能复位bug

Vue.directive('blur', function (el) {
    el.addEventListener('blur',function(event){
        window.scrollTo(0,0);
    })
});
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值