JavaScript html css 前端 push方法 pop方法 unshift方法 shift方法 reverse方法 splice方法 sort方法 join方法 toString方法

数组常用方法

push方法

作用：

• 将数据 追加 到数组的 末尾

• 返回追加后数组的最新长度

语法：

let 数组的最新长度 = 数组.push(数据)

示例：

let arr = ['时迁', '白胜', '雷横']
console.log(arr)
let res = arr.push('王英')
console.log(arr)
console.log(res)

pop方法

作用：

• 删除数组 最后一个 元素

• 返回被删除的数据

语法：

let 被删除的数据 = 数组.pop()

示例：

let arr = ['时迁', '白胜', '雷横']
console.log(arr)
let res = arr.pop()
console.log(arr)
console.log(res)

unshift方法

作用：

• 将数据 添加 到数组的 最前

• 返回 添加数据后数组 最新的长度

语法：

let 数组的最新长度 = 数组.unshift(数据)

示例：

let arr = ['时迁', '白胜', '雷横']
console.log(arr)
let res = arr.unshift('晁盖')
console.log(arr)
console.log(res)

shift方法

作用：

• 删除数组最前一个数据

• 返回被删除的数据

语法：

let 被删除的数据  = 数组.shift()

示例：

let arr = ['时迁', '白胜', '雷横']
console.log(arr)
let res = arr.shift()
console.log(arr)
console.log(res)

reverse方法

作用：

• 将数组反转

• 返回反转后的数组

语法：

let 被反转后的数组  = 数组.reverse()

示例：

let arr = ['时迁', '白胜', '雷横']
console.log(arr)
let res = arr.reverse()
console.log(arr)
console.log(res)

splice方法

作用：

• 删除数组中若干元素，并选择是否 插入 新元素

• 以新数组的形式返回被删除的数据

语法：

let 被删除的数据 = 数组.splice(开始索引, 多少个, 要插入的数据)

示例：

let arr = ['时迁', '白胜', '雷横']
console.log(arr)
let res = arr.splice(0, 2, '吴用', '公孙胜')
console.log(arr)
console.log(res)

sort方法

作用：

• 数据排序

• 返回排好序的数组

语法：

let 排好序的数组 = 数组.sort()   //升序
let 排好序的数组 = 数组.sort( function(a,b){ return a- b} ) //升序
let 排好序的数组 = 数组.sort( function(a,b){ return b- a} ) //降序

示例：

let arr = [67, 61, 78, 98, 84]
console.log(arr)
​
let res1 = arr.sort()   //升序
console.log(res1)
​
let res2 = arr.sort(function(a, b) {  
    return a - b    //升序
})
console.log(res2)
​
let res3 = arr.sort(function(a, b) {
    return b - a    //降序
})
console.log(res3)

join方法

作用：

• 将数组元素用 连接符 连成一个字符串

• 返回连接好的字符串

语法：

let 连接好的字符串 = 数组.join(连接符)

示例：

let arr = ['时迁', '白胜', '雷横']
console.log(arr)
let res = arr.join('-')  
console.log(res)

toString方法

作用：

• 将数组转换为字符串，元素之间用逗号分隔

• 返回连接好的字符串

语法：

let 转换后的字符串 = 数组.toString()

示例：

let arr = ['时迁', '白胜', '雷横']
console.log(arr)
let res = arr.toString()
console.log(res)

concat方法

作用：

• 将两个数组 拼接 在一起

• 返回拼接好的新数组

语法：

let 拼接好的新数组 = 数组.concat(其他数组)

示例：

let arr = ['时迁', '白胜', '雷横']
console.log(arr)
let res = arr.concat(['吕方', '徐宁'])
console.log(arr)
console.log(res)

slice方法

作用：

• 截取数组中的某些元素

• 以新数组的形式返回截取出来的元素

语法：

let 截取出来的元素 = 数组.slice(开始索引，结束索引)

示例：

let arr = ['时迁', '白胜', '雷横', '吕方', '徐宁']
console.log(arr)
​
let res1 = arr.slice(1)
console.log(res1)
​
let res2 = arr.slice(1, 3)
console.log(res2)

indexOf方法

作用：

• 查找 元素 在数组中的索引

• 返回 第一次出现的索引，若没有该元素，返回-1

语法：

let 索引 = 数组.indexOf(元素)

示例：

let arr = ['时迁', '白胜', '雷横']
console.log(arr)
let res1 = arr.indexOf('白胜')
console.log(res1)
let res2 = arr.indexOf('宋江')
console.log(res2)

lastIndexOf方法

作用：

• 从后向前查找 元素 在数组中的索引

• 返回 第一次出现的索引，若没有该元素，返回-1

语法：

let 索引 = 数组.lastIndexOf(元素)

示例：

let arr = ['时迁', '白胜', '雷横']
console.log(arr)
let res1 = arr.lastIndexOf('雷横')
console.log(res1)
let res2 = arr.lastIndexOf('宋江')
console.log(res2)

foreach方法

作用：遍历数组

语法：

数组.foreach( function ( item, index ){  } )

示例：

let arr = ['时迁', '白胜', '雷横']
arr.forEach(function(item, index) {
    console.log(index + ":" + item)
})

map方法

作用：

• 映射数组

• 返回映射后的数组

语法：

let 映射后的数组 = 数组.map( function (item, index) {} )

示例：

let arr = ['时迁', '白胜', '雷横']
let res = arr.map(function(item, index) {
    return '好汉：' + item
})
console.log(arr)
console.log(res)

filter方法

作用：

• 过滤数组

• 返回过滤后的数组

语法：

let 过滤后的数组 = 数组.filter( function( item, index ){})

示例：

let arr = [67, 61, 78, 98, 84]
console.log(arr)
let res = arr.filter(function(item, index) {
    return item >= 70
})
console.log(res)

every方法

作用：

• 判断数组是不是 每一项 都满足条件

• 返回 布尔值

语法：

let 布尔值 =  数组.every( function( item,index ){} )

示例：

let arr = [67, 61, 78, 98, 84]
console.log(arr)
let res = arr.every(function(item, index) {
    return item >= 60
})
console.log(res)

some方法

作用：

• 判断数组是不是 某一项 满足条件

• 返回 布尔值

语法：

let 布尔值 =  数组.some( function( item,index ){} )

示例：

let arr = [67, 61, 78, 98, 84]
console.log(arr)
let res = arr.some(function(item, index) {
    return item >= 80
})
console.log(res)

数组方法小结

方法名	说明
push()	末尾添加
pop()	末尾删除
unshift()	头部添加
shift()	头部删除
reverse()	反转
splice()	删除后选择是否插入新元素
sort()	排序
join()	转字符串
toString()	转字符串
concat()	拼接数组
slice()	截取数组
indexOf()	从头查找元素
lastIndexOf()	从尾查找元素
foreach()	遍历数组
map()	映射数组
filter()	过滤数组
every()	判断是否全部满足条件
some()	判断是否有满足条件