数组一些常用方法
const arr = [1, 2, 3]
// map循环 当item是简单数据类型时,不会修改原数组,复杂类型时会修改
const newArr = arr.map(item => item*2)
console.log(arr, newArr);
// 这种会影响源数据
const arr1 = [{name: '李四', age: 18},{name:'张三', age: 19}]
const newArr1 = arr1.map(item => {
item.age = 2
return item
})
console.log(arr1, newArr1);
// 这种不会
const arr1 = [{name: '李四', age: 18},{name:'张三', age: 19}]
const newArr1 = arr1.map((item) => ({
...item,
age: 2,
}));
console.log(arr1, newArr1);
// some循环数组中是否有这个值, 返回布尔值
const arr2 = [1, 2, 3, 4]
const newArr2 = arr2.some(item => item === 2)
console.log(arr2, newArr2);
const arr3 = [{name: '李四', age: 18},{name:'张三', age: 19}]
const newArr3 = arr3.some(item => item.age === 19)
console.log(arr3, newArr3);
// filter循环 过滤符合条件 返回新数组 若不符合则返回空数组
const arr4 = [1, 2, 3, 4]
const newArr4 = arr4.filter(item => item>=4);
console.log(arr4, newArr4)
// find循环 返回符合条件的那一项 剩余不在继续查找 如果不符合返回undefined
const arr5 = [1, 2, 3, 4]
const newArr5 = arr5.find(item => item > 2);
console.log(arr5, newArr5)
const arr6 = [{name: '李四', age: 18},{name:'张三', age: 19}]
const newArr6 = arr6.find(item => item.name === '李四');
console.log(arr6, newArr6)
// forEach 循环 和for循环差不多
// includes 返回布尔值 判断是否包含
const arr7 = [1, 2, 3, 4]
const newArr7 = arr7.includes(2);
console.log(arr7, newArr7)
const str = 'hello word'
const newStr = str.includes('word')
console.log(str, newStr);
// 数组的的常用操作
const arr8 = [1, 2, 3, 4]
// 前面添加 返回数组长度
const newArr8 = arr8.unshift(9)
// 前面删除 返回被删除的元素
const newArr8_ = arr8.shift()
// 想后面添加 返回数组的长度
const newArr8__ = arr8.push(5)
// 后面删除 返回被删除的元素
const newArr8___ = arr8.pop()
console.log(arr8,newArr8,newArr8_,newArr8__, newArr8___)
// splice数组截取、替换 会改变原数组 返回被截取的元素 splice(start, n) start开始索引位置, n需要截取的个数 若不填写n,则表示从start索引位置开始截取,直到结束 注意:[start, end)区间 splice(-10)表示截取最后10位,若不够10位则全部截取,当start小于0时,第二个参数无效
const arr9 = [1, 2, 3, 4]
const newArr9 = arr9.splice(1)
console.log(arr9, newArr9);
// 替换(本质是先删除,在原索引位置添加)
const arr9_ = [1, 2, 3, 4]
const newArr9_ = arr9_.splice(1,1,5)
console.log(arr9_, newArr9_);
// slice数组、字符串截取 不会改变原数组 返回被截取的元素 slice(start, end) start索引的开始位置, end索引的结束位置 若不填写end,则表示从start索引位置开始截取,直到结束 注意:[start, end)区间 slice(-10)表示截取最后10位,若不够10位则全部截取,当start小于0时,第二个参数无效。当end小于start时,返回空数组(没有截取的空间)
const arr10 = [1, 2, 3, 4]
const newArr10 = arr10.slice(1, 3)
console.log(arr10, newArr10);
const str5 = '1213113'
const newStr5 = str5.slice(0, 3)
console.log(str5, newStr5);
// every 用来检测数组是否每项都符合元素,返回布尔值 不会修改原数组 只要有一项不满足则返回fasle,剩余的不检测
const arr11 = [1, 2, 3, 4]
const newArr11 = arr11.every(item => item > 2)
console.log(arr11, newArr11);
const arr11_ = [{name: '李四', age: 18},{name:'张三', age: 19}]
const newArr11_ = arr11_.every(item => item.name)
console.log(arr11_, newArr11_);
// sort 排序 会修改原数组 b-a 降序 a-b升序
const arr12 = [1, 3, 2, 5, 4]
const newArr12 = arr12.sort((a,b) => b - a)
console.log(arr12, newArr12);
// 根据某属性排序
const arr12_ = [{name: '李四', age: 18},{name:'张三', age: 19}]
const newArr12_ = arr12_.sort((a,b) => b.age - a.age)
console.log(arr12_, newArr12_);
// concat 数组合并 es6拓展运算符 不会修改原数组 返回合并后的数组
const arr13 = [1, 3, 2, 5, 4]
const newArr13 = arr13.concat([9,8,7,6])
console.log(arr13, newArr13);
const arr13_ = [1, 3, 2, 5, 4]
const newArr13_ = [...arr13_,...[9,8,7,6]]
console.log(arr13_, newArr13_);
const arr13__ = [{name: '李四', age: 18},{name:'张三', age: 19}]
const newArr13__ = arr13__.concat({name:'王五', age: 20})
console.log(arr13__, newArr13__);
// join 数组转换字符串 返回拼接好的字符串
const arr14 = [1, 3, 2, 5, 4]
const newArr14 = arr14.join('-')
console.log(arr14, newArr14);
// split 将字符串转为数组
const str1 = '1,2,3,4,5'
const newstr1 = str1.split(',') // newstr1:['1', '2', '3', '4', '5']
const newstr2 = str1.split('-') // newstr2:['1,2,3,4,5'] // 只有一项'1,2,3,4,5'
console.log(str1, newstr1, newstr2);
// toString、toLocalString 也可以将数组转化为字符串
const arr15 = [1, 3, 2, 5, 4]
const newArr15 = arr15.toString() // 只有一项'1,2,3,4,5'
const newArr15_ = arr15.toLocaleString() // 只有一项'1,2,3,4,5'
console.log(arr15, newArr15, newArr15_);
// 多维数组也能转化
const arr16 = [1,[2,3],[4,5],[6,[7,8,[9]]]]
const newArr16 = arr16.toString() // '1,2,3,4,5,6,7,8,9'
const newArr16_ = arr16.toLocaleString() // '1,2,3,4,5,6,7,8,9'
console.log(arr16, newArr16, newArr16_);
const num = 123456
const newNum = num.toString()
const newNum1 = num.toLocaleString()
console.log(num, newNum, newNum1);
// 区别:1:当是4位数以上的时候 toLocaleString会有千位化 toString不会。2:toLocaleString能对时间格式化,toString不会。
// flat 将二维数组转化为一维数组,多维数组需要写成函数形式 Infinit无限,用来扁平化多维数组, 复杂数据类型也能扁平化
const arr17 = [1,[2,3],[4,5],[6]]
const newArr17 = arr17.flat()
const arr17_ = [1,[2,3],[4,5],[6,[4,[7]]]]
const newArr17_ = arr17.flat(Infinity)
console.log(arr17, newArr17,arr17_ , newArr17_ );
// indexOf 查找值所在的位置 若找到则返回索引 若没有找到返回-1 indexOf(start,index) start:需要找的值, index:从哪个索引开始找。默认0。 若找到,则剩余不在查找
const arr18 = [1, 3, 2, 5, 4]
const newArr18 = arr18.indexOf(2, 0)
console.log(arr18, newArr18);
// 若是字符串
const str2 = 'hello word'
const newStr2 = str2.indexOf('o', 2)
console.log(str2, newStr2);
// findIndex 查找出第一个符合条件中的数组元素,所在的索引位置 找不到则返回-1 若找到,则剩余不在继续查找
const arr19 = [1, 3, 2, 5, 4]
const newArr19 = arr19.findIndex(item => item > 2)
console.log(arr19, newArr19);
上传文件 校验文件格式的 避免文件名中包含文件文件后缀检测不出来的bug
const fileType = ["doc", "docx", "xlsx", "xls"];
const name = "xxx.doc文件.doc";
console.log(name.substring(name.lastIndexOf(".") + 1)); // 返回文件后缀名 doc name.substring(name.lastIndexOf(".")) 返回.doc
console.log(fileType.includes(name.substring(name.lastIndexOf(".") + 1))); // 文件中是否包含doc
限制input输入整数
<a-input
v-model="formValue.lv"
placeholder="请输入..."
oninput="value=value.replace(/[^0-9]/g,'')"
/>
// 字符串替换
function replaceSubstring(str, start, end, replacement) {
return str.substring(0, start) + replacement.repeat(end - start) + str.substring(end);
}
let originalStr = "Hello, World!";
let startIndex = 4;
let endIndex = 8;
let replacementChar = '*';
let newStr = replaceSubstring(originalStr, startIndex, endIndex, replacementChar);
console.log(newStr); // 输出: Hell****World!

浙公网安备 33010602011771号