JavaScript 06 数组
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
一、数组的简介和定义
数组就是一组数(一般来说,数据类型一样),相当于一次性定义了很多相同数据类型的变量,如果说单个变量是一个小容器,数组就是有多个格档的大容器(每个格档是个小容器)。
数组是一种数据类型。(在js中,数组的类型是object)
为什么要使用数组?
当我们需要表示一组数据,或者叫做一次性定义很多相似的变量时,就需要使用数组,如:表示一个班级学生的成绩,一年十二个月的销售数据等等。
数组可以通过字面值和构造函数两种方法来创建。
一维数组的定义
var arr = new Array(10); //创建一个包含 10 个元素的数组,没有赋值
var arr2 = new Array(“芙蓉姐姐”,30);//使用构造函数创建
var arr3 = [1,2,3,4,5]; //创建一个包含5个元素的数组,并给每个元素分别赋值为1,2,3,4,5
var arr = []; //空数组
什么是多维数组?
多维数组就是外层的数组中的至少有一个元素是一个数组
几维数组就是几层
var arr = [1,2,3,4,[5,6,7,8]]; //二维数组
var arr = [1,2,3,4,[5,6,7,8,[9,10]]]; //三维数组
......
一般三维数组差不多了,更多的原理差不多,就不一一列举了
二、数组的特性
1. 有length 属性
(length代表 元素的个数)
数组的长度(length属性):
数组元素的个数,我们通过数组元素的个数来表达数组的长度,一个数组中有多少个元素,长度就是多少
var arr = [1,2,3,4,5,"a","c",true];
console.log(arr.length); //长度为8
2. 可以通过下标取值和赋值
下标就是索引,即元素的序号,从0开始,下标最大取值是:长度-1;
下标可以是变量或表达式。
通过下标取值
注意:如果取值时,填入了不存在的下标,也和变量一样,会返回undefined
var arr = [1,2,3,4,5,"a","c",true];
console.log(arr[0]); // 1
console.log(arr[1]); // 2
console.log(arr[5]); // a
console.log(arr[100]); // undefined 取没有定义的下标的时候就会得到undefined
通过下标赋值
var arr = [1,2,3,4,5,"a","c",true];
arr[8] = 100;
arr[9] = 50;
arr[0] = 99;
注意:
1)、如果给一个已有的值的下标赋值,会替换掉原有的值
2)、如果给一个很大的下标赋值,js会自动补充empty到中间。
3. 可以循环(遍历)取值/赋值
数组可以被遍历
在js中,只有索引数组一种,没有类似于php中的关联数组。
遍历数组有三种语法
1、for循环遍历数组
var arr = [1,2,3,4,45,6,243,13,4,"hello","world"];
for(var i=0;i<arr.length;i++){
console.log(arr[i]);
}
2、for ... in 遍历数组的下标
var arr = [1,2,3,4,45,6,243,13,4,"hello","world"];
for(var key in arr){
console.log(key,arr[key]); //这里的key值的是数组的下标,for... in循环会遍历下标
}
3、for ... of 遍历数组的值
var arr = [1,2,3,4,45,6,243,13,4,"hello","world"];
for(var val of arr){
console.log(val); //这里的val值的是数组的值,for... of循环会遍历数组的值
}
其实for...of更适合遍历数组,for...in更适合遍历对象
遍历数组能对数组进行很多操作,我会通过例子来讲解。
小技巧:
往数组最后增加一个值(数组的递增赋值)
var arr = [1,2,3,4,5,6,2131,1,245,21];
arr[arr.length] = "我是最后一个哦";
// 根据原理 arr.length是数组的长度,而数组的下标(index)是从0开始的,所以数组的最大下标等于length-1
// 往数组的lenght下标添加就是往数组最后一个元素的后面添加一个新元素
注意:(数组储存在堆内存中)
在js中,由于数组属于引用类型,所以两个空数组也不相等,[] != []
引用数据类型,引用的并不是同一块内存空间所以即使值相等,所引用的空间也不同。
数组的使用技巧:
数组的去重
第一种方法:用新数组来保存
var list = [1, 2, 1, 2, 3, 4, 4, 3, 5, 6, 5, 6];
var arr = [];
for (var i = 0; i < list.length; i++) {
var item = list[i]; // 循环的当前元素
if (arr.indexOf(item) == -1) {
arr.push(item);
}
}
console.log(arr);
第二种方法:讲重复的裁切掉
var list = [1, 2, 1, 2, 3, 4, 4, 3, 5, 6, 5, 6];
for (var i = 0; i < list.length; i++) {
for (var j = i + 1; j < list.length; j++) { //1 2 3
if (list[i] === list[j]) {
list.splice(j, 1);
j--;
}
}
}
数组的深复制和浅复制
var list = [["小张", 86, 79, 55], ["小李", 75, 36, 90], ["小明", 68, 75, 82]];
数组的浅复制 (单纯的赋值) 因为 对象是引用类型 引用的是同一个空间 只要有一个改变 就都改变了
var arr = list;
数组的深复制 所以我们就想 要把数组所有数据 拷贝一份 (在新数组中操作不影响原数组)
1. 新建数组 用for循环 将数组list拷贝一份
var list = [1, 2, 3];
var arr = [];
for (var val of list) {
arr.push(val);
}
2. 数组的拓展方法(concat / slice)
var list = [1, 2, 3];
// var arr = list.concat();
// var arr = list.slice();
var arr = list.map(function (item) {
return item;
})
arr[0] = "小猪";
console.log(list[0]);
但是这两种方法都不能适用于多维数组,如果存在多维数组,就只能用多重循环,如果不清楚到底有多少层,可以使用递归。
function deepCopy(list) {
var arr = [];
for (var i = 0; i < list.length; i++) {
var item = list[i];
// 判断 如果是值类型就 直接放到数组中 如果是引用类型就 把数组在深复制一遍
if (item instanceof Array) {
return deepCopy(item);
} else {
arr.push(item);
}
}
return arr;
}