首页 > 代码库 > Javascript之数组
Javascript之数组
一、概念
数组是值的有序集合。每个值叫做一个元素,儿每个元素值数组中有一个位置,以数字表示,称为索引。数组的元素可以是任意类型,并且同一个数组中的不同元素也可能有不同的类型。
二、创建数组
1、常规方式:
var arr = new Array(); arr[0] = ‘abc‘; arr[1] = ‘123‘; arr[2] = ‘asd‘; console.log(arr); //打印得:Array [ "abc", "123", "asd" ]
2、简介方式
var arr = new Array(‘asd‘, ‘123‘, ‘Hello‘); console.log(arr);//打印得: Array [ "asd", "123", "Hello" ]
3、字面方式
1 var arr = ["Saab", "Volvo", "BMW"]; 2 console.log(arr);//打印得:Array [ "Saab", "Volvo", "BMW" ]
三、数组的读写
1 var arr = new Array(10, 20, ‘Word‘); 2 arr[3] = ‘Hello‘; //写第3个元素 3 console.log(arr); //Array [ 10, 20, "Word", "Hello" ] 4 var val = arr[1]; //读第一个元素 5 console.log(val); //20
四、数组的长度
var arr = new Array(‘asd‘, ‘123‘, ‘Hello‘); var len = arr.length; console.log(len); //3
五、数组元素的添加和删除
最简单的方法:为新索引值赋值
1 var arr = [];//定义一个空数组 2 arr[0] = ‘zero‘; //添加元素 3 arr[1] = ‘one‘; 4 console.log(arr); //Array [ "zero", "one" ]
也可以使用push()方法在数组末尾增加一个或多个元素
1 var arr = [];//定义一个空数组 2 arr.push(‘zero‘); //增加一个 3 arr.push(‘one‘, ‘two‘); //增加多个 4 console.log(arr); //Array [ "zero", "one", "two" ]
delete元素符删除数组元素:
1 var arr = [ "zero", "one", "two" ]; 2 delete arr[1]; //a在索引1的位置不再有元素 3 console.log(arr); //Array [ "zero", <1 个空的存储位置>, "two" ] 4 var bool = 1 in arr; 5 console.log(bool); //false 说明数组索引1并未在数组中定义 6 console.log(arr.length); //3 delete操作不影响数组的长度
pop()方法删除数组尾部的元素,并使数组长度减1,同时返回被删除的元素:
1 var arr = [ "zero", "one", "two" ]; 2 var val = arr.pop(); 3 console.log(arr); //Array [ "zero", "one" ] 4 console.log(arr.length); //2 5 console.log(val); //‘two‘
六、数组的遍历
for循环是遍历数组元素最常见的方法:
1 var arr = [ "zero", "one", "two", "three"]; 2 for (var i = 0; i < arr.length; i++) { 3 console.log(arr[i]); //打印得:zero one two three 4 };
for/in循环遍历数组:
1 var arr = [ "zero", "one", "two", "three"]; 2 for (var index in arr) { 3 var val = arr[index]; 4 console.log(val);////打印得:zero one two three 5 };
还可以用forEach()方法遍历:
var data = http://www.mamicode.com/[1, 2, 3, 4, 5]; var sumOfSquares = 0; data.forEach(function(x){ sumOfSquares += x * x;//平方相加 }); console.log(sumOfSquares); //55
七、多维数组
1 /** 2 * 创建一个多维数组 3 * @type {Array} 4 */ 5 var table = new Array(10); //表格有10行 6 for (var i = 0; i < table.length; i++) { 7 table[i] = new Array(10); //每行有10列 8 }; 9 //初始化数组 10 for (var i = 0; i < table.length; i++) { 11 for (var j = 0; j < table[i].length; j++) { 12 table[i][j] = i * j; 13 }; 14 }; 15 //使用多维数组计算 5 * 7 16 var product = table[5][7]; 17 console.log(product); //35
八、数组方法
数组常用的方法:
concat()用于连接两个或多个数组:
1 var arr1 = ["Cecilie", "Lone"]; 2 var arr2 = ["Emil", "Tobias", "Linus"]; 3 var arr3 = ["Robin"]; 4 var newArr = arr1.concat(arr2, arr3); 5 console.log(newArr); //Array [ "Cecilie", "Lone", "Emil", "Tobias", "Linus", "Robin" ]
join把数组的所有元素转化成一个字符串:
1 var arr = [ "Cecilie", "Lone", "Emil", "Tobias", "Linus", "Robin" ]; 2 var str = arr.join(‘,‘); 3 console.log(str);//Cecilie,Lone,Emil,Tobias,Linus,Robin 4 console.log(typeof(str));//string
reverse()反转元素的顺序,返回新的数组:
1 var arr = [ "Cecilie", "Lone", "Emil", "Tobias", "Linus", "Robin" ]; 2 var newArr = arr.reverse(); 3 console.log(newArr);//Array [ "Robin", "Linus", "Tobias", "Emil", "Lone", "Cecilie" ]
sort()对数组元素排序,排序顺序可以是字母或数字,并按升序或降序。默认排序顺序为按字母升序。
1 //数字排序 2 var arr = [40,100,1,5,25,10]; 3 var newArr = arr.sort(function(a,b){return a-b}); 4 console.log(newArr); //Array [ 1, 5, 10, 25, 40, 100 ]
slice()选取数组的的一部分,并返回一个新数组。
1 var arr = ["Banana", "Orange", "Lemon", "Apple", "Mango"]; 2 var newArr = arr.slice(2,4); 3 console.log(newArr); //Array [ "Lemon", "Apple" ]
splice()从数组中添加或删除元素。不同于slice()和concat(),splice()会修改调用的数组
1 var arr = ["Banana", "Orange", "Apple", "Mango"]; 2 var newArr = arr.splice(2,1,"Lemon","Kiwi"); 3 console.log(newArr);//移除数组的第三个元素,并在数组第三个位置添加新元素,同时返回删除的元素 4 console.log(arr);//Array [ "Banana", "Orange", "Lemon", "Kiwi", "Mango" ]
splice()会插入数组本身而非数组的元素。
push()和pop()已在数组元素的添加修改提到。
unshift()和shift()的行为非常类似与push()和pop(),前者是在数组的头部进行元素的插入和删除操作,unshift()在数组的头部插入一个或多个元素,返回数组新的长度;shift()删除数组的第一个元素并将其返回。
1 var arr = ["Banana", "Orange", "Apple", "Mango"]; 2 var len = arr.unshift("Lemon","Pineapple"); 3 console.log(len);//6 4 console.log(arr);//Array [ "Lemon", "Pineapple", "Banana", "Orange", "Apple", "Mango" ]
1 var arr = ["Banana", "Orange", "Apple", "Mango"]; 2 var val = arr.shift(); 3 console.log(val);//Banana 4 console.log(arr);//Array [ "Orange", "Apple", "Mango"
toString()将数组转换为字符串
1 var arr = ["Banana", "Orange", "Apple", "Mango"]; 2 var str = arr.toString(); 3 console.log(str);//Banana,Orange,Apple,Mango
这里与不使用任何参数调用的join()方法返回的字符串是一样的。
forEach()从头到尾遍历数组,为每个元素调用指定的元素。
1 var data = http://www.mamicode.com/[1, 2, 3, 4, 5]; 2 var sum = 0; 3 data.forEach(function(val){ 4 sum += val; //计算数组元素和 5 }); 6 console.log(sum);//15 7 data.forEach(function(v, i, a){ 8 a[i] = v + 1;//给数组的每个元素加1 9 }) 10 console.log(data);//Array [ 2, 3, 4, 5, 6 ]
map()方法将调用的数组的每个元素传递给指定的函数,并返回一个数组,它包含该函数的返回值。
1 var arr = [1, 2, 3]; 2 var newArr = arr.map(function(x) { 3 return x * x; 4 }) 5 console.log(newArr);//Array [ 1, 4, 9 ]
filter()方法返回的数组元素是调用的数组的一个子集。
1 var arr = [1, 2, 3, 4, 5, 6 ]; 2 var newArr = arr.filter(function(x){ 3 return x < 3; 4 }); 5 console.log(newArr); // Array [ 1, 2 ] 6 var arr1 = arr.filter(function(x, i){ 7 return i % 2 == 0; 8 }) 9 console.log(arr1);//Array [ 1, 3, 5 ]
压缩空缺并删除undefined和null元素
arr = arr.filter(function(x){ return x !== undefined && x !== null;})
every()和some()方法是数组的逻辑判定,对数组元素应用指定函数进行判定,返回true或false
every() 所有的元素满足条件,返回true,否则返回false。
var arr = [1, 2, 3, 4, 5, 6 ]; var bool = arr.every(function(x){ return x < 10; });//true 所有的值都小于10 console.log(bool);
some()至少有一个元素满足条件,返回true, 所有的不满足返回false
var arr = [1, 2, 3, 4, 5, 6 ]; var bool = arr.some(function(x){ return x % 2 == 0});//true arr含有偶数 console.log(bool);
reduce()和reduceRight()方法使用指定函数将数组元素进行组合,生成单个值。
reduced()将数组元素计算为一个值(从左到右)。
1 var arr = [1, 2, 3, 4, 5, 6 ]; 2 var sum = arr.reduce(function(x, y){return x + y}, 0);//数组求和 3 var product = arr.reduce(function(x, y){ return x * y}, 1);//数组求积 4 var max = arr.reduce(function(x, y){ return (x > y) ? x : y}); //求最大值 console.log(sum); 5 console.log(product); 6 console.log(max);
reducedRight()按照数组索引从高到低处理数组。
var arr = [2, 3, 4]; var big = arr.reduceRight(function(x, y){ return Math.pow(y, x);}); console.log(big);//2.4178516392292583e+24
indexOf()和lastIndexOf()方法搜索整个数组中具有给定值的元素,返回找到的第一个元素的索引或者如果没有找到返回-1,indexOf()从头到尾搜索,lastIndexOf()则反向搜索。
1 var arr = [0, 1, 3, 1, 2, 0]; 2 var a = arr.indexOf(1); //a[1]是1 3 var b = arr.lastIndexOf(1);//a[3]是1 4 var c = arr.indexOf(5);//没有值为5的元素 5 console.log(a); 6 console.log(b); 7 console.log(c);
Javascript之数组