js数组方法一览

1、at()

将数组的索引作为一个参数传递给一个函数,然后返回该索引对应的数组元素。

const array = [1,2,3,4,5];
console.log(array.at(1)); // 2
console.log(arr.at(-1)); // 5
console.log(arr.at(-2)); // 4
console.log(arr.at(10)); // undefined 超出最大下标,那么就返回undefined,不会报错

2、concat()

合并数组,返回一个新数组。

const array = [1,2,3,4,5];
const arr = ['a','v','d'];
console.log(array.concat(arr)); // [1, 2, 3, 4, 5, 'a', 'v', 'd']
console.log(arr.concat(array)); // ['a', 'v', 'd', 1, 2, 3, 4, 5]

3、reverse()

反转数组项顺序。

const array = [1,2,3,4,5];
console.log(array.reverse()); // [5, 4, 3, 2, 1]

4、join()

将数组的元素组成一个字符串,用参数分隔符进行分割,默认以逗号分隔。

const array = [1,2,3,4,5];
console.log(array.join()); // 1,2,3,4,5
console.log(array.join('')); // 12345
console.log(array.join('-')); // 1-2-3-4-5

// 数组中以某一字符为基准换行
console.log(array.join().replace(/[,]/g,'$&\r\n')); 
// 1,
// 2,
// 3,
// 4,
// 5

5、push()

将参数添加到原数组的末尾,并且返回数组的长度。

const array = [1,2,3,4,5];
console.log(array.push(9)); // 6
console.log(array); // [1, 2, 3, 4, 5, 9]

//遍历取数组中的某一项
const tableDataAdd = [
  { agentCode: '789456', agentName: '张三' },
  { agentCode: '234486', agentName: '李四'},
  { agentCode: '765455', agentName: '王五' },
];
const tableDataAddArr = [];
tableDataAdd.map((item, index) => {
  tableDataAddArr.push(item.agentCode);
})
console.log(tableDataAddArr); // ['789456', '234486', '765455']

6、pop()

数组末尾移除最后一项,返回移除的项。

const array = [1,2,3,4,5];
console.log(array.pop()); // 5
console.log(array); // [1, 2, 3, 4]

7、unshift()

将参数添加到原数组的开头,并且返回数组的长度。

const array = [1,2,3,4,5];
console.log(array.unshift(9)); // 6
console.log(array); // [9, 1, 2, 3, 4, 5]

8、shift()

删除原数组第一次项,返回移除的项。

const array = [1,2,3,4,5];
console.log(array.shift()); // 1
console.log(array); // [2, 3, 4, 5]

9、slice()

截取,原数组不变,返回新的数组。

const array = [1,2,3,4,5];
console.log(array.slice(1)); // [2, 3, 4, 5]
console.log(array.slice(1,3)); // [2, 3] 包括参数1,不包括参数2
console.log(array.slice(-1)); // [5]

10、splice()

改变原数组,可以实现删除,插入,替换操作。

const array = [1,2,3,4,5];
//删除:2个参数,(1,2)从下标1开始删除2个
console.log(array.splice(1,2)); //  [2, 3]
console.log(array); //  [1, 4, 5]

//替换:3个参数,(1,3,5)从下标1开始,长度为3的数组元素替换成5
console.log(array.splice(1,3,5)); //  [2, 3, 4]
console.log(array); // [4, 2, 3, 4, 5][1, 5, 5]

//插入:3个参数,(1,0,5)在下标为1处添加一项5(中间项为0)
console.log(array.splice(1,0,5)); // 
console.log(array); // [1, 5, 2, 3, 4, 5]

11、sort()

默认按字母和升序将值作为字符串进行排序,改变原始数组。

const array = ['D', 'B', 'A', 'C'];
console.log(array.sort()); // ['A', 'B', 'C', 'D']

//用比较函数解决sort排序错误问题
const array = [4, 1, 3, 2, 10];
console.log(array.sort()); // [1, 10, 2, 3, 4]
console.log(array.sort((a, b) => a - b)); // [1, 2, 3, 4, 10]
console.log(array.sort((a, b) => b - a)); // [10, 4, 3, 2, 1]

12、indexOf()

查找参数在数组中是否存在,如果存在返回下标,如果不存在返回-1。

const array = [1, 2, 3, 4, 5];
console.log(array.indexOf(4)); // 3
console.log(array.indexOf(7)); // -1

//判断数组内元素是否存在
const list = [
  { code: '01',name: '张山' },
  { code: '02',name: '李四' },
  { code: '03',name: '王五' },
]
const listFilter = list.filter(optionItem => {
  return ['02'].indexOf(optionItem.code) > -1;
});
console.log(listFilter);// [{code: '02', name: '李四'}]

13、includes()

某个数组是否包含给定的值,返回布尔值。

const array = [1, 2, 3, 4, 5];
console.log(array.includes(3)); // true
console.log(array.includes(7)); // false
console.log(array.includes(3,2)); // true

14、fill()

用静态值填充数组元素。

const array = [1, 2, 3, 4, 5];
console.log(array.fill(4)); // [4, 4, 4, 4, 4]

猜你喜欢

转载自blog.csdn.net/m0_73460278/article/details/128924099