js截取数组-JS操作对象数组的四种方式，超实用，适用于前后端分离项目

JavaScript中有一种由键值对对象组成的数组，在前后端分离经常用的到，比较常见的场景往往是在字典、get后台数据中。这里介绍四种根据属性值对对象数组中对象键值对的操作方法，覆盖检索、遍历、替换等操作。

01

—

根据属性值检索对象数组

找到对象数组中健名为name的的健值对的键值为solid的那个对象。

算法：

<pre class="code-snippet__js” data-lang=”javascript”>var a = [{ name: "zain", age: 28},{ name: "jack", age: 29},{ name: "sank", age: 30},{ name: "solid", age: 31}];function test() {a.forEach(element => { if (element.name == "solid") { if (a.indexOf(element) > -1) { var i = a.indexOf(element); a.splice(i, 1); } }});}test();console.log(a);

02

—

提取对象数组中部分键值对并只更换键名

初始对象数组OriginArray，提取这个数组中的每一个对象的任意数量的键值对的值，赋予他们新的键名， 然后组成一个新的对象数组。

[    {        oldId:'007', //名，保留健值，操作相当于提取键值        oldName:'小明',        uselessData:'没用的数据' //这个键值对不要了，只提取上面两个    },    {        oldId:'001',        oldName:'小强',        uselessData:'没用的数据'    }]

期望结果：ResultArray

[    {        newUUID:'007',        newName:'小明'    },    {        newUUID:'001',        newName:'小强'    }]

解决方案一：

let resultArray = OriginArray.map((item, index) => {  return Object.assign({}, {    'newUUID': item.oldId,    'newName': item.oldName  })})console.log(resultArray)

解决方案二：

// 将（ 由对象组成的数组） 中的每个对象的（ 其中两个属性（ 键值对）） 的值提取出来， 给他们一个新的键名，// 将（由新键名：旧键值） 组成一个 新的（ 由对象组成的数组）。var oldArray = [{    oldID: '19991231',    oldName: '小明',    uselessData: '没用的数据1',    uselessData2: '没用的数据2',  },  {    oldID: '4531927',    oldName: '小白',    uselessData: '没用的数据1',    uselessData2: '没用的数据2',  },  {    oldID: '19741229',    oldName: '小绿',    uselessData: '没用的数据1',    uselessData2: '没用的数据2',  },  {        oldID: '19740908',    oldName: '小红',    uselessData: '没用的数据1',    uselessData2: '没用的数据2',  },]var NewArray = []// 旧数组有多长，就循环多少次for (let index = 0; index < this.oldArray.length; index++) {  NewArray.push({    NewID: '',    NewName: ''  });  NewArray[index].NewName = oldArray[index].oldName;  NewArray[index].NewID = oldArray[index].oldID;}console.log(NewArray)

03

求对象数组中，其中一个属性的和，应用到Vue中

data（）：

this.LivetableData = [    {        je: '100',//注意要求和的值是字符串类型！        se: 123,    },{        je: 200,        se: '123',    },{        je: '300',        se: 123,    }]

methods（）：

SumSubmit() {//首先将要求和的String类型转换为Number类型for (var i = 0; i < this.LivetableData.length; i++) {  this.LivetableData[i].je = Number(this.LivetableData[i].je)}//然后提取需要的属性let arrnew = this.LivetableData.map((item, index) => {  return Object.assign({}, {    'je': item.je  })})//求和函数function sum(arr) {    var s = 0;    for (var i = 0; i < arr.length; i++) {      s += arr[i];    }    return s;  }//提取对象数组为数组，求和console.log(sum(arrnew.map(item => item.je))) //打印}

04

提取对象数组中的某一个属性组成新数组

初始对象数组：

//初始对象数组arrold = [　　{name: "name1", age: "1"},　　{name: "name2", age: "2"},　　{name: "name3", age: "3"},　　{name: "name4", age: "4"},　　{name: "name5", age: "5"},　　{name: "name6", age: "6"}]//期望数组：arrnew = ["name1","name2","name3","name4","name5","name6"]

解决方案一：

let arr = [];arrold.forEach(e => {     arrnew.push(e.name)})

解决方案二：

let arrnew = arrold.map((obj,index) => {    return obj.name;}).join(",").split(',')

解决方案二的改进：

let arrnew = arrold.map((item,index) => {    return Object.assign({},{'name':item.name})})

关于Object.assign(target，sources)方法：

拷贝源对象且可枚举的属性到目标对象，如果目标对象中的属性具有相同的键，则属性将被源中的属性覆盖。例：

const object1 = { a: 1, b: 2, c: 3 }; // object2: a=1, b=2, c=3, d=5 const object2 = Object.assign({c: 4, d: 5}, object1);

解决方案三：

var arrnew = arrold.map(a => a.name);console.log(arrnew) //仅由键值对的值构成的数组

更多知识欢迎访问个人技术文档:liang14658fox | liang14658fox

限时特惠：本站每日持续更新海量各大内部网赚创业教程，会员可以下载全站资源点击查看详情
站长微信：11082411