Skip to content

一、reduce使用

js
// 1.参数介绍
array.reduce((pre, cur, index, array) => {
    // pre: 必须,初值值,活上一次的计算结果
    // cur: 必须,当前值
    // index: 当前索引, 可选
    // array: 当前数组。可选,当前元素对象
    // init: 可选。传递给数组的初始值,相当于pre的初始值。
    return 结果
}, init)
// 2.数组对象去重
let list = [
    {
        id: '1',
        name: '张三',
    },
    {
        id: '1',
        name: '张三',
    },
    {
        id: '2',
        name: '李四',
    },
    {
        id: '3',
        name: '王五',
    }
]
let obj = {}
let newList = list.reduce((pre, cur) => {
    obj[cur.id] ? '' : obj[cur.id] = true && pre.push(cur)
    return pre
}, [])
console.log(newList)
// 3.求和
// 3.1 基本类型求和
let list = [1, 2, 3, 4, 5]
let sum = list.reduce((pre, cur) => {
    return pre + cur
}, 0)
console.log(sum)
// 3.2 引用类型求和
let list = [{id: 1, value: 1}, {id: 2, value: 2}, {id: 3, value: 3}]
let sum = list.reduce((pre, cur) => {
    return pre + cur.value
}, 0)
console.log(sum)
// 4.最大值和最小值
let list = [1, 2, 3, 4, 5,5,7,9,0,23,56]
let max = list.reduce((pre, cur) => {
    return Math.max(pre, cur)
})
let min = list.reduce((pre, cur) => {
    return Math.min(pre, cur)
})
// 5.扁平化数组
// 二维转化一维
let list = [[1,2], [3, 4]]
let newList = list.reduce((pre, cur) => {
    return pre.concat(cur)
}, [])
// 多维数组转一维
let list = [1,[2,3,[4,5], [2,3,4,[2,3,4,[4,7,8,9]]]]
function dealList(list) {
    return list.reduce((pre, cur) => {
        return pre.concat(Array.isArray(cur) ? dealList(cur) : cur)
    }, [])
}

// 6.求字符串各个字符出现的次数
const str = 'jordanuuhuussadasdkfiiekdsdfsdfewfk'
const number = str.split('').reduce((pre,cur) => {
    pre[cur] ? pre[cur]++ : pre[cur] = 1
    return pre
},{})
let arr = []
let num = Math.max(...new Set(Object.values(number))
let value
for(let keys in number) {
    if(number[keys] === num) {
        value = keys
        break
    }
}

二、js控制单签元素平滑滚动

js
// 元素显示在页面中间,使用scrollIntoView()方法,
// 获取想要滚动的dom元素
const rollDom = document.getElementById('domId')
// 通过scrollIntoView方法滚动到可视窗口中间 block的值:start、center、end、nearest
rollDom.scrollIntoView({ block: 'center' })
// vue中通过ref获取元素,在进行调用scrollIntoView方法

三、根据身份证获取出生日期

js
export function getBirthFromIdCard(idCard) {
	let birthday = ''
	if(idCard != null && idCard != '') {
		 if (idCard.length == 18) {
			birthday = idCard.substr(6,8)
		}
		birthday = birthday.replace(/(.{4})(.{2})/,"$1-$2-")
	}
	return birthday
}

四、时间戳转yyyy-MM-DD HH:mm:ss

js
export function formatDate(date) {
	var time = new Date(date);
	var YY = time.getFullYear() + '-';
	var MM = (time.getMonth() + 1 < 10 ? '0' + (time.getMonth() + 1) : time.getMonth() + 1) + '-';
	var DD = (time.getDate() < 10 ? '0' + (time.getDate()) : time.getDate());
	var hh = (time.getHours() < 10 ? '0' + time.getHours() : time.getHours()) + ':';
	var mm = (time.getMinutes() < 10 ? '0' + time.getMinutes() : time.getMinutes()) + ':';
	var ss = (time.getSeconds() < 10 ? '0' + time.getSeconds() : time.getSeconds());
	console.log(YY, MM, DD, hh, mm, ss);
	return YY + MM + DD +" "+hh + mm + ss;
}

五、计算时间差

js
export function timeDifference(time1, time2) {
	let dateBegin = new Date(time1.replace(/-/g, "/")) // /将-转化为
	let dateEnd = new Date(time2.replace(/-/g, "/")) // /将-转化为
	//时间差的毫秒数
	let dateDiff = dateEnd.getTime() - dateBegin.getTime();
	//计算出相差天数
	let dayDiff = Math.floor(dateDiff / (24 * 3600 * 1000));
	//计算天数后剩余的毫秒数
	let leave1 = dateDiff%(24*3600*1000)
	//计算出小时数
	let hours = Math.floor(leave1/(3600*1000))
	//计算相差分钟数
	let leave2 = leave1%(3600*1000) //计算小时数后剩余的毫秒数
	let minutes = Math.floor(leave2/(60*1000))//计算相差分钟数
	//计算相差秒数
	let leave3 = leave2%(60*1000) //计算分钟数后剩余的毫秒数
	let seconds = Math.round(leave3/1000)

	let dateTime = dayDiff+"天 "+hours+"小时 "+minutes+" 分钟"+seconds+" 秒"
	return dateTime
	// console.log(" 相差 "+dayDiff+"天 "+hours+"小时 "+minutes+" 分钟"+seconds+" 秒")
	// console.log(dateDiff+"时间差的毫秒数",dayDiff+"计算出相差天数",leave1+"计算天数后剩余的毫秒数"
	// ,hours+"计算出小时数",minutes+"计算相差分钟数",seconds+"计算相差秒数");
}

六、时间秒数差计算

js
export function secondTime(time1, time2) {
	console.log(time1,time2);
	let dateBegin = new Date(time1.replace(/-/g, "/")) // /将-转化为
	let dateEnd = new Date(time2.replace(/-/g, "/")) // /将-转化为
	// let dateBegin = new Date(time1).getTime()
	// let dateEnd = new Date(time2).getTime()
	//时间差的毫秒数
	let dateDiff = dateBegin.getTime() - dateEnd.getTime();
	return dateDiff / 1000
}

七、倒计时

js
export function countDown(value) {
	let secondTime = parseInt(value) // 秒
	let minuteTime = 0 // 分
	let hourTime = 0 // 小时
	let dayTime = 0 // 天
	let result = ''
	if(value < 60) {
		result = secondTime + '秒'
	} else {
		if(secondTime >= 60) {
			// 获取分钟,除以60取整数,得到整数分钟
			minuteTime = parseInt(secondTime / 60)
			// 获取秒数,秒数取佘,得到整数秒数
			secondTime = parseInt(secondTime % 60)
			// 如果分钟大于60,将分钟转换成小时
			if (minuteTime >= 60) {
				// 获取小时,获取分钟除以60,得到整数小时
				hourTime = parseInt(minuteTime / 60)
				// 获取小时后取佘的分,获取分钟除以60取佘的分
				minuteTime = parseInt(minuteTime % 60)
				if (hourTime >= 24) {
					// 获取天数, 获取小时除以24,得到整数天
					dayTime = parseInt(hourTime / 24)
					// 获取小时后取余小时,获取分钟除以24取余的分;
					hourTime = parseInt(hourTime % 24)
				}
			}
		}
	 if (secondTime >= 0) {
			secondTime = parseInt(secondTime) >= 10 ? secondTime : '0' + secondTime
			result = '' + secondTime + '秒'
		}
		if (minuteTime >= 0) {
			minuteTime = parseInt(minuteTime) >= 10 ? minuteTime : '0' + minuteTime
			result = '' + minuteTime + '分' + result
		}
		if (hourTime >= 0) {
			result = '' + parseInt(hourTime) + '小时' + result
		}
		if (dayTime >= 0) {
			result = '' + parseInt(dayTime) + '天' + result
		}
	}
	return result
}

在vue中使用

js
this.finishTimer = setInterval(() => {
	this.conFinishTime = this.$common.countDown(time)
	time--
}, 1000)

八、非空判断

js
if((value??'') !== '') {
	console.log(123123213)
}

九、数组排序

js
let list = [{id:2,name: 'haha'},{id:1,name:'ni'}, {id:6,name:'ta'},{id:4,name:'oo'}]
list.sort((a,b) => a.id - b.id)
// 排序后的数组
0: {id: 1, name: 'ni'}
1: {id: 2, name: 'haha'}
2: {id: 4, name: 'oo'}
3: {id: 6, name: 'ta'}

十、map简化if判断

js
const actions = new Map([
	[1, ['processing', 'IndexPage']],
	[2, ['fail', 'FailPage']],
	[3, ['fail', 'FailPage']],
	[4, ['success', 'SuccessPage']],
	[5, ['cancel', 'CancelPage']],
	['default', ['other', 'Index']]
])
actions.get(1) // ['processing', 'IndexPage']

const actions = new Map([
    ['video','视频上传'],
    ['file','附件上传'],
])
actions.get('video') //  视频上传

Released under the MIT License.