数组、对象、字符串常用方法整理

数组常用方法

会修改原数组的方法:
shift、unshift、pop、push、reverse、sort、splice
不会修改原数组的方法:
concat、join、slice、map、filter、some、every、includes、find、findIndex、reduce等
(1)将一个字符串如“20190203”转化成“2019-02-03”?

arr.slice(0,4)+'-'+arr.slice(4,6)+'-'+arr.slice(6)
或者使用dayjs中的dayjs(arr).format('YYYYMMDD')

slice(-2) //表示从数组后方截取两组数据

(2)将字符串如“2019/02/03”转化成“2019-02-03”

arr.split(‘/’).join(-)
或者使用dayjs中的dayjs(arr).format('YYYYMMDD')

(3)往一个数组里面添加一个新数组,并且在vue中可以立即生效

 this.allData = [...arr2,...data];合并展开运算符

(4)将数字数据数据处理成千分位?

value.replace(/(\d)(?=(\d{3})+\.)/g, '$1,')

(5)es6数组去重

let arr = [1,1,3,3,4,4,5]
console.log([...new Set(arr)]);

并且可以粗判断是否存在重复字段,使用new Set().size

let arr=[1,2,1,1,"yang"]
    let setData=new Set(arr);
if(setData.size==arr.length){}

(5)es6数组进阶方法

let arr=[2,4,6,8]
//1、array.map 数组映射,返回映射的数组
let arr1=arr.map(item=>item*2)
//2、array.filter 数组过滤,返回符合条件的元素
let arr2=arr.filter(item=>item>5)
//3、array.find 数组中以某个条件查找,返回值为中符合条件的第一个元素,否则就返回undefined
let arr3=arr.find(item=>item>1)
//4、array.findIndex 数组中以某个条件查找,,返回值为数组中符合条件的第一个元素的索引值,否则就返回-1
let arr4=arr.findIndex(item=>item>1)
//5、arr.includes 判断数组中是否含有某个元素,有返回true,没有false
let arr5=arr.includes(7)
//6、arr.every 判断数组中是否每一个元素都符合条件,只要找到一个不符合条件的,直接返回false,不继续执行了
let arr6=arr.every(item=>item<9)
//7、arr.some 判断数组中是否某一个元素不符合条件,只要找到一个符合条件的,直接返回true,不继续执行了
let arr7=arr.some(item=>item>7)
//8、arr.flat 将二维数组转化成一维数组(只能转化一层)
let arr8=[1,[2,3],[4,5,6]]
let arr9=arr8.flat()
//9、arr.sort((a,b)=>{return a-b}) 数据排序
//a-b为升序排列,b-a是降序排列
let arr=[1,44,3,4,66,7]
console.log(arr.sort((a,b)=>{return a-b}));
let objss = [
    {name: 'B', num: 9},
    {name: 'C', num: 2},
    {name: 'D', num: 4},
    {name: 'B', num: 5},
    {name: 'C', num: 9},
    {name: 'E', num: 6},
    {name: 'F', num: 4},
    {name: 'F', num: 12}
];
objss.sort((star,next)=>{
    return star.num - next.num
    // return next.num - star.num
})
//按照指定顺序排序
let objs = [
  { name: 'A', type: 'fly' },
  { name: 'B', type: 'blur' },
  { name: 'C', type: 'wipe' },
  { name: 'D', type: 'cube' },
  { name: 'B', type: 'zoom' },
  { name: 'C', type: 'cube' },
  { name: 'E', type: 'iris' },
  { name: 'F', type: 'fade' },
  { name: 'F', type: '' }
];
let order = ["wipe", "fly", "iris", "flip", "cube","blur", "fade", 'zoom'];
objs.sort((a, b) => {
  return order.indexOf(a.type) - order.indexOf(b.type)
})

(6)Filter结合include使用

let arrDifferenceCheckboxList=this.tableData.filter((item,index)=>!this.checkboxNotdisplayedCurrentPage.includes(index))

(7)合并展开运算符常用方法

//1、往数组里添加元素
    var items = [1,2,3];
    var newArr  =  [...items,4]
