前言
运用 JS 对数组对象处理总结
文章目录
1. 将数组对象某个属性值拼接成字符串
引用的方法:
Array.map():按照原始数组元素顺序依次处理元素,返回一个新数组
注意:方法不会改变原始数组 不会对空数组进行检测
Array.join():将数组作为字符串返回,元素将由指定的分隔符分隔。默认分隔符是逗号 (,)。
注意:方法不会改变原始数组
实例代码:
var sharedUsers = [
{id: 1, name: 'g'},
{id: 2, name: 'b'},
{id: 3, name: 'h'}
]
// 拼接被分享人名
var sharedUserNames = sharedUsers.map(function(sharedUser, index){
return sharedUser.name
}).join(", ")
// sharedUserNames: 'g, b, h'
2. 向数组对象中对象追加新属性
引用的方法:
Object.assign(target, …sources):用于将所有可枚举属性的值从一个或多个源对象分配到目标对象。它将返回目标对象。
注意:目标对象中的属性具有相同的键,则属性将被源对象中的属性覆盖。
注意:不会在那些source对象值为 null 或 undefined 的时候抛出错误。
实例代码:
//背景: el-table 懒加载回调,向子级数据添加父级数据中的公共属性
...
let childrenItems = []
if (response.items.length > 0) {
// 向子记录中添加父记录内容
response.items.map((item) => {
childrenItems.push(Object.assign({}, item, {
'shareUser': tree.shareUser,
'planCount': 1,
'sharedAtUtc': tree.sharedAtUtc,
'sharedUsers': tree.sharedUsers,
'sharedUserNames': tree.sharedUserNames,
'comment': tree.comment,
'isChildren': true
}))
})
}
resolve(childrenItems)
...
3.对象数组中查找特定属性的对象
引用的方法:
Array find():返回数组中第一个(不检查剩余值)通过测试(测试由函数提供)的元素的值,否则返回 undefined
注意:不对空数组执行该函数 不会改变原始数组
语法:array.find(function(currentValue, index, arr), thisValue)
参数:function(currentValue, index, arr)
描述:必需。为数组中的每个元素运行的函数。
参数:currentValue 必需。当前元素的值。
index 可选。当前元素的数组索引。
arr 可选。当前元素所属的数组对象
thisValue
描述:可选。要传递给函数以用作其 “this” 值的值。
实例代码:
var findObject;
var findObject = arr.find((item) => { return findObject.id === item.id })
参数 thisValue 实例:
Array find()