JS数组常用方法

# 数组常用方法

<!-- 帮助我们对数组进行快速操作 -->

1、push()

（1）语法：

数组.push（数据）

（2）作用：

将数据追加到数组的末尾

（3）返回值：

追加数据后数组最新的长度

<!-- 在我们数组的末尾，添加一个或者多个数组元素

可以给数组追加新的元素

push()参数直接写数组元素就可以了

push完毕之后，返回结果是新数组的长度

原数组也会发生变化 -->

eg：

<script>

// 准备一个原始数组

var arr = [100,200,300,400]

// 输出一次

console.log(arr);

// 执行push方法

var res = arr.push('追加的')；

// 输出一次数组

console.log(arr);

// 输出一次返回值

console.log(res); // [100,200,300,400,'追加的']

</script>

2、pop()

（1）语法：

数组.pop()

（2）作用：

删除数组最后一个元素

（3）返回值：

被删除的数据

<!-- pop 是可以删除数组最后一个元素，记住一次只能删除一个

pop()没有参数

pop完毕之后，返回结果是删除的那个元素

原数组也会发生变化 -->

eg：

<script>

// 准备一个原始数组

var arr = [100,200,300,400]

// 输出一次

console.log(arr);

// 执行pop方法

var res = arr.pop()；

// 输出一次数组

console.log(arr);

// 输出一次返回值

console.log(res);

</script>

3、unshift()

（1）语法：

数组.unshift（数据）

（2）作用：

将数据添加到数组的最前

（3）返回值：

添加数据后数组的最新长度

<!-- 在数组开头添加一个或者多个数组元素

unshift()参数直接写数组元素就可以了

unshift完毕之后，返回结果是新数组的长度

原数组也会发生变化 -->

eg：

<script>

// 准备一个原始数组

var arr = [100,200,300,400]

// 输出一次

console.log(arr);

// 执行unshift方法

var res = arr.unshift('添加的')；

// 输出一次数组

console.log(arr);

// 输出一次返回值

console.log(res); // ['添加的',100,200,300,400]

</script>

4、shift()

（1）语法：

数组.shift()

（2）作用：

删除数组最前一个元素

（3）返回值：

被删除的数据

<!-- shift是可以删除数组的第一个元素，记住一次只能删除一个元素

shift()没有参数

shift完毕之后，返回的结果是删除的那个元素

原数组也会发生变化 -->

eg：

<script>

// 准备一个原始数组

var arr = [100,200,300,400]

// 输出一次

console.log(arr);

// 执行shift方法

var res = arr.shift()；

// 输出一次数组

console.log(arr);

// 输出一次返回值

console.log(res); // [200,300,400]

</script>

5、reverse()

（1）语法：

数组.reverse()

（2）作用：

将数组反转

（3）返回值：

反转后的数组

eg：

<script>

// 准备一个原始数组

var arr = [100,200,300,400]

// 输出一次

console.log(arr);

// 执行reverse方法

var res = arr.reverse()；

// 输出一次数组

console.log(arr);

// 输出一次返回值

console.log(res); // [400,300,200,100]

</script>

6、splice()

（1）语法：

数组.splice(开始索引,多少个,要插入的数据)

<!-- 开始索引：默认是0 多少个：默认是0 要插入的数据：默认是没有 -->

（2）作用：

删除数组中若干数据，并选择是否插入新的数据

（3）返回值：

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

eg：

<script>

// 准备一个原始数组

var arr = [100,200,300,400]

// 输出一次

console.log(arr);

// 执行slice方法

var res = arr.splice(1,1)；

// 输出一次数组

console.log(arr); // [100,200,300,400]

// 输出一次返回值

console.log(res); // [200]

</script>

7、sort()

（1）语法：

数组.sort()

数组.sort( function (a,b) {return a- b} )

数组.sort( function (a,b) {return b- a} )

（2）作用：

将数组排序

（3）返回值：

排序好的新数组

eg：

<script>

// 准备一个原始数组

var arr = [11,1，2,13,45,32,2]

// 输出一次

console.log(arr);

// 执行sort方法

var res = arr.sort()；

// 输出一次数组

console.log(arr); // [1,11,13,2,22,32,45]

// 输出一次返回值

console.log(res); // [1,11,13,2,22,32,45]