//2、数组、对象
	let arr2=[...(8>6?[3]:[4]),0]
	console.log(arr2);
	let obj1={...(5>3?{a:1}:{b:2}),c:4}
	console.log(obj1);
	//3、解构
	let [a,...b]=[1,2,3,4]
	console.log(a,b);
	//4、拷贝数组
	let m=[26,6,6]
	let n=[...m]
	console.log(n);
	//5、结合Math
	let o=[1,3,5,7,8]
	console.log(Math.max(...o));

(8)将数组转换为字符串

var arr = ['sun', 'moon', 'start']
console.log(arr.toString()) // 'sun, moon, start'

(9)Array.from的主要用途

/** Array.from()的主要用途 */
/** 1、生成一个length的数组 */
  console.log(Array.from({length:10}).map((_,i)=>i)); //[0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
/** 2、数组去重 */
  let list=[1,2,3,3,4,4]
  console.log(Array.from(new Set(list))); //[1, 2, 3, 4]
/** 3、Dom结构的伪数组转化成数组 */
  let span = document.createElement('span');
  let div = document.createElement('div');
  let mainWrap= document.querySelector('.mainWrap')
  mainWrap.append(span);
  mainWrap.append(div);
  console.log(document.querySelector('.mainWrap').children); //HTMLCollection(2) [span, div]
  console.log(Array.from(document.querySelector('.mainWrap').children)); //[span, div]
  Array.from(document.querySelector('.mainWrap').children).forEach((letter) => {
    letter.className = 'addClass';
  });
  console.log(document.querySelector('.mainWrap'));
  // <div class="mainWrap">
  //   <span class="addClass"></span>
  //   <div class="addClass"></div>
  // </span>

对象常用方法

assign、create,entries,fromEntries,hasOwnProperty,values、keys、is等比较常用

(1)判断两个值是否相等(高阶判断,可以判断+0和-0以及NAN与NAN)

let a=100
let b=100
console.log(Object.is(a,b));

(2)取出对象中的键名、键值、键值对,以数组的形式返回

let obj = {name:"aaaa",age:22};
let objKeys = Object.keys(obj);
let objValues = Object.values(obj);
let objItem = Object.entries(obj);
console.log(objKeys);   //["name","age"]
console.log(objValues); //["winne",22]
console.log(objItem);   //[["name","winne"],["age",22]]
console.log(obj.hasOwnProperty('name'));判断对象中是否含有某个键名
let s=[{name:1},{age:100}]
    for (const item of s) {
        console.log(item);
    }//for..of中item直接是每个选项的值

数字常用方法

  Number.isInteger(res) //判断是否为整数
  Number.toFixed() //截取精度从小数点后算为多少的数字,四舍五入
  Number.toPrecision() //截取精度从数字最左侧为多少的数字,四舍五入
  console.log((123456).toPrecision(4)) //1.235e+4
  Number.toLocaleString() //返回这个数字在特定语言环境下的表示字符串
  如:Number(12365).toLocaleString('en-US')

字符串常用方法

let string='hello World'
//1、是否包含字符串
console.log(string.indexOf('he')); //0 返回对应的索引,没有就是-1
string.includes(searchString[, position]) position 可选,从当前字符串的哪个索引位置开始搜寻子字符串,默认值为 0console.log(string.includes('he')); //true 
//2、替换字符串
console.log(string.replace('he','wo')); //wollo World
//替换字符串全部
//可以与正则连用
let val='11'
let myval='112233441121122211144'
let reg=new RegExp(val,'g')
let vals=myval.replace(reg,'')
console.log(string.replaceAll('o','*')); //hell* W*rld,与上面正则匹配全局效果一致

//2、检测字符串是否以指定的前缀开始
console.log(string.startsWith('http://'))  //false
//3、检测字符串是否以指定的后缀
console.log(string.endWith('http://')) //false
//4、str.match()检索字符串里面的值
let mystr="hellorex1 2 3"
console.log(mystr.match("rex")[0]); //检索某个字符串,直接返回这个字符串
console.log(mystr.match(/\d+/g));//检索正则表达式里面的符合值
//5、str.trim()去除空格
console.log(string.trim())
//6、根据正则表达式搜索第一个符合条件的字符索引
let reg=/o/
console.log(string.search(reg))
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值