js 操作数组内容

js 操作数组内容

数组添加元素(更改原数组)

push和unshift会返回添加了新元素的数组长度
push从数组最后加入,unshift从数组最前面加入

const arr = ["a", "b", "c"];
arr.push("d"); 				//返回4,arr现在是["a","b","c","d"]
arr.unshift("a"); 			//返回5,arr现在是["a","a", "b", "c","d"]

数组删除元素(更改原数组)

pop和shift会返回被删除的元素
pop删除最后的元素,shift删除第一个元素

const arr = ["a", "b", "c"];
arr.pop(); 				//返回"c",arr现在是["a","b"]
arr.shift();            //返回"a",arr现在是["b"]

在数组末尾添加多个元素(返回一个新数组,不改变原数组)

concat方法可以给数组添加多个元素并返回新数组的拷贝

const arr = [1, 2, 3];
arr.concat(4, 5, 6);
console.log(arr);                   //[1,2,3],arr没有改动
let newArr = arr.concat(4, 5, 6);
console.log(newArr);				//[1,2,3,4,5,6]

如果给concat传一些数组作为参数,它会把这些数组拆分再把拆分后的元素添加到原始数组中。

const arr = [1, 2, 3];
let newArr = arr.concat([4, 5, 6]);
console.log(newArr);				//[1,2,3,4,5,6]
const arr = [1, 2, 3];
let newArr = arr.concat([4, 5],6);
console.log(newArr);				//[1,2,3,4,5,6]

需要注意的是,concat只会拆分直接传给它的数组,并不会拆分数组内的数组

const arr = [1, 2, 3];
let newArr = arr.concat([4,[5,6]]);
console.log(newArr);				//[1,2,3,4,[5,6]]

获取子数组(返回一个新数组,不改变原数组)

如果想要从一个数组中获取子数组,可以用slice。slice有两个参数,第一个参数是子数组的起始位置,第二个参数是它的终止位置。

const arr = [1, 2, 3, 4, 5];
let newArr = arr.slice(2, 4);
console.log(newArr);          //[3,4] 从下标2截取到下标4以内,不包括下标4
const arr = [1, 2, 3, 4, 5];
let newArr = arr.slice(2,-1);
console.log(newArr);          //[3,4] 从下标2截取到下标4以内,不包括下标4

如果省略终止参数,则会返回从当前位置到数组末尾的所有内容

const arr = [1, 2, 3, 4, 5];
let newArr = arr.slice(2);
console.log(newArr);         //[3,4,5] 从下标2截取到数组末尾
const arr = [1, 2, 3, 4, 5];
let newArr = arr.slice(-3);
console.log(newArr);         //[3,4,5] 从下标2截取到数组末尾

从任意位置添加或删除元素(更改原数组)

splice允许对当前字符串做修改,可以从任意一个下标增加或删除元素。
这个方法的
第一个参数是起始修改位置的数组下标
第二个参数是需要删除的元素个数(如果不想删除任何元素就传入0
其他参数则是需要添加到数组中的元素
(简单说第一个参数是起始位置,第二个参数从起始位置删除元素的个数,之后参数是加入的元素)

const arr = [1, 5, 7];
console.log(arr.splice(1, 0, 2, 3, 4));  
//返回[],表示没有删除任何元素,数组变为[1,2,3,4,5,7]
const arr = [1, 5, 7];
console.log(arr.splice(1, 2, 2, 3, 4));  
//返回[5,7],表示下标1以及之后的一个元素删除,数组变为[1,2,3,4]
const arr = [1, 5, 7];
arr.splice(1, 0, 2, 3, 4);
console.log(arr);           //[1,2,3,4,5,7]

数组内的分割和替换

ES6引入一个新方法,copyWithin,它会将数组中一串有序的元素复制到数组的另一个位置,复制的同时会覆盖原来数组中的内容。
第一个参数表明要复制到哪里(目标位置)
第二个参数是从哪里开始复制
最后一个(可选的)参数是复制到哪里结束

const arr = [1, 2, 3, 4];
arr.copyWithin(1, 2);
console.log(arr);           //[1,3,4,4]
//1是复制内容到下标为1的位置,2表示从下标为2的位置开始复制,没有写最后一个参数表示复制到复制到末尾
//由于复制的内容是3和4,会覆盖原来下标1和2,下标3没有被覆盖所以依然是4
const arr = [1, 3, 4, 4];
arr.copyWithin(2, 0, 2);
console.log(arr);         //[1,3,1,3]
//第一个2是复制内容到下标为2的位置,0表示从下标为0的位置开始复制,第二个2是复制结束的下标(下标为2的内容不会被复制)
//由于复制的内容是1和3,会覆盖原来下标2和3
const arr = [1,3,1,3];
arr.copyWithin(0, -3, -1);
console.log(arr);        //[3,1,1,3]
//0是复制内容到下标为0的位置,-3表示从下标为1的位置开始复制,-1是复制结束的下标3
//由于复制的内容是3和1,会覆盖原来下标0和1

用指定值填充数组

ES6还有一个很受欢迎的方法,fill。可以任意指定一个起始位置和结束位置,然后填充这部分的数组值。

const arr = new Array(5).fill(1);
console.log(arr);    //[1,1,1,1,1]
const arr = new Array(5).fill(1);
arr.fill('a');
console.log(arr);  //['a','a','a','a','a']
const arr = new Array(5).fill(1);
arr.fill('b',1)    //下标1之后包括下标1填充为'b'
console.log(arr);  //[1,'b','b','b','b']
const arr = new Array(5).fill(1);
arr.fill('b',2,4);  //下标2和下标3填充为'b'
console.log(arr);   //[1,1,'b','b',1];

数组反转和排序

数组反转

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

数组排序

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

sort还允许指定一个排序函数,这个功能不仅方便而且好用。

const arr = [{
    
     name: "Susan" }, {
    
     name: "Tom" }, {
    
     name: "Peter" }, {
    
     name: "Faker" }];
let a = arr.sort((a, b) => {
    
    
    if (a.name < b.name)
        return -1
    if (a.name > b.name)
        return 1
    return 0
});
console.log(a);

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/m0_48546501/article/details/130416352