js 一些处理数据的方法


一、遍历数组arr

1、for循环遍历

for( let i; i < arr.length; i++ ) {
	...
}

2、for of

for( let item of arr ) {
	item:数组的元素
}

keys,values,entries
它们都返回一个遍历器对象,可以用 for…of 循环进行遍历

  • keys – 返回元素索引
  • values – 返回元素本身
  • entries – 返回元素和下标
const arr = ['a', 'b', 'c'];
// keys
for (let index of arr.keys()) {
    console.log(index);
   	// 0
    // 1
    // 2
}

// values
for (let ele of arr.values()) {
    console.log(ele);
    // a
    // b
    // c
}

//entries
for (let [index, ele] of arr.entries()) {
    console.log(idnex, ele);
    // 0 "a"
    // 1 "b"
    // 2 "c"
}

3、forEach遍历

遍历数组,和for循环功能一致

arr.forEach((item,index,self)=>{
	item:数组的每一个元素
	index:元素下标
	self:数组本身
	// 无返回值
})

4、map映射

数组的所有项
语法:

arr.map((item,index,self)=>{
	item:数组的每一个元素
	index:元素的下标
	self:数组本身
	// 有返回值
	// 返回满足某个条件的元素构成的数组
})

例子:

let arr = [1,2,3]
// 完整写法
let res = arr.map((item,index)=>{
	return item* 2
})
// 简写
let res = arr.map(item=>item*2) // 返回数组[2,4,6]
let res = arr.map(item=>item*2).join(',')  // 返回拼接后的字符串'2,4,6'

5、filter

筛选数组;将符合条件的元素放入新数组
例子:找出偶数

let arr = [1,2,3,4,5]
// 完整写法
let res = arr.filter((item,index)=>{
	if(item % 2 == 0){
		return true
	}
})
// 简写
let res = arr.filter(item=>item % 2 == 0) // [2,4]

6、reduce高阶函数(迭代(累加器))

arr.reduce((total,item,index,self)=>{
	total:初始值或计算结束后的返回值
	item:数组的每一个元素
	index:元素的下标
	self:数组本身
	// 有返回值
	// 返回计算结束后的total
},0) // 初始值,不写0 遇到空数组会报错

例子

let arr = [1,2,3,4,5]
// 累加
let res = arr.reduce((prev,cur)=>prev+cur,0) // 15
// 求最大值
let max = arr.reduce((prev,cur)=>prev>cur ? prev: cur,0)  // 5

7、every

判断数组中是否所有元素都符合条件

arr.every((item,inedx, self)=>{
	item:数组的每一个元素
	index:元素的下标
	self:数组本身
	// 有返回值
	// 检测数组里的每一个值是否满足条件,如果有一个值不满足,则返回false,剩余的值不在进行检测
	// 如果所有的值都满足,则返回true	
})

例子

let arr = [1,2,-1]
// 完整写法
let res=arr.every((item,index)=>{
	if(item>0){
		return true
	}
})
// 简写
let res = arr.every(item=>item>0) // false

8、some

判断数组中是否有符合条件的元素;非空判断

arr.some((item,inedx, self)=>{
	item:数组的每一个元素
	index:元素的下标
	self:数组本身
	// 有返回值
	// 检测数组里的每一个值是否满足条件,如果有一个值满足,则返回true,剩余的值不在进行检测
	// 如果所有的值都不满足条件,则返回false
})

例子:

let arr = [1,2,3,4,5,-1]
// 完整写法
let res = arr.some((item,index)=>{
	if(item < 0) {
		return true
	}
})
let res = arr.some(item=>item < 0) // true
let res2 = arr.some(item=>item) // true

let arr2 = []
let res3 = arr.some(item=>item ) // false

9、find(返回符合条件的第一项)

没找到返回undefined,对于空数组,是不会执行的,并且不会改变原数组

const arr = [
    {name: 'tony', age: '20'},
    {name: 'jack', age: '18'}
]
const result1 = arr.find(item => {
    return item.name === 'jack';
})
console.log(result1); // {name: 'jack', age: 18}

const result2 = arr.find(item => {
    return item.namee === 'mary';
})
console.log(result2); // undefined