</script>

8、join()

（1）语法：

数组.join(连接符)

（2）作用;

将数组用连接符链接成为一个字符串

（3）返回值：

连接好的字符串

eg：

<script>

// 准备一个原始数组

var arr = [100,200,300,400]

// 输出一次

console.log(arr);

// 执行join方法

var res = arr.join('-')；

// 输出一次数组

console.log(arr);

// 输出一次返回值

console.log(res); // 100-200-300-400

</script>

9、concat()

（1）语法：

数组.concat(其他数组)

（2）作用：

将其他数组和数组拼接起来

（3）返回值：

拼接好的新数组

eg：

<script>

// 准备一个原始数组

var arr = [100,200,300,400]

// 输出一次

console.log(arr);

// 执行concat方法

var res = arr.concat([500,600])；

// 输出一次数组

console.log(arr);

// 输出一次返回值

console.log(res); // ['添加的',100,200,300,400,500,600]

</script>

10、slice()

（1）语法：

数组.slice(开始索引，结束索引)

<!-- 开始索引：默认是0 结束索引：默认是数组长度 -->

（2）作用：

截取数组中的某些数据

（3）返回值：

以新数组的形式返回截取出来的数据

eg：

<script>

// 准备一个原始数组

var arr = [100,200,300,400]

// 输出一次

console.log(arr);

// 执行slice方法

var res = arr.slice(1)；

// 输出一次数组

console.log(arr);

// 输出一次返回值

console.log(res); // [200,300,400,500,600]

</script>

11、indexOf()

（1）语法：

数组.indexOf(数据)

（2）作用：

查找数据在数组中的索引位置

（3）返回值：

有该数据，返回第一次出现的索引位置

没有该数据，返回-1

eg：

<script>

// 准备一个原始数组

var arr = [100,200,300,400]

// 输出一次

console.log(arr);

// 执行indexOf方法

var res = arr.indexOf(500)；

// 输出一次数组

console.log(arr);

// 输出一次返回值

console.log(res); // -1

</script>

12、forEach()

（1）语法：

数组.forEach( fuction (item,index,arr){})

（2）作用：

遍历数组

eg：

<script>

// 准备一个原始数组

var arr = [100,200,300,400]

// 输出一次

console.log(arr);

// 执行forEach方法

var res = arr.forEach( fuction (item,index,arr){

// item 就是数组的每一项

console.log(item);

// index 就是索引

console.log(index);

// arr就是原始数组

console.log(arr);

// 输出一个分割线

console.log('-------------');

} )

</script>

13、map()

（1）语法：

数组.map( fuction (item,index,arr){})

（2）作用：

映射数组

（3）返回值：

映射后的新数组

eg：

<script>

// 准备一个原始数组

var arr = [100,200,300,400]

// 输出一次

console.log(arr);

// 执行map方法

var res = arr.map( fuction (item,index,arr){

// 以return的方式书写映射条件

return item * 10

} )

// 输出返回值

console.log(res);

</script>

14、filter()

（1）语法：

数组.filter( fuction (item,index,arr){})

（2）作用：

过滤数组

（3）返回值：

过滤后的新数组

eg：

<script>

// 准备一个原始数组

var arr = [100,200,300,400]

// 输出一次

console.log(arr);

// 执行filter方法

var res = arr.filter( fuction (item,index,arr){

// 以return的方式书写过滤条件

return item > 10

} )

console.log(res);

</script>

15、every()

（1）语法：

数组.every( fuction (item,index,arr){})

（2）作用：

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

（3）返回值：

一个布尔值

eg：

<script>

// 准备一个原始数组

var arr = [100,200,300,400]

// 输出一次

console.log(arr);

// 执行every方法

var res = arr.every( fuction (item,index,arr){

// 以return的方式书写过滤条件

return item > 150

} )

console.log(res); // false

</script>

16、some()

（1）语法：

数组.some( fuction (item,index,arr){})

（2）作用：

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

（3）返回值：

一个布尔值

eg：

<script>

// 准备一个原始数组

var arr = [100,200,300,400]

// 输出一次

console.log(arr);

// 执行filter方法

var res = arr.filter( fuction (item,index,arr){

// 以return的方式书写过滤条件

return item > 150

} )

console.log(res); // true

</script>