数组
数组的概念
数组是一个存放相同数据类型的容器,也是一个变量。
举个简单的例子:
货架上的商品是一堆相同的商品,而货架就是存放商品的数组。
创建数组
语法一:
var arr = []; # 创建了一个空数组
var arr = ["张三","李四","王五"]; # 创建了一个数组,里面存了三个姓名
语法二:使用构造函数的形式创建数组
var arr = new Array(); # 创建了一个空数组
var arr = new Array(3); # 创建了一个长度为3的数组
var arr = new Array("张三","李四","王五"); # 创建了一个数组,里面存了三个姓名
使用构造函数的方式创建数组的时候,如果其中只有一个值,如果这个值是整数,表示数组的长度,否则表示这个数组中有一个元素,就是这个值。
var arr = new Array(3)
console.log(arr);//输出结果
//Array(3)
//length: 3
//__proto__: Array(0)
数组中可以存放任意类型的值,但实际情况中,我们习惯将同类型的数据存到一个数组中。
var arr = ['张三',123,true,'underfind']
数组的操作
访问数组中的元素:数组[下标]
,例:
var arr = ["张三","李四","王五"];
console.log(arr[1]); // 李四
数组中下标是从0开始
查看数组中元素的个数 - 数组的长度:数组.length
,例:
var arr = ['张三',"李四","王五","赵六"];
var arr1 = [1,2,3,4,5,6];
console.log(arr.length); // 4
数组中长度length与下标不同,使用时易混淆
数组的长度可以访问,也可以赋值,用来修改数组的长度。例:
var arr = ['张三',"李四","王五","赵六"];
console.log(arr); // (4) ["张三", "李四", "王五", "赵六"]
console.log(arr.length); // 4
arr.length = 6;
console.log(arr); // (6) ["张三", "李四", "王五", "赵六", empty × 2] 后面的表示还有两个空元素
console.log(arr.length); // 6
给数组添加元素:数组[下标] = 值
,例:
var arr = ["张三","李四"];
arr[2] = "王五";
console.log(arr); // (3) ["张三", "李四", "王五"]
arr[10] = "赵六";
console.log(arr); // (11) ["张三", "李四", "王五", empty × 7, "赵六"] 中间还有7个空元素
修改数组中元素的值:数组[下标] = 值
,例:
var arr = ["张三","李四"];
arr[0] = "王五";
console.log(arr); // (2) ["王五", "李四"]
清空数组:如果下标是已经存在的,那赋值操作就是修改数组元素的值,如果下标是不存在,那赋值操作就给数组添加元素。例:
var arr = [1,2,3];
arr = [];
console.log(arr); // []
// 或者
arr.length = 0;
console.log(arr); // []
数组总结:
- 数组的第一个元素的下标永远是0;
- 数组的最后一个元素的下标永远是
数组的长度-1
遍历数组
如果要将数组中的所有元素都输出,操作如下:
var arr = ["张三","李四","王五","赵六"];
console.log(arr[0]); // 张三
console.log(arr[1]); // 李四
console.log(arr[2]); // 王五
console.log(arr[3]); // 赵六
从上面输出的代码中可以看出,多次输出是在进行重复动作,并且多次重复之间是有规律可循的,所以可以使用循环进行这个重复动作:
使用数组长度遍历:
var arr = ["张三","李四","王五","赵六"];
/*
for(var i=0;i<4;i++){
console.log(arr[i]);
}
*/
// 条件中的4写死以后,如果数组再添加了新元素,就没办法遍历了,所以将4换成数组的长度。
// 循环中的条件执行5次,也就是我们需要求5次数组的长度,所以将求数组长度的操作放到循环外面可以提高执行效率
var length = arr.length;
for(var i=0;i<length;i++){
console.log(arr[i]);
}
使用for in遍历:
var arr = ["张三","李四","王五","赵六"];
for (var i in arr) {
console.log(arr[i]);
}
数组练习
利用for循环求数字数组中所有元素的和
var arr = [10,20,30,40,50];
var sum = 0;
for(var i = 0;i < arr.length; i++){
sum += arr[i];
}
alert(sum);
利用for in 来遍历的数组:注意:for in不会遍历空元素
var arr = [10,20,30,40,50];
var sum = 0;
for (var i in arr) {
sum += arr[i];
}
alert(sum);
利用for in 求数组中所有元素的和
var arr = [10,20,30,40,50];
var sum = 0;
for (var i in arr) {
sum += arr[i];
}
alert(sum);
二维数组
二维数组就是在数组中嵌套数组,我们最常用的也就是二维数组。
var arr = [
"Jack",
"Rose",
["张三","李四"],
["张小三","李小四"]
];
console.log(arr);//(4) ["Jack", "Rose", Array(2), Array(2)]
console.log(arr[2]);//(2) ["张三", "李四"]
console.log(arr[2][1]);//李四
通过下标选择元素。
操作数组的方法
-
splice : 数组任意地方删除或者添加元素
var arr = ['zs','ls','ww','zl','xmg']; //splice(start, deletedCount) 删除元素 // start 开始 deletedCount 删除个数 arr.splice(0, 2)//无需调用变量接受数据 console.log(arr)//打印删除后的arr //查看被删除元素 var brr=arr.splice(0,2)//需要定义变量接受数据 console.log(brr)//(2) ["zs", "ls"] 在控制台打印查看删除的元素 //splice(start, deletedCount , item) 删除+添加, 第三个参数是在原来删除的位置上新加几个元素 arr.splice(0, 2,"ni","hao") console.log(arr)//(5) ["ni", "hao", "ww", "zl", "xmg"] //特殊 : // splice(start, 0 , item) 就是在某个位置新加元素 arr.splice(1, 0,"新增的") console.log(arr)//(6) ["zs", "新增的", "ls", "ww", "zl", "xmg"]
-
数组的增删操作
var arr = ['zs','ls','ww'] arr.push(元素);//从末尾添加元素,并返回新数组的length,()不填数据没有新增 console.log(arr)//(4) ["zs", "ls", "ww", "末尾新增"] arr.pop();//从数组的后面删除元素,返回删除的那个元素,()不填数据 console.log(arr)//(2) ["zs", "ls"] arr.unshift(元素);//从数组的前面的添加元素,返回新数组的长度,()不填数据没有新增 console.log(arr)//(4) ["头部新增", "zs", "ls", "ww"] arr.shift();//从数组的最前面删除元素,返回删除的那个元素,()不填数据 console.log(arr)//(2) ["ls", "ww"] //总结: //1. shift 在前面 ,所以处理数组前面的 //2. p+ 在后面,所以是处理后面的 //3. unshift 比 shift 多个un,,所以就是加 //4. 添加的都是返回长度 //5. 删除的都是返回删除的元素 //6. 添加要说明添加什元素,,删除直接删除
-
数组的排序
var arr = [9,1,6,4,3,8,2,7,5]; arr.sort(); console.log(arr);//(9) [1, 2, 3, 4, 5, 6, 7, 8, 9] var arr = [9,1,16,4,3,28,2,7,5]; arr.sort();//数组的排序,默认按照 字母/首字符 顺序排序 => 1 11 2 3 console.log(arr);//(9) [1, 16, 2, 28, 3, 4, 5, 7, 9] //sort方法可以传递一个函数作为参数,这个参数用来控制数组如何进行排序 arr.sort(function(a, b){ return a - b;//a-b就是从小到大,b-a就是从大到小 });
-
数组的反转
var arr = ['a','b','c','d']; arr.reverse();//翻转数组,()不填数据 console.log(arr)//console.log(arr)
-
数组和字符串的转换
//语法:array.join(分隔符) //作用:将数组的值拼接成字符串,并且返回字符串 var arr = [1,2,3,4,5]; arr.join();//不传参数,默认按【,】进行拼接 arr.join("");//按【"】进行拼接 arr.join("-");//按【-】进行拼接 //split:将字符串分割成数组(很常用) //功能和数组的join正好相反。 var str = "张三,李四,王五"; var arr = str.split(",");
-
数组的拼接
//concat:数组合并,不会影响原来的数组,会返回一个新数组。 var arr=[1,2,3] var brr=[7,8,9] var crr = arr.concat(brr) console.log(crr)//(6) [1, 2, 3, 7, 8, 9] var arr=[1,2,3] var crr = arr.concat("ni","hao");//可以在concat()中添加字符串等跟数组合并,不一定必须是数组 console.log(crr)//(5) [1, 2, 3, "ni", "hao"]