Javascript——数组数据类型(Array)

  • 认识数组

    数组是使用一个单独的变量名来存储一系列的值

  • 数组的创建

    • 字面量创建方式:var 数组名 = []
    • 内置构造函数创建方式:var 数组名 = new Array()
  • 两种创建数组方式的区别

    • 字面量创建方式,在[]中直接书写数据即可,多个数据时,使用,进行分隔
    • 内置构造函数创建方式,new Array()时,表示创建一个空数组,new Array(正整数)时,表示设置数组的长度,new Array(数据1,数据2,···)时,表示数组中存入的数据
  • 数组的length属性

    • 数组的length属性表示一个数组的长度,可通过length属性获取和设置数组的长度
    • 当数组原来的长度比设置后的长度小时,后面的数组将被删除
    • 当数组的数据添加比length+1或+n位置时,中间位置索引会使用空补齐
    • 伪数组也可以使用length属性
    // 获取一个数组的长度
    var lenth = 数组名.length
    // 设置一个数组的长度
    数组名.length = 整数
  • 数组数据的排列方式

    • 数组按照索引进行排列,索引从 0 开始,依次递增,最后一位数组的索引为 数组名.length - 1
    • 通过数组名[索引]可获取或修改对应索引上的数据,如果索引位置没有数据则得到undefined,修改时,如果索引位置大于length+1时,中间位置用空补齐
  • 遍历数组数据

    • 遍历方式一:
    var arr=[1,2,3,4,5,6,7,8,9]
    for(var i=0;i
    • 遍历方式二:
    // key变量表示一个数组所在的索引
    var arr=[1,2,3,4,5,6,7,8,9]
    for(var key in arr){
      console.log(arr[key])
    }
  • 数组常用的操作方法

  • 伪数组无法使用数组的操作方法
  • 四类基本操作方法

    1. 在原有数组的尾部进行添加数据
    语法:数组名.push(数据1,数据2,···)
    返回值:添加数据后数组的新长度
    使用:`arr.push(1,2,3)
    1. 删除原有数组的最后一个数据
    语法:`数组名.pop()`
    返回值:被删除的那个数据
    使用:`arr.pop()` 
    1. 在原有数组的头部进行添加数据
    语法:`数组名.unshift(数据1,数据2,···)`
    返回值:添加数据后数组的新长度
    使用:`arr.unshift(1,2,3)`
    1. 删除原有数组的第一个数据
    语法:`数组名.shift()`
    返回值:被删除的那个数据
    使用:`arr.shift()`
  • ES 3.0 操作方法

    1. 数组数据反转
    语法:数组名.reverse()
    返回值:数据反转后的数组
    使用:arr.reverse()
    1. 数组数据排序
      语法①:数组名.sort()
      排序方式:以每个数据中每一位的ASCII码进行排序
      返回值:排序后的数组
      使用: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})
    1. 截取数组数据
      语法①:数组名.splice(开始索引, 截取个数)
      参数:参数二不写表示从开始索引截取到数组末尾
      返回值:截取的那一段数据的数组
      使用:arr.splice(0,5)
    
      语法②:数组名.splice(开始索引, 截取个数, 数据1, 数据2···)
      参数:从都三个参数为对截取区间的数据进行修改
      返回值:截取的那一段数据的数组
      使用:arr.splice(0,1,1)
    1. 在原数组末尾进行追加数据
      语法:数组名.concat(数组, 数据···)
      参数:参数可以是一个数组,也可以是多个数据
      返回值:追加数据后的数组
      使用:arr.concat(0,1,1,arr2)
    1. 获取数组中某一段数据
      语法:数组名.slice(开始索引, 结束索引)
      参数:参数1不写表示从数组开头位置开始,参数2不写表示到数组末尾结束,参数写负数表示从 length + 负整数 的位置,区间数据包括开始,不包括结束
      返回值:获取区间数据的数组
      使用:arr.slice(0,5)
    1. 将数组内的数据使用符号进行拼接
      语法:数组名.join('连接符号')
      参数:当参数为空时,默认使用逗号进行拼接
      返回值:数组数据拼接后的字符串内容
      使用:arr.join('-')
  • ES 5.0 操作方法

    1. 从数组开头向末尾进行查找指定数据所在的索引位置
      找到第一个数据后不再继续向后查找,下一次继续从0索引进行开始查找
      语法①:数组名.indexOf(数据)
      返回值:数据存在返回所在的索引,数据不存在返回 -1
      使用:arr.indexOf(120)
    
      语法②:数组名.indexOf(数据, 开始查找索引)
      返回值:数据存在返回所在的索引,数据不存在返回 -1
      使用:arr.indexOf(120,5)
    1. 从数组的末尾向前进行查找指定数据所在的索引位置
      找到第一个数据后不再继续向后查找,下一次继续从0索引进行开始查找
      找到第一个数据后不再继续向后查找,下一次继续从0索引进行开始查找
      语法①:数组名.indexOf(数据)
      返回值:数据存在返回所在的索引,数据不存在返回 -1
      使用:arr.indexOf(120)
    
      语法②:数组名.indexOf(数据, 开始查找索引)
      返回值:数据存在返回所在的索引,数据不存在返回 -1
      使用:arr.indexOf(120,5)
    1. 遍历数组方法:用于替代 for 语句循环遍历数组
      语法:数组名.forEach(function(item,index, arr){ 执行代码 })
      参数:item参数表示数组中每一个数组,index参数表示数组中每一个 item 的下标(选填参数),arr参数表示原始数组(选填参数)
      返回值:无返回值
      使用:arr.forEach(function(item,index,arr){
              console.log(item,index,arr)
          })
    1. 数组数据的映射:将原数组数据复制一份到一个新数组中
      语法:数组名.map(function(item,index, arr){ 执行代码 })
      参数:item参数表示数组中每一个数组,index参数表示数组中每一个 item 的下标(选填参数),arr参数表示原始数组(选填参数)
      返回值:与原数组内容相同的一个新数组
      使用:var arr2 = arr.map(function(item,index,arr){
              return item
          })
    1. 数组数据过滤器:不满足条件的数据会被过滤掉
      语法:数组名.filter(function(item,index, arr){ 执行代码 })
      参数:item参数表示数组中每一个数组,index参数表示数组中每一个 item 的下标(选填参数),arr参数表示原始数组(选填参数)
      返回值:存储满足条件的数据的一个新数组
      使用:var arr2 = arr.filter(function(item,index,arr){
              return item >120
          })
    1. 判断数组内数据是否全部满足条件
      语法:数组名.every(function(item,index,arr){ 执行代码 })
      参数:item参数表示数组中每一个数组,index参数表示数组中每一个 item 的下标(选填参数),arr参数表示原始数组(选填参数)
      返回值:数组中数据全部满足条件返回 true,有任意数据不满足返回 false
      使用:var res = arr.every(function(item,index,arr){
              return item >120
          })
    1. 判断数组中是否存在满足条件的数据
    语法:数组名.some(function(item,index,arr){ 执行代码 })
      参数:item参数表示数组中每一个数组,index参数表示数组中每一个 item 的下标(选填参数),arr参数表示原始数组(选填参数)
      返回值:数组中数据中任意满足条件返回 true,有全部数据不满足返回 false
      使用:var res = arr.some(function(item,index,arr){
              return item >10000
          })
  • ES 6.0 操作语法

    1. 将数组中一部分数据替换另一部分数据
      语法:数组名.copyWithin(填充目标位置, 填充内容开始位置, 填充内容结束位置)
      参数:参数一表示开始被替换的位置,参数二表示当作替换内容开始位置(默认为0),参数三表示当作替换内容结束位置(默认为数组末尾)
      返回值:进行替换内容后的新数组
      使用:var arr2 = arr.copyWithin(2,5,8)
    1. 数组内容填充
      语法:数组名.fill(填充内容, 填充开始位置, 填充结束位置)
      参数:只写一个参数时,表示全部进行填充,参数三不写时表示填充至数组末尾
      注意点:数组必须有长度
      返回值:填充好内容后的数组
      使用:arr.fill(2,5,8)
    1. 判断一个数据是否在数组中
      语法:数组名.includes(数据)
      返回值:数组中存在该数据返回 true ,数组中不存在该数据返回 false
      使用:arr.includes(100)
    1. 多维数组扁平化
      语法:数组名.flat(扁平层数)
      参数:需要扁平几层就写几,Infinity表示有多少层扁平多少层
      返回值:扁平化之后的数组
      使用:arr.flat(Infinity)
    1. 映射数组后扁平多维数组(只能扁平一层)
      语法:数组名.flatMap(function(item, index, arr){ 执行代码 })
      参数:item参数表示数组中每一个数组,index参数表示数组中每一个 item 的下标(选填参数),arr参数表示原始数组(选填参数)
      返回值:映射数组扁平后的新数组
      使用:var arr2 = arr.flatMap(function(item,index,arr){
              return item
          })
    1. 查找数组中满足条件的数据
      语法:数组名.find(function(item){ 执行代码 })
      参数:item 参数表示数组中的每一个数据
      返回值:当数组中的元素在测试条件时返回true,返回符合条件的元素,之后的值不会再执行函数;如果没有符合条件的元素则返回undefined
      使用:var res=arr.find(function(item){
              return item>100
          })
    1. 查找数组中满足条件的数据所在的下标
      语法:数组名.findIndex(function(item){ 执行代码 })
      参数:item 参数表示数组中的每一个数据
      返回值:当数组中的元素在测试条件时返回true,返回符合条件的元素下标,之后的值不会再执行函数;如果没有符合条件的元素则返回-1
      使用:var res=arr.findIndex(function(item){
              return item==120
          })

你可能感兴趣的