js 数组的增删改查(数组操作归纳总结)

• 创建

// 通过字面量(推荐)
const arr = ['susan', 'lily', 100, {mom: 'jenny', dad: 'Danny'}]
// 通过构造函数
const arr = new Array({name: 'susan'}, 100, 'susan', [1,2,3])

• 增删

1. push(value): 尾部添加

let sports = ["soccer", "baseball"];
let total = sports.push("football", "swimming");

console.log(sports); // ["soccer", "baseball", "football", "swimming"]
console.log(total);  // 4

注意：数组 push 之后返回的是 length，而不是新的数组

2. unshift(value): 头部添加

let ar = [1, 2, 3];
let b = ar.unshift(4, 5);

console.log(ar);// [4, 5, 1, 2, 3]
console.log(b)//5

注意：数组 unshift 之后返回的是 length，而不是新的数组

3. splice(startIndex, 0, value): 索引为startIndex元素之后添加

arr.splice(startIndex,0,item1,item2…)，从startIndex起删除0个元素，再插入元素item1等（从startIndex位置开始添加）

let arr = [1,2,3,4,5]
arr.splice(0,0,10,20,30)
			
console.log(arr) //[10,20,30,1,2,3,4,5]

数组splice之后返回的是新的数组

4. pop(): 尾部删除

pop()方法从数组中删除最后一个元素，并返回该元素的值。此方法更改数组的长度

let arr = [1,2,3,4,5]
arr.pop(); 

console.log(arr);//[1,2,3,4]
console.log(arr.pop());//4 

5. shift(): 头部删除

shift() 方法从数组中删除第一个元素，并返回该元素的值。此方法更改数组的长度

let arr = [1,2,3,4,5]
arr.shift(); 

console.log(arr);//[2,3,4,5]

6. splice(startIndex, number): 索引为startIndex元素后删除number个元素

arr.splice(startIndex, number)，startIndex为删除起始位置(删除时包括索引)，number为删除元素长度

let arr = [1,2,3,4,5]
arr.splice(0,2)
			
console.log(arr) //[3,4,5]

arr.splice(0) 为删除所有元素

7.slice() ：从已有的数组中返回选定的元素

arrayObject.slice(start,end)：返回一个新的数组，包含从 start 到 end （不包括该元素）的 arrayObject 中的元素

注意，该方法并不会修改原数组，而是返回一个子数组

let arr = ['a', 'b', 'c'];
let b = arr.slice(0,1);
let c = arr.slice(-1);
let v = arr.slice(0);
			
console.log(b)//['a']
console.log(c)//['c']
console.log(v)//['a', 'b', 'c']
console.log(arr)//['a', 'b', 'c']

let arr = [1,2,3,4,5]
arr.splice(0)
			
console.log(arr) //[]

• 合并

concat() 方法用于合并两个或多个数组。此方法不会更改现有数组，而是返回一个新数组

let arr1 = ['a', 'b', 'c'];
let arr2 = ['d', 'e', 'f'];
let arr3 = arr1.concat(arr2);

console.log(arr1);//['a', 'b', 'c']			
console.log(arr3);//["a", "b", "c", "d", "e", "f"]

• 排序

详情查看：https://blog.csdn.net/HuangsTing/article/details/83446526

• 遍历

详情查看：https://blog.csdn.net/HuangsTing/article/details/99730074

• 映射

map(callback): 该方法返回一个新数组,数组的元素为原始数组的元素调用函数处理后的值

let arr = [1,2,3,4,5]
let b = arr.map(function(item){
	return item*item
})
console.log(b);//[1, 4, 9, 16, 25]

• 测试数组元素是否合法

every() 方法用于检测数组所有元素是否都符合指定条件，返回一个布尔值

let arr = [1,2,3,4,5]
let b = arr.every(function(item){
	return item > 3; //检测arr中的元素是否都大于3 
})
console.log(b); //false

some() 方法用于检测数组中是否存在满足指定条件的元素

如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测

let arr = [1,2,3,4,5]
let b = arr.some(function(item){
	return item > 3; //检测arr中是否存在元素大于3 
})
console.log(b);//true

• 过滤

filter():返回一个符合func条件的元素数组

let arr = [
	{ id: 1, text: 'aa', done: true },
	{ id: 2, text: 'bb', done: false }
]
let b = arr.filter(function(item){
	return item.done
})
			
console.log(b); //[{ id: 1, text: 'aa', done: true }]

• 字符串转数组

let str = '黄晓明,陈坤,霍建华'
str.split(',') // ['黄晓明', '陈坤', '霍建华']

• 数组转字符串

let arr = ['黄晓明', '陈坤', '霍建华']
arr.join() // '黄晓明,陈坤,霍建华'
console.log(arr.join())
			
arr.join('>>>') // '黄晓明>>>陈坤>>>霍建华'
console.log(arr.join('>>>'))
		
arr.toString() // '黄晓明,陈坤,霍建华'
console.log(arr.toString())