我是靠谱客的博主 美好红酒,最近开发中收集的这篇文章主要介绍Web前端高级编程学习笔记8:数组进阶,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

目录

    • 基本概念
    • 操作数组
      • 创建数组
      • 读写数组元素
      • 稀疏数组
      • 数组长度
      • 数组元素的添加和删除
      • 数组遍历
    • 数组方法
      • join ( )
      • reverse ( )
      • sort ( )
      • concat ( )
      • slice ( )
      • splice ( )
      • push ( ) 和 pop ( )
      • unshift ( ) 和 shift ( )
      • ES5新增方法
      • ES6新增方法
      • 构造函数方法

基本概念

数值是值的有序集合。

  • 每个值叫做一个元素,每个元素有数字对应其位置叫做索引。

数组是无类型的。

  • 数组元素可以是任意类型。

数组是动态的。

  • 根据需要,数组可以增长或缩减。

数组可以是稀疏的。

  • 数组元素不一定要连续,可以有空缺。
let arr=[,,]
//length为2,一个逗号结束一个元素
let arr2=[1,,3]
//省略最后的逗号,length为3

JS数组是JS对象的特殊形式。

  • 数组索引可以认为是整数的属性名。

数组是继承 Array.prototype 中的属性。

操作数组

创建数组

数组字面量

let base=10;
let numbers=[base,base+1,base++,++base];      //  [10,11,10,12]

构造函数 Array( )

let a=new Array();

读写数组元素

使用 [ ] 操作符来访问数组的元素。

  • 方括号中是一个返回非负整数值的任意表达式。
  • 若不为数值则视为字符串,转为数组的属性。
let a=['world'];
a['10']='hi';         //hi
a['ten']='hoo';       //hoo
a[-2]=-2;             //-2
a[1.11]=1.11;         //1.11
a        //["world", empty × 9, "hi", ten: "hoo", -2: -2, 1.11: 1.11]

稀疏数组

包含从0开始的不连续索引的数组。

let a1=[,,,];
let a2=new Array(4);
1 in a1
//false
1 in a2
//false

a1[10]=100;
a1[8]=undefined;

for(let a in a1){console.log(a,a1[a])}
//8 undefined
//10 100
//for in可以跳过稀疏数组的空位

for(let b of a1){console.log(b)}
//10*undefined
//100
//for of不能跳过空位

数组长度

每个数组都有一个 length 属性,代表数组中元素的个数。

数组元素的添加和删除

let arr=[1,2,3]
//在末尾加
arr[arr.length]=4
arr.push(5)
//在最前面加,后面元素依次后移一位
arr.unshift(0)
delete arr[1]
//删除指定位置元素并返回true或false
arr.pop()
//在末尾删除并返回删除元素
arr.shift()
//在最前面删除
//第一位为起始位置,第二位为删除元素个数,第三位为删除后用来替换的元素
arr.splice(1,2,...[22,33])    //替换
arr.splice(1,0,...[222,333])  //添加
arr.splice(1,2)               //删除

数组遍历

let arr=[1,2,3,4,5];
Object.keys(arr);
Object.values(arr)for(let k in arr){
    console.log(k,arr[k])
}//会忽略空位

for(let d of arr){
    console.log(d)
}//不能忽略空位,只能读取值

for(let i=0;i<arr.length;i++){
    if(i in arr) {
        console.log(arr[i])
    }
}

数组方法

join ( )

将数组中所有元素都转化为字符串并连接在一起,返回最后生成的字符串。
可以指定一个可选的字符串在生成的字符串中来分隔数组的各个元素,如果不指定分隔符,默认使用逗号。

reverse ( )

将数组中的元素颠倒顺序,返回逆序的数组。

sort ( )

将数组中的元素排序并返回排序后的数组。
当不带参数调用 sort ( )时,数组元素以字母表顺序排序(如有必要将临时转化为字符串进行比较)。

let arr=[11,290,3,45];
let s_arr=arr.sort(function(a,b){
    retrun a-b;
    //默认为升序,若要降序,则 retrun(a-b)*-1
});
console.log(arr);
//回调函数

concat ( )

创建并返回一个新数组,它的元素包括调用concat( ) 的原始数组的元素和concat( )的每个参数。

slice ( )

返回指定数组的一个片段或子数组。
它的两个参数分别指定了片段的开始和结束的位置。

splice ( )

是在数组中插入或删除元素的通用方法。
不同于slice()和concat() , splice()会修改调用的数组。

push ( ) 和 pop ( )

push( )和 pop( )方法允许将数组当做栈来使用。
push( )方法在数组的尾部添加一个或多个元素,并返回数组新的长度。
pop( )方法则相反:它删除数组的最后一个元素,减小数组长度并返回它删除的值。

注意,两个方法都修改并替换原始数组而非生成一个修改版的新数组。

unshift ( ) 和 shift ( )

unshift( )在数组的头部添加一个或多个元素,并将已存在的元素移动到更高索引的位置来获得足够的空间,最后返回数组新的长度。
shift( )删除数组的第一个元素并将其返回,然后把所有随后的元素下移一个位置来填补数组头部的空缺。

ES5新增方法

**forEach()**方法从头至尾遍历数组,为每个元素调用指定的函数。
**map()**方法将调用的数组的每个元素传递给指定的函数,并返回一个数组,它包含该函数的返回值。
**fliter()**方法返回的数组元素是调用的数组的一个子集·传递的医数是用来逻辑判定的:该函数返回true或false 。
**every()**和 **some()**方法是数组的逻辑判定:它们对数组元素应用指定的医数进行判定,返回true或false。
**reduce()reduceRight()**方法使用指定的函数将数组元素进行组合,生成单个值。
**indexOf()lastIndexOf()**搜索整个数组中具有给定值的元素,返回找到的第一个元素的索引或者如果没有找到就返回-1。

ES6新增方法

copyWith( ) ,会在当前数组内部将指定位置的元素复制到其他位置(会覆盖原有元素),返回当前数组。
**find( )findIndex( )**用户找出第一个符合条件的数组元素(或其索引)。
fill( ),使用给定值填充一个数组。
entries( )keys( )values( ) ,用于遍历数组。
includes( ),判断数组中是否包含给定的值,与字符串的inc1udes方法类似。

构造函数方法

Array.from( ),用于将两类对象转为真正的数组。

  • 类数组的对象
  • 可遍历的对象

Array.of( ),将一组数值转换为数值。

arr=[1,2,3];
let nums=Array.of(...arr,7,8,9);
console.log(nums)
//[1, 2, 3, 7, 8, 9]

最后

以上就是美好红酒为你收集整理的Web前端高级编程学习笔记8:数组进阶的全部内容,希望文章能够帮你解决Web前端高级编程学习笔记8:数组进阶所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(40)

评论列表共有 0 条评论

立即
投稿
返回
顶部