当前位置: 首页 > 工具软件 > JSPOP > 使用案例 >

js 数组操作的push pop shift unshift 等方法

薛涛
2023-12-01

1.push()方法将一个或多个元素添加到数组的末尾,并返回该数组的新长度。

var arr = [1,2,3,4,5]
arr.push(6)//添加一个元素
arr.push(7,8)//可以一次添加多个元素
console.log(arr);

输出: (8) [1, 2, 3, 4, 5, 6, 7, 8]

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

var arr = [1,2,3,4,5]
var ret = arr.pop()
 
console.log("原数组",arr);
console.log("返回值",ret);

原数组 (4) [1, 2, 3, 4]
返回值 5

3.unshift() 方法将一个或多个元素添加到数组的开头,并返回该数组的新长度(该方法修改原有数组)。

var arr = [1,2,3,4,5]
var ret = arr.unshift(9)//添加一个
console.log("原数组",arr);
console.log("返回的长度",ret);

ret = arr.unshift(10,11)//添加多个
console.log("原数组",arr);
console.log("返回的长度",ret);

原数组 (6) [9, 1, 2, 3, 4, 5]
返回的长度 6
原数组 (8) [10, 11, 9, 1, 2, 3, 4, 5]
返回的长度 8

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

var arr = [1,2,3,4,5]
var ret = arr.shift()
console.log("原数组",arr);
console.log("返回值",ret);

原数组 (4) [2, 3, 4, 5]
返回值 1

5. concat() 方法可以连接两个或多个数组,并将新的数组返回。
该方法不会改变原数组。也可以直接在concat()中写入要添加的元素。

let arr1 = ["数值1","数值2"]
let arr2 = ["数值3","数值4"]
let res = arr1.concat(arr2,"数值5")
console.log(res) // 数值1 数值2 数值3 数值4 数值5

6. join() 方法可以将数组转换为一个字符串类型。
该方法不会对原数组产生影响,而是将转换后的字符串作为结果返回。
在join()中可以指定一个字符串作为参数,该字符串会成为数组中元素之间的连接符。
如果不指定连接符,默认使用逗号,作为连接符。

let arr1 = ["数值1","数值2"]
let res = arr1.join()
console.log(typeof res) // 类型为string,不再是object

// 在join()中可以指定一个字符串作为参数,该字符串会成为数组中元素之间的连接符
res = arr1.join("!")
console.log(res) // 数值1!数值2

 7. reverse() 方法用来反转数组(前面的跑后面,后面的跑前面)。 该方法会直接改变原数组

let arr1 = ["数值1","数值2"]
arr1.reverse()
console.log(arr1) // 数值2,数值1

8. sort() 方法可以用来对数组中的元素进行排序。
该方法会直接改变原数组,默认是按Unicode编码进行排序。

let arr2 = ["a","c","e","b","d"]
arr2.sort()
console.log(arr2) // a b c d e

即使对于纯数字的数组,使用sort()排序也会按Unicode编码排序。
所以对数字进行排序时,可能会遇到错误的结果。 

let arr = [2,1,5,33,6,4,7,11,34]
      arr.sort(function(a,b){
          if(a > b){
              return 1
          }else if(a < b){
              return -1
          }else if(a == b){
              return 0
          }
})
console.log(arr)

// 想要简单点也可以这样写
let arr = [2,1,5,33,6,4,7,11,34]
arr.sort(function(a,b){
// return a-b升序排列;return b-a降序排列
	return a - b
})
console.log(arr)

此时我们可以自己来指定排序的规则,可以在sort()中添加一个回调函数,来指定排序规则。
回调函数中需要定义两个形参,浏览器将会分别使用数组中的元素作为实参去调用回调函数。
使用哪个元素调用我们不确定,但肯定的是在数组中a一定是在b的前边。
浏览器会根据回调函数的返回值来决定元素的顺序:
如果返回一个大于0的值(return 1),则元素会交换位置;
如果返回一个小于0的值(return -1),则元素位置不变;
如果返回一个等于0的值(return 0),则认为两个元素相等,也不交换位置。

9. splice()方法

const arr=[1,2,3,4,5,6,7,8]

//截取数组前三个元素
const sliceA=arr.slice(0,3)
console.log('sliceA',sliceA)//得到[1,2,3]


//截取数组后三个元素  slice方法
const sliceArr=arr.slice(-3)
console.log('sliceArr',sliceArr)//得到[6,7,8]
//slice(start,end)表示从下标start开始到下标end(不包括end)进行截取,得到的是一个新数组,不改变原数组。当start为负值时表示从倒数第几个元素开始往后截取,不填end的话就表示从倒数的第几个元素开始截取,一直截取到数组末尾元素


//截取数组后三个元素  splice方法
const spliceArr=arr.splice(-3,3)
console.log('spliceArr',spliceArr)//得到[6,7,8]
//splice()方法有三个参数,分别表示从哪个下标开始,删几个,新元素。可以实现增加、删除、替换数组元素的功能。arr.splice(-3,3)表示从倒数第三个元素开始,删除五个元素。该方法返回值时删除的元素集合,会改变原数组。原数组会变成删除的元素剩下的元素集合

 类似资料: