前端之JavaScript 数组常用方法的基本语法知识

我们常见的Web前端三巨头：HTML、CSS、JS（JavaScript）。
具体请移到【我的专栏】当中的前端——>前端之HTML+CSS；
而在这里我将图文并茂的介绍JS在Vscode中相关功能的运用，希望能够对你们有些帮助。

JavaScript 数组常用方法

帮助我们对数组进行快速操作的方法

1. push()
   语法 : 数组.push( 数据 ) 书写格式例子：arr.push( ‘追加的’ )
   作用 : 将数据追加到数组的末尾
   返回值 : 追加数据后数组最新的长度
2. pop()
   语法 : 数组.pop() 书写格式例子：arr.pop()
   作用 : 删除数组最后一个数据
   返回值 : 被删除的数据
3. unshift()
   语法 : 数组.unshift( 数据 ) 书写格式例子：arr.unshift( ‘添加的’ )
   作用 : 将数据添加到数组的最前
   返回值 : 添加数据后数组最新的长度
4. shift()
   语法 : 数组.shift() 书写格式例子：arr.shift()
   作用 : 删除数组最前一个数据
   返回值 : 被删除的数据
5. reverse()
   语法 : 数组.reverse() 书写格式例子：arr.reverse()
   作用 : 将数组反转
   返回值 : 反转后的数组
6. splice()
   语法 : 数组.splice( 开始索引, 多少个, 要插入的数据 ) 书写格式例子：arr.splice( 1, 1, ‘新来的’ )
   开始索引 : 默认是 0
   多少个 : 默认是 0
   要插入的数据 : 默认是没有
   作用 : 删除数组中若干数据, 并选择是否插入新的数据
   返回值 : 以新数组的形式返回被删除的数据
7. sort()
   语法 :
   数组.sort() 书写格式例子：arr.sort()
   
   数组.sort( function (a, b) { return a - b } ) 书写格式例子：arr.sort( function (a, b) { return a - b } )
   
   数组.sort( function (a, b) { return b - a } ) 书写格式例子：arr.sort( function (a, b) { return b - a } )
   
   作用 : 将数组进行排序
   返回值 : 排序好的新数组
8. join()
   语法 : 数组.join( 连接符 ) 书写格式例子：arr.join( ‘-’ )
   作用 : 将数组用 连接符 连接成为一个 字符串
   返回值 : 连接好的字符串
9. concat()
   语法 : 数组.concat(其他数组) 书写格式例子：arr.concat( [ 500, 600 ] )
   作用 : 将其他数组和数组 拼接 在一起
   返回值 : 拼接好的新数组
10. slice()
    语法 : 数组.slice( 开始索引, 结束索引 ) 书写格式例子：arr.slice(1,3)
    开始索引 : 默认是 0
    结束索引 : 默认是数组长度
    作用 : 截取数组中的某些数据 从1开始截取到3
    返回值 : 以新数组的形式返回截取出来的数据
11. indexOf()
    语法 : 数组.indexOf( 数据 ) 书写格式例子：arr.indexOf( 400 )
    作用 : 查找数据在数组中的索引位置
    返回值 :
    有该数据, 返回第一次出现的索引位置
    没有该数据, 返回-1
12. forEach()
    语法 : 数组.forEach( function ( item, index, arr ) {} )
    作用 : 遍历数组
    返回值 : 无

arr.forEach( function (item, index, arr) = {
    // item 就是数组的每一项
    console.log(item)
    // index 就是索引
    console.log(index)
    // arr 就是原始数组
    console.log(arr)
    // 输出一个分隔线
    console.log(' ----------------- ')
  } )

13. map()
语法 : 数组.map( function ( item, index, arr ) {} )
作用 : 映射数组
返回值 : 映射后的新数组

arr.map( function (item, index, arr) {
	
    // 以 return 的方式书写映射条件
    return item * 10
  } )

14. filter()
    语法 : 数组.filter( function ( item, index, arr ) {} )
    作用 : 过滤数组
    返回值 : 过滤后的新数组

arr.filter( function (item, index, arr) {
    // 以 return 的方式书写过滤条件
    return item > 150
  } )

15. every()
语法 : 数组.every( function ( item, index, arr ) {} )
作用 : 判断数组是不是每一项都满足条件
返回值 : 一个布尔值

arr.every( function (item, index, arr) {
// 以 return 的方式书写条件
    return item > 150
  } )

16. some()
语法 : 数组.some( function ( item, index, arr ) {} )
作用 : 判断数组是不是有 某一项 满足条件
返回值 : 一个 布尔值

arr.some( function (item, index, arr) {
    // 以 return 的方式书写条件
    return item > 150
  } )

总结

总结：

1. push()从后面追加

2. pop()从后面删除

3. unshift()从前面添加

4. shift()从前面删除

5. reverse()反转数组

6. splice()截取并添加

7. sort()数组排序
   直接改变原始数组

8. join()数组连接为字符串

9. concat()拼接数组

10. slice()截取数组

11. indexOf()查找数据在数组中的索引

12. forEach()遍历数组

13. map()映射数组

14. filter()过滤数组

15. every()判断是否全部满足条件

16. some()判断是否有满足条件的项
    不改变原始数组

好了，关于前端之JavaScript 数组常用方法的基本语法知识已经写的非常清楚了，具体实战有什么问题的小伙伴可留言或者私信，看到一定帮您解决，我们别的文章再见。