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

Love The Way You Lie 2021-10-23 07:59 538阅读 0赞

*  **创建**

// 通过字面量(推荐)
    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())