[JavaScript知识库]javascript数组

一、数组的基础

1.基础概念

? ? ?什么是数组：在一个内存（变量名）中保存了多个数据的一个集合结构

2.创建

? ? 1.直接量：var arr=[值1,...];
? ? ?2.构造函数：var arr=new Array(值1,...);
? ? ? ? ? ?特殊：new Array(只放了一个数字num) - 创建长度为num的一个空数组，相当于设置length

3.访问：数组名[下标]--元素

? ? ?添加：数组名[下标]=新值;
? ? ? 特殊：读取元素，下标越界，返回undefined
? ? ? ? ? ? ? ? ?添加元素，下标越界，下标不再连续导致数组变成一个稀疏数组

4.三不限制

? ? ?1.不限制元素的个数
? ? ?2.不限制元素的类型
? ? ?3.不限制下标越界（但是不建议）

5.数组名.length:可以获取数组的长度（长度==最大下标+1）

? ? ? 三个固定套路：
? ? ? ? ? 1.末尾添加元素：arr[arr.length]=新值；
? ? ? ? ? 2.获取倒数第n个：arr[arr.length-n];
? ? ? ? ? 3.缩容：删除元素：从末尾删除元素：arr.length-=n;

6.遍历数组：将数组中的每个元素都取出来执行相同或者相似的操作

