JS数组常用操作

JS数组常用操作

1、数组添加移除值操作

//push 将一个或者多个数组添加到数据末尾，并返回数组新长度
//unshift 将一个或者多个数组添加到数据开头，并返回数组新长度
//pop 从数组末尾移除并返回一个元素，数组为空则返回undefined
//shift 从数组开头移除并返回一个元素，数组为空则返回undefined
//声明一个空数组,存储数字
    let arr = [];
    //声明一个空数组，存储键值对
    let arr2 = [];
    //for循环填充值
    for (let i = 0; i < 20; i++) {
        //数组arr添加值
        arr.push(i)
        //数组arr2添加值
        arr2.push({ name: 'test' + i, value: i })
    }
//打印结果
    console.log('arr', arr);
    //[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19]
    console.log('arr2', arr2);
	//打印结果
    //[{"name":"test0","value":0},{"name":"test1","value":1},{"name":"test2","value":2},{"name":"test3","value":3},{"name":"test4","value":4},{"name":"test5","value":5},{"name":"test6","value":6},{"name":"test7","value":7},{"name":"test8","value":8},{"name":"test9","value":9},{"name":"test10","value":10},{"name":"test11","value":11},{"name":"test12","value":12},{"name":"test13","value":13},{"name":"test14","value":14},{"name":"test15","value":15},{"name":"test16","value":16},{"name":"test17","value":17},{"name":"test18","value":18},{"name":"test19","value":19}]

2、测试数据

//测试数据
const mapList = [{name: '北京市',buildCount: 24,}, {name: '天津市',buildCount: 23,}, {name: '上海市',buildCount: 22,}, {name: '重庆市',buildCount: 21,}, {name: '河北省',buildCount: 20,}]
const mapList1 = [{name: '北京市',buildCount: 24,}, {name: '天津市',buildCount: 15,}]

3、数组slice方法

//var b = a.slice(2,5);  //截取第三个元素到第六个元素前的所有元素
//提取数据名称并截取数据的一半分左右
let arrSlice =mapList.slice(0, 3)
 console.log('arrSlice', arrSlice)
//结果
//[{"name": "北京市","buildCount": 24},{"name": "天津市","buildCount": 23},{"name": "上海市","buildCount": 22}]

4、数组forEach方法

    //无返回值
    let arrForEach = []
    mapList.forEach(item => { arrForEach.push(item.name) })
    console.log('forEach', arrForEach)
//结果
//["北京市","天津市","上海市","重庆市","河北省"]

5、数组的fileter方法

    //过滤，返回符合数据
    let arrFilter = mapList.filter(item => item.name)
    let arrFilter1 = mapList.filter(item => item.name == "北京市")
    console.log('filter', arrFilter)
    console.log('filter1', arrFilter1)
//结果
//[{"name": "北京市","buildCount": 24}]
//[{ "name": "北京市", "buildCount": 24},{ "name": "天津市", "buildCount": 23},{ "name": "上海市", "buildCount": 22},{ "name": "重庆市", "buildCount": 21},{ "name": "河北省", "buildCount": 20}

6、数组的map方法

    //帅选条件后返回数组,可指定返回字段
    let arrMap = mapList.map(item => item.name)
    console.log('map', arrMap)
//结果
//["北京市","天津市","上海市","重庆市","河北省"]

7、数组的some方法

    //返回的是bool值
    let bools = mapList.some(item => item.name === "北京市")
    console.log('some', bools)
//结果
//true

8、数组的reduce方法

    //累加，第一个参数为0，第二个参数为object
    let num = mapList.reduce((a, b) => {
        return a + b.buildCount
    }, 0)
    console.log('reduce', num)
//结果
//110

9、filter和some综合应用

    //查找两个数组的某个字段值相等数据
    let SomeFilter = mapList.filter(item => { return mapList1.some(x => x.name === item.name) })
    console.log('SomeFilter', SomeFilter)
//结果
//[{"name": "北京市","buildCount": 24},{"name": "天津市","buildCount": 23}]

10、给指定数组长度的数组填充相等的值

let arrNum=mapList.map(item => item.value)
let arrLen=Array(mapList.length).fill(Math.max(...arrNum) * 1.2)
console.log('arrLen',arrLen)
//[28.799999999999997,28.799999999999997,28.799999999999997,28.799999999999997,28.799999999999997]