[toc]# 数组的概念 #1. 什么是数组？2. 数组指的是数据的有序列表。3. 那么它内部是怎么一回事呢？4. 数组内部每一个数值成为数组的元素5. 数组中每个元素都有一个位置， 我们把这个位置称为索引（下标，index） 数组的索引是从0 开始的6. 同一个数组当中，元素的类型不做任何限制 甚至数组中的元素可以是另外一个数组 （二维数组，三维数组。。）## JS中数组有哪些特点？1. 数组长度可以动态改变2. 同一个数组中可以储存不同的数据类型3. 每个数组都有length属性， 用于代表数组中元素的个数### 数组的创建1. 字面量方式2. 构造函数``````#### 字面量方式创建1. 所有元素都用方块号括起来2. 不同元素之间用逗号分隔开```['a','b',5];```创建了长度为2的数组，初始化```var colors =['red','blue'];```创建了长度为0的数组```var colors = [];``````var colors =['red','blue',];```//标准浏览器为2IE 解析为3#### 构造函数1. 构造函数在创建对象的时候才会使用2. 数组的构造函数创建方法3. Array()4. new Array(数组长度)；```创建一个长度为0 的数组var colors = new Array();创建一个长度为5 的数组var colors = new Array(5)创建一个长度为3 的数组，三个元素分别是r...var colors = new Array('red','green','blue')```### 注意1. 使用构造函数创建数组对象的时候，最后一个元素2. 千万不要添加逗号，否则会报错3. 使用构造只能传入一个……且要从0开始3. 使用构造函数创建数组对象的时候，new 关键字4. 其实可以省略，也可以写成Array()```var arr = new Array(); 变量 数组对象 栈区 堆区```## 关于栈区和堆区的关系* 内存当中，实际上分为很多个区域，分别用来保存* 不同的数据，其中非常重要的两个区域是栈区和堆区* 栈区：基本数据都保存在栈区，会根据函数的结束，而去释放内存。* 堆区：非基本数据都保存在堆区，需要程序猿手动开辟，手动释放。* new 是在堆区开辟一块内存空间，用来储存对象* arr 是数组的引用，是通过栈区## 访问和修改数组中的元素* 利用索引来访问数组中的元素* 例如： 数组长度为5* 0，1，2,3,4* arr[0]* arr[1]创建一个长度为5 的数组```var arr = [10,20,30,40,50];console.log('数组中第一个元素：'+arr[0]);修改对应的数组位置arr[1] = 100;console.log(arr);```## 数组的长度 如何获取数组的长度1. 数组的名称。length2. 每一个数组都有一个length 属性，3. 用于表示数组的长度（即：元素的个数）4. 数组名称.length```var arr = [10,20,30,40,50]console.log('数组的长度为'+arr.length);```## 如何修改数组的长度* 一般强类型语言中，数组的长度是固定的* 一旦创建成功，则不能修改数组的长度* 但是JS是一种弱类型语言，* 数组的长度可以在程序运行期间根据需要* 动态的发生改变* 数组的length不仅仅可读....* 修改长度的内容，会被直接移除* 类似undefined...* 通过给最后一个元素赋值来动态的修改数组长度```var arr = [4,5,6];console.log(arr.length);//3//给下标为11的元素赋予初始值//...arr[11] = 678;console.log(arr.length);//数组长度会变成12//没有赋值的默认全部为undefined```## 数组的遍历 ### 1. for 循环遍历数组（推荐使用）* 数组的长度是多少，就循环遍历多少次* 循环变量作为数组的下标```var arr = [10,20,30,40,60,30,80];//数组的长度是多少，就循环遍历多少次//循环变量作为数组的下标for(var i = 0;i < arr.length;i++){ console.log(arr[i]);}```### 2. for.. in 循环遍历数组 * 每循环一轮，都会把数组的下标赋值给index* index 就相当于拿到了数组每一个元素的下标* index 是从0 开始获取的```var arr = [10,20,30,40,60,30,80];for(var index in arr){//循环输出：0,1,2,3,4，4，5 console.log(index);}//将声明变量的var进行省略for(i in arr){ console.log(arr[i]);}```### 3. for.. each遍历数组* ES5 中增加的内容* 需要传入一个匿名函数```var arr = [4,5,8,45,55];arr.forEach(function(element,index){console.log(element);console.log('index下标是'+index)；});```* 匿名函数中需要两个参数* 参数1：循环遍历的那个元素* 参数2：循环遍历的那个下标* 我们可以在匿名函数内部添加额外的代码* 老师说这个可以额外做好多事情## 数组转换方法 ##### 1. toString()只能使用逗号链接```var arr = [50,40,30,20,99];alert(arr.toString());alert(arr);console.log(....)....```## 2. join()可以使用指定的符号进行链接```var arr = [50,40,30,20,99];alert(arr.join('->'));```## 栈和队列### 数组的栈方法#### 栈：一种数据结构，特点：FILO（先进后出）* 向栈内部存入元素，我们称之为“入栈”(push)* 从栈内部移除元素，我们称之为“出栈”(pop)* 先入栈的元素在栈的下方* 后入栈的元素在栈的顶部* 这两个操作都是对栈顶元素进行操作* “吃多了拉就是队列，吃多了吐就是栈”```var arr = ['沈斌'，'沈杰']var len = arr.push('lipeng');//push()方法返回添加成功后数组的长度console.log(len);console.log(arr);//pop()出栈操作，一次只能出栈一个元素var item = arr.pop();//pop()方法将栈顶元素从栈顶移除console.log(item);console.log(arr);```### 数组的队列队列也是一种数据结构，特点：FIFO（先进先出）* JS中也提供了模拟队列的方法* 1.向队列头部添加元素(unshift)* 从队列头部移除元素(shift)* 2.向队列的尾部添加 向队列的尾部移除* 队列尾部的操作实际是有push和pop完成```var arr = ['a','b','c'];var firstItem = arr.shift();console.log(firstItem); //avar len = arr.unshift('王二麻子')；console.log(len);console.log(arr);```## 数组的倒置方法* 倒置操作对原数组本身进行操作* 返回的也是原数组对象* 并不是新建数组```var arr = ['a','b','c'];console.log('数组倒置前:'+arr);//对数组元素进行倒置arr.reverse();console.log('数组倒置后：'+arr)；```## 数组的索引方法### 1. indexOf(item)从开始向后### 2. lastIndexOf(item)从后往前（查找最后一次出现的位置）```var arr = ['a','b','c','d','b','f'];console.log(arr.indexOf('b')); //1console.log(arr.lastIndexOf('b')); //3//indexOf(searchValue,fromIndex)//searchValue:所需要搜索的字符//fromIndex：从第一个元素开始进行搜索console。log(arr.indexOf('b',2)); //4console。log(arr.lastIndexOf('b',2)); //1console。log(arr.indexOf('王二麻子')); //-1//如果元素无法查找到，则会返回-1console。log(arr.indexOf('b',6)); //-1```## 获取新的数据### 1. concat()该方法用于连接两个或者多个数组* 至少需要传入一个参数，参数可以是元素，也可以是数组```var arr = ['a','b','c','d'];var newArr = arr.concat(['e','f']);console.log(newArr.length); //6console.log(arr.length); //4//把两个元素和一个数组全部进行拼接，//实际出现的会是一个完整的“新数组”var newArr_2 = arr.concat('e','f',['g','h']);console.log(newArr_2.length); //8```### 2. slice()arr.slice()* 截取数组，并* 参数* start: * 必选 * 如果是负数，表示从尾部开始截取 * -1 -> 表示最后一个元素* end： * 可选 * 截取到指定的位置 * 不包括end的位置 * 如果没有给定end， * 则表示截取到最后位置* end 要大于 start，否则无法截取元素* 截取出来的是一个新数组，对原始数组没有任何影响```var arr = ['a','b'...'e']console.log(arr.slice(3);//d,econsole.log(arr.slice(-1));//econsole.log(arr.slice(2,1));//空console.log(arr.slice(-3,-2));//c```### 3. splice() (重点)arr.plice(index,howmany,item1...itemN)* 该...* 返回被删除的数组* 参数 * index：必要参数 * 规定 添加/删除 元素位置 * 使用负数可以从数组的尾部开始//添加元素```var arr = ['a','b','c','d','e'];var v = arr.splice(1,0,'asd','qwe');//因为是添加元素，所以返回的v 的长度为0console.log(v.length);//0console.log(arr.length);//7//因为插入位置为1，所以添加在其后面的自动往后挪```//删除元素```var arr = ['a','b','c','d','e'];var deleted = arr.splice(1,2);console.log(deleted);//b,cconsole.log(arr); //a,d,e```//替换元素 (用的特别多)```var arr = ['a','b','c','d','e'];var change = arr.splice(1,1,'bbbb');console.log(change); console.log(arr); ``` * howmany ：必要参数 * 要删除的元素 * item：可选参数 * 替换## 系统关键字我们可以利用系统的关键字来完成对数组的删除操作* delete 删除元素，数组长度不会发生改变* 只会将对应的数值进行删除* 对应数值变为undefined```var arr = [1,2,3,4,5];console.log(arr);delet arr[3];console.log(arr.length); //5console.log(arr[3]); //undefinedconsole.log(arr); //1,2,3,5```
下一篇：蟋蟀宝宝这样画萌萌哒