最近被数组给闹折腾了,只因为不太熟悉,特写此篇文章加深影响。

数组有几种处理方式

1、数组A追加数组B上

这样的需求那就是两个一样的数组,一般需求是一个列表拼接到另一个数组,此时只要两数组有相同属性就会合并

this.stepThreeTableData = this.stepThreeTableData.concat(_selectVenMaterData)

2、数组A赋值到数组B

// _selectVenMaterData 是获取的某部分数组
this.stepThreeTableData = _selectVenMaterData

3、数组中添加元素a

// 每条数据循环追加一个QTY
for (var valueSel of _selectData) {
    valueSel.oldQty = valueSel.qty
}

4、重组新数组

// mvValue 定义的新数组,_selectData 有数据的数组
const mvValue = []
      for (var value of _selectData) {
        var materialNum = value.materialNum
        var vendorCode = value.vendorCode
        mvValue.push({ 'materialNum': materialNum, 'vendorCode': vendorCode })
      }

5、两个数组遍历处理处理里面的元素

const venMaterData_bak = res
          // 回显
          for (let i = 0; i < _selectData.length; i++) {
            for (let j = 0; j < venMaterData_bak.length; j++) {
              if (_selectData[i].materialNum === venMaterData_bak[j].materialNum &&
                _selectData[i].vendorCode === this.venMaterValue) {
                // 勾选
                this.$refs.multipleVenMaterTable.toggleRowSelection(venMaterData_bak[j])
                venMaterData_bak[j].qty = _selectData[i].qty
              }
            }
          }

6、得到新数组

// 得到外面table的物料号
      const allMaterStrs = []
          for (var valueSel of _selectData) {
            allMaterStrs.push(valueSel.materialNum)
          }

7、校验数组有重复的元素

checkMater(materStr) {
      var hash = {}
      for (var i in materStr) {
        if (hash[materStr[i]]) {
          return true
        }
        hash[materStr[i]] = true
      }
      return false
    }

8、数组转String类型

// 将数组转化为json字符串
var strify = JSON.stringify(_selectData)

9、去除数组delete带来的逗号拼接成新的数组

constSelect(_selectData) {
      const _selectData_bak = []
      for (var value of _selectData) {
        if (value != null) {
          _selectData_bak.push(value)
        }
      }
      return _selectData_bak
    }

10、对象新添属性和值

const ObjData = {};
    for (let valueSel of mapTypeList) {
        // 列表数据
        ObjData[valueSel.funnel_type] = valueSel.account_num;
    }

11、需求:数组根据时间排序

准备数组

testData: [
        {'vf_factory': 'HY_UAT','mont_time': '2019-12-01 14:11:07','mont_id': 73318},
        {'vf_factory': 'HY_UAT','mont_time': '2019-12-02 14:12:07','mont_id': 73319},
        {'vf_factory': 'OA3_UAT','mont_time': '2019-12-02 14:14:07','mont_id': 73320},
        {'vf_factory': 'SZ_UAT','mont_time': '2019-12-02 14:11:01','mont_id': 73321},
        {'vf_factory': 'OA3_UAT','mont_time': '2019-12-02 14:11:08','mont_id': 73322},
        {'vf_factory': 'SZ_UAT','mont_time': '2019-12-02 14:11:09','mont_id': 73323}
      ],

函数

this.testData.sort((a, b) => {
            return a.mont_time > b.mont_time ? 1 : -1
          })

image.png

12、需求:数组根据大小排序

res.sort(this.getSortFun('desc', 'name'))

// 排序函数
    getSortFun(order, sortBy) {
      var ordAlpah = (order === 'asc') ? '>' : '<'
      var sortFun = new Function('a', 'b', 'return a.' + sortBy + ordAlpah + 'b.' + sortBy + '?1:-1')
      return sortFun
    },

效果:
image.png