? ? ? ? for(var i=0;i<arr.length;i++){arr[i]//当前次元素}

7. 索引数组：下标都是由数字组成的数组

8.关联数组 - 也称之为hash数组

? ? ? 什么是：下标是可以自定义的
? ? ? 为什么：索引数组的下标无具体意义，不便于查找
? ? ? 如何使用：
?? ?1、先创建一个空数组
?? ??? ?var arr=[];
?? ?
?? ?2、为数组添加下标添加元素
?? ??? ?arr["自定义下标"]=新值

?? ?3、访问元素非常简单，不需要数下标，只需要直接写入下标：
?? ??? ?arr["自定义下标"];

?? ?4、强调：hash数组的length永远失效！永远为0！

?? ?遍历hash数组：必须使用for in循环遍历 - for in是专为遍历准备的
?? ??? ?公式：for(var 下标名 in 数组名){
?? ??? ??? ??? ?数组名[下标名];
?? ??? ??? ? ? ? }
?? ??? ?for in ：既可以遍历索引数组 也可以 遍历 hash数组

二、数组的API

1.arr 转 string：

? ? ? ?var str=arr.join("连接符");
? ? 可以自定义连接符，也可以省略不写等效于String(arr);
? ?固定套路
? ? ? 1.如何将数组里面的内容拼接为一个句话（无缝拼接）?
? ? ? ? ? ? 语法: ?var str=arr.join("");
? ? ? ?2、将数组拼接为页面元素
? ? ? ? ? ? ? ?//数据
?? ?var cities=["-请选择-","北京","南京","重庆","天津","上海"];
?? ?//数组的API join拼接上了标签
?? ?var str="<option>"+cities.join("</option><option>")+"</option>";
?? ?//渲染到页面元素之上
?? ?sel.innerHTML=str;

?? ?实现：二级联动：
?? ?关键要点：1、两个数组：一个普通数组做一级，一个二维做二级
?? ??? ? 2、select专属事件onchange
?? ??? ? 3、事件中：this.selectedIndex - 获取到当前选中项的下标

2、拼接数组：添加数组元素的新方式：将concat后面的参数，拼接到arr之后

?? ?var newArr=arr.concat(值1,...);
?? ?强调：1、concat不修改原数组，只能返回一个新数组
?? ? ? ? ?2、concat可以直接传入数组参数，悄悄的把数组打散为单个元素

3、截取（获取）子数组：将arr从starti位置开始，一直截取到endi - 删除元素的新方式/复制

?? ?var subArr=arr.slice(starti,endi+1);
?? ?强调：1、slice不修改原数组，只能返回一个新数组
?? ? ? ? ?2、含头不含尾
?? ? ? ? ?3、endi可以省略，截取到末尾
?? ? ? ? ?4、两个参数都可以省略，从头到尾复制一份 - 深拷贝（复制了一个副本）

4、arr.splice()：删除/添加/替换的新方式

?? ?删除：var dels=arr.splice(starti,n); n - 删除个数?
?? ? ? ? ?强调：其实此方法也有返回值，返回的是你删除的元素组成的一个新数组

?? ?添加：arr.splice(starti,0,值1,...);
?? ? ? ? ?强调：1、原starti位置的元素以及后续元素都会向后移动
?? ??? ? 2、插入数组也行，但是不推荐，因为不会帮我们打散数组，会导致一些部分是一维，一些部分是二维

?? ?替换：var dels=arr.splice(starti,n,值1,...);
?? ? ? ? ?强调：删除的个数不必等于插入的个数

5、翻转数组：arr.reverse();

6.排序：arr.sort();

? ? ? ?问题1：默认会将元素们转为字符串，按位PK，希望按照数字排序？
?? ? 解决：固定套路：
?? ??? ?arr.sort(function(a,b){//悄悄的带有循环
?? ??? ??? ?console.log(a);//a是后一个数
?? ??? ??? ?console.log(b);//b是前一个数
?? ??? ??? ?return a-b;//如果return 返回的是一个正数，说明后一个数>前一个数
?? ??? ??? ??? ? ? //如果return 返回的是一个负数，说明后一个数<前一个数
?? ??? ??? ? ? ? ? ? ? ? ? ? //如果return 返回的是0，两者一样大
?? ??? ??? ??? ? //而我们的sort方法正好可以根据你返回的正数/负数/0来进行排序
?? ??? ??? ?})

? ? ? ? ? 问题2：只能升序排列，如何降序：
?? ?解决：arr.sort(function(a,b){return b-a;})

7.栈和队列：其实就是数组，添加元素和删除元素的新方式

?? ?栈：数组，只不过是一端封闭，只能从另一端进出的操作
?? ??? ?开头进：arr.unshift(新元素,...);//添加元素的新方式，向前添加，缺陷：导致其余元素的下标发生变化
?? ??? ?开头出：var first=arr.shift();//只会一次调用删除第一个//删除元素的新方式，向前删除，缺陷：导致其余元素的下标发生变化

?? ??? ?结尾进：arr.push(新元素,...);//添加元素的新方式，向后添加
?? ??? ?结尾出：var last=arr.pop();//只会一次调用删除最后一个//删除元素的新方式，向后删除

?? ?队列：数组，只不过是只能从一端进入，另一端出
?? ? ? 何时：按照先来后到的顺序
?? ??? ?依然是以上4个：
?? ??? ?开头进：arr.unshift(新元素,...);
?? ??? ?结尾出：var last=arr.pop();

?? ??? ?结尾进：arr.push(新元素,...);
?? ??? ?开头出：var first=arr.shift();

8.二维数组：数组的元素，又引用着另一个数组

?? ? ?何时：在一个数组内，再次细分每个分类
?? ? ?创建：
?? ??? ?var arr=[
?? ??? ??? ?["张三",18,1500],
?? ??? ??? ?["李四",18,2000],
?? ??? ??? ?["王麻子",35,12000]
?? ??? ?];
?? ?
?? ? ?访问：arr[行下标][列下表];
?? ? 特殊：列下标越界，返回undefined
?? ??? ?行下标越界，报错！因为undefined没有资格使用[]

?? ? ?遍历二维数组：必然两层循环，外层循环控制行，内存循环控制列
?? ??? ??? ?for(var r=0;r<arr.length;r++){
?? ??? ??? ??? ?for(var c=0;c<arr[r].length;c++){
?? ??? ??? ??? ??? ?console.log(arr[r][c]);
?? ??? ??? ??? ?}
?? ??? ??? ?}
?