目录
1，动态当前时间（年月日时分秒，星期）
更新 使用 padStart() 添加前缀字符串0
var timer=setInterval(function(){
const time = new Date()
const year = time.getFullYear()
const month = String(time.getMonth()+1).padStart(2, '0')
const day = String(time.getDate()).padStart(2, '0')
const hour = String(time.getHours()).padStart(2, '0')
const min = String(time.getMinutes()).padStart(2, '0')
const second = String(time.getSeconds()).padStart(2, '0')
const week = time.getDay()
const sumTime = year+"年"+month+"月"+day+"日 "+hour+":"+min+":"+second+" 星期"+(week==1?"一":week==2?"二":week==3?"三":week==4?"四":week==5?"五":week==6?"六":"日")
console.log(sumTime);
},1000)
原先
var timer=setInterval(function(){
const time = new Date()
const year = time.getFullYear()
const month = time.getMonth()+1
const day = time.getDate()
const hour = time.getHours()
const min = time.getMinutes()
const second = time.getSeconds()
const week = time.getDay()
const sumTime = year+"年"+(month<10?("0"+month):month)+"月"+(day<10?("0"+day):day)+"日 "+(hour<10?("0"+hour):hour)+":"+(min<10?("0"+min):min)+":"+(second<10?("0"+second):second)+" 星期"+(week==1?"一":week==2?"二":week==3?"三":week==4?"四":week==5?"五":week==6?"六":"日")
},1000)2，颜色
2.1，颜色16进制转rgba
// 颜色16进制转rgba
function hexToRgba(hex, alpha = 1) {
// 判断输入是否合法
if (!/^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$/.test(hex)) {
throw new Error('输入的16进制颜色代码不合法！');
}
// 解析16进制颜色代码
let red = parseInt(hex.slice(1, 3), 16);
let green = parseInt(hex.slice(3, 5), 16);
let blue = parseInt(hex.slice(5, 7), 16);
// 返回RGBA格式的颜色值
return `rgba(${red}, ${green}, ${blue}, ${alpha})`;
}2.2，随机生成16进制颜色
const randomColor = () => {
const letters = '0123456789ABCDEF';
let color = '#';
for (let i = 0; i < 6; i++) {
color += letters[Math.floor(Math.random() * 16)];
}
return color;
}3，数组方法
forEach()
遍历数组
array.forEach((item, index, array)=> {
// item表示数组的每一项
// index表示数组的下标索引
// array表示原数组
// 执行函数
})map()
遍历数组，根据原数组，返回一个长度与之对应的新数组
array.map((item, index, array)=> {
return 值 // 值表示新数组中对应项的
})includes()
判断数组中是否包含某个指定的元素，如果包含返回 true，否则返回 false
array.includes("元素")indexOf()
返回数组中某个元素对应的下标索引 如果有多个 只会返回第一个的下标索引，如果没有返回-1
array.indexOf("元素")some()
如果数组中有一个元素符合条件返回true，否则返回false
array.some((item)=>{
// item判断条件
})
array.some((item)=>{
item.键值 == object.键值
})every()
如果数组中所有的元素都符合条件返回true，否则返回false
array.every((item)=>{
// item判断事件
return item判断事件
})find()
查找数组中是否存在符合条件的元素，如果有返回当前元素值，如果没有返回undefined，只会查找第一个元素，停止遍历
array.find((item)=>{
// item判断事件
return item判断事件
})findIndex()
查找数组中是否存在符合条件的元素，如果有返回当前元素值的下标索引，如果没有返回-1，只会查找第一个元素，停止遍历
arr.findIndex(item=>{
// item判断事件
return item判断事件
})filter()
将数组中符合要求的元素留下，组成一个新的数组并返回
array.filter((item)=>{
// item判断事件
return item判断事件
})reduce()
// arr.reduce((prev, cur, index, arr) => {
//
// }, initialValue)
// prev 即上一次回调函数执行的返回值,必填
// cur 当前元素的值,必填
// index 当前元素下标,可选
// arr 原始数组,可选
// initialValue 初始值,可选
const arr = [1, 2, 3, 4, 5];
// 数组求和，求累乘
const sum = arr.reduce( (prev, cur, index, arr) => {
console.log(prev, cur, index, arr);
return prev + cur; // 求和
// return prev * cur; // 求累乘
});
// 正则匹配 将小写'o'替换为大写'O'
let arr1 = ['hello','World']
arr1 = arr1.reduce( (prev, cur) => {
const replaced = cur.replace(/o/g, 'O');
if (Array.isArray(prev)) {
prev.push(replaced);
return prev;
} else {
return [replaced];
}
},[])
console.log(arr1) // ["hellO","WOrld"]
// 合并数组
let arr2 = [[0], [1], [2]]
arr2 = arr2.reduce( (prev, cur) => {
return prev.concat(cur);
})
console.log(arr2) // [0, 1, 2]
// 修改数组值（正则匹配赋值）
// 需求：去掉对象arr3中键名的后缀ID，并赋值给arr2
let arr3 = {
user: null,
name: null
}
let arr4 = {
userID: 123,
nameID: 456
}
arr3 = Object.entries(arr4).reduce( (prev, [key, value]) => {
const newKey = key.replace(/ID$/, '')
prev[newKey] = value
return prev
},{})
console.log(arr3) // { "user": 123, "name": 456 }for...in
循环遍历，一般用来遍历对象
for(var 变量名 in 对象) {
// 变量名是返回对象的键名
}
但是也能遍历数组 如果遍历数组时候 返回的是下标索引
for(var 变量名 in 数组) {
// 变量名是返回数组的下标索引
}for...of
循环遍历，一般用于遍历数组
for(var 变量 of 数组) {
// 变量是数组的每一个项
}sort()
对包含数字的数组进行排序
array.sort()
// 升序
arr.sort(function (a, b) {
return a - b;
});
// 降序
arr.sort(function (a, b) {
return b - a;
});new Set()
数组去重
array = [...new Set(array)]Object.assign()
数组转对象
Object.assign({},array)
来源：微信公众号：Nodejs技术栈
地址：这份 JavaScript 数组方法速查表分享给您！ (qq.com)
4，对象方法
Object.keys()
获取键名
方法1：
Object.keys(对象) //生成数组
方法2：
for(var 变量名 in 对象){
// 变量名为键名
}Object.values()
获取键值
Object.values(对象) //生成数组Object.entries()
对象转数组
Object.entries(对象)5，正则表达式
去除文字中空格
.replace(/\s+/g,"")去除<span></span>标签
.replace(/<\/?span>/g, '')input输入框只允许输入整数(配合监听input)
.replace(/[^0-9]/g, "")去除大小写字母
.replace(/[a-zA-Z]/g, "")6.ajax相关
1，fetch提交表单数据
场景：前端提交载荷到后端，发送表单数据场景（配置headers不起效果）
// 后端数据库date为dateTime格式
// 错误
fetch("url",
{
method: 'post',
headers: {
"Content-Type": "multipart/form-data"
},
body: JSON.stringify({
data: '2020-01-01'
})
}.then(res=>res.json()).then(item=>{
}.catch(err=>{
}
//正确
const formData = new FormData();
formData.append('date', '2020-01-01');
fetch("url",
{
method: 'post',
body: formData
}
}.then(res=>res.json()).then(item=>{
}.catch(err=>{
}
2，axios提交表单数据
//Axios封装
const formData = new FormData();
formData.append('data', data);
Axios({
url: '',
method: 'post',
data/params: formData,
headers: {
"Content-Type": "multipart/form-data"
}
}).then((res)=>{
}
扫一扫
125
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