10、findIndex(返回符合条件的第一项的下标)

没有则返回-1,对于空数组,是不会执行的,并且不会改变原数组

const arr = [
    {name:'tony1',age:'20'},
    {name:'tony2',age:'20'},
    {name:'tony3',age:'20'},
    {name:'jack',age:"30"}, // 只管返回第一个满足条件的
    {name:'jack',age:"100"}
];
const result = arr.findIndex(item => {
    return item.name === 'jack';
})
// 简写
const res = arr.findIndex(item=>item.name === 'jack')
console.log(result); // 3

二、遍历对象obj

1、for in

for( let key in obj ) {
	key:属性名
	obj[key]:属性值
}

2、for of

keys,values,entries
它们都返回一个遍历器对象,可以用 for…of 循环进行遍历

  • keys – 返回元素索引
  • values – 返回元素本身
  • entries – 返回元素和下标
const arr = ['a', 'b', 'c'];
// keys
for (let index of arr.keys()) {
    console.log(index);
   	// 0
    // 1
    // 2
}

// values
for (let ele of arr.values()) {
    console.log(ele);
    // a
    // b
    // c
}

//entries
for (let [index, ele] of arr.entries()) {
    console.log(idnex, ele);
    // 0 "a"
    // 1 "b"
    // 2 "c"
}

3、Object.keys

Object.keys:返回对象自身属性名组成的数组
Object.values:返回对象自身属性值组成的数组
Object.entries

Object.keys(obj).forEach((key)=>{
	key:属性名
	obj[key]:属性值
})

三、合并数组(去重)

const a = [1,2,3];
const b = [1,5,6];
const c = [...new Set([...a,...b])];//[1,2,3,5,6]

const obj1 = {
  a:1,
}
const obj2 = {
  b:1,
}
const obj = {...obj1,...obj2};//{a:1,b:1}

四、数组去重

return Array.from(new Set(arr))

五、取出对象值

const deps = {
    '采购部':[1,2,3],
    '人事部':[5,8,12],
    '行政部':[5,14,79],
    '运输部':[3,64,105],
}
let member = Object.values(deps).flat(Infinity);

六、数组中属性名的替换

const arr= JSON.parse( JSON.stringify(data).replace(/title/g, 'text'), ) //data:数组,title:原属性名,text:新属性名

7、向数组中添加对象

 this.useraddress.push(
 	Object.assign({}, data.list[i], { fulladdress: fulladdress }),
 )

8、截取(splice、slice、substr、substring)

1、splice(数组)(接受负值)

用于删除数组中的指定元素
改变原数组,返回截取的数组
参数:

  • NO1、开始位置的索引
  • NO2、删除的数量(不写则默认到数组的尾部)
  • NO3及以后,一些新的元素,这些元素会自动插入到开始位置索引之后
let arr = ['a','b','c','d','e']
let result = arr.splice(1,2,'111','222')
console.log(result) //  ['b', 'c']
console.log(arr) // ['a', '111', '222', 'd', 'e']

2、slice(数组、字符串)(接受负值)

返回截取的内容,不影响原数组(字符串)
参数:

  • NO1、开始位置的索引包含
  • NO2、结束位置的索引不包含)(不写则默认到尾部)

数组

let arr = ['a','b','c','d','e']
let result = arr.slice(1,2)
console.log(result)  // ['b']
console.log(arr)  // ['a', 'b', 'c', 'd', 'e']

字符串

let str = 'abcde'
let res = str.slice(1,2)
console.log(res) // b
console.log(str) // abcde

3、substring(字符串)(与slice类似,不接受负值)

参数:

  • NO1、开始位置的索引包含
  • NO2、结束位置的索引不包含

4、substr(字符串)(接受负值)

参数:

  • NO1、开始位置索引
  • NO2、截取的长度
let str = 'abcde'
let res = str.substr(3,2)
console.log(res) // de
console.log(str) // abcde

参考文章

1、https://blog.csdn.net/weixin_45042661/article/details/118752244
2、https://blog.csdn.net/ycj1091001986/article/details/123053827

  • 5
    点赞
  • 29
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值