第五章 引用类型> Array类型

 

Array中的每一项可以保存不同类型的值。访问数组的值通过下标访问。数组的第一个值的下标是0;第二个是1，以此类推

 

创建数组的2种基本方式：

1.Array构造函数

var color = new Array();

//也可以省略new操作符
var color = Array();

 

2.数组字面量

var color = ["red", "yellow", "blue"];
//创建一个包含三个值的数组

var color2 = [];
//创建一个空数组

 

访问，和设置数组值的方法：

var color = ["red", "blue", "yellow"];

console.log(color[1]);
console.log(color.length);

//blue 数组的下标值从0开始
//2 数组的length属性因为下标从0开始 所以比属性名的数量-1

 

 

length属性

通过显式的设置数组的length属性，可以 设置和删除属性

var color = ["red", "blue", "yellow", "leo"];
color.length = 2;
console.log(color[3]);
//undefined

color.length = 4; //设置数组长度为4
color[3] = "two"; //数组的下标从0开始
console.log(color[3]); 
//two 

利用length属性在数组末尾添加新项，数组的最后一项始终是length-1；下一项的位置就是length;每加一项就自动更length属性值。

var colors =["red", "blue", "green"];
colors[colors.length] = "black";
colors[colors.length] = "brown";
console.log(colors[4]);
//brown

 

检测数组：Array.isArray()用于确定某个值是不是数组。

数组的转换方法：

数组继承的toLocaleString()、toString()、valueOf()以逗号分隔的字符串形式返回数组的每一项。

join():接受一个参数，即用作分隔的字符串。

var colors =["red", "blue", "green"];
console.log(colors.join("||"));

// red||blue||green

 

数组的 栈方法：

栈：后进先出（Last-in-fisrt-out）的数据结构，新添加的项最早被移除，栈的插入（推入）和移除（弹出）只发生在栈的底部。

push():可以接受任意的参数，把他们逐个添加到数组的末尾。并返回修改后数组的长度。

pop():从数组末尾移除最后一项，减少数组的length值，返回被移除的项。

var colors = ["blue", "yellow", "red"];
colors.push("abc","123"); //推入2个数组项
console.log(colors);
// ["blue", "yellow", "red", "abc", "123"]


var item = colors.pop(); //删除最后一项，把删除的一项保存在item
console.log(colors); 
console.log(item); //被删除的123

//["blue", "yellow", "red", "abc"]
//123

 

数组的 队列方法：

队列数据结构的访问规则FIFO（First-in-first-out，先进先出）;

shift(): 移出数组中的第一项，并返回该项，数组长度减一。

unshift(): 在数组第一个值之前添加任意个项，并返回心数组的长度；

var colors = ["blue", "yellow", "red"];
colors.unshift("abc","123"); //在数字最前添加俩个值
console.log(colors); 
//["abc", "123", "blue", "yellow", "red"]

var item = colors.shift(); //删除最前面的一个值，并保存在item
console.log(colors);
console.log(item);

// ["123", "blue", "yellow", "red"]
// abc

 

数组的重排序方法：

reverse():用来反转数组的数组;

var a = [1, 2, 3, 4, 5];
a.reverse();
//[5, 4, 3, 2, 1]

 

sort(): 比较的是字符串的位置。

sort()接受一个比较函数，比较函数接受俩个参数，如果第一个参数一个位于第二个参数之前返回一一个负数，相等返回0，第一个参数位于第二个之后返回一个正数。

function compare(value1, value2) {
if(value1 < value2) { //小于返回-1
return -1; 
}else if(value1 > value2) { // 大于则返回 1
return 1;
}else {
return 0; //等于返回0 数组的升序排列。降序排列反之即可 即第一个参数小于第二参数返回1，大于返回-1
}
}
var values = [0 ,21, 22, 34, 2, 10];
values.sort(compare);
console.log(values);

// [0, 2, 10, 21, 22, 34]

 

数组的操作方法：

concat()

concat()：先创建当前数组的一个副本，接受一个参数，然后将接收到的参数添加到数组末尾。没有参数的时候，只简单的创建副本和返回。

var colors = ["blue", "yellow", "pen"];
var colors2 = colors.concat("red","mood", ["one", "two"]);
console.log(colors);
console.log(colors2);
["blue", "yellow", "pen"]
["blue", "yellow", "pen", "red", "mood", "one", "two"]
//对于心数组color2,变成有open的那组。
//color1继续不变。

 

slice()

slice():一或多个参数，返回项的起始和结束为止。不包括结束位置的项。一个参数时返回起始位置到数组末尾。

var colors = ["blue", "yellow", "pen"];
var colors2 = colors.concat("red","mood", ["one", "two"]);
console.log(colors2);
console.log(colors2.slice(1,4));
console.log(colors2.slice(2));
console.log(colors2.slice(-2));
// ["blue", "yellow", "pen", "red", "mood", "one", "two"]
// ["yellow", "pen", "red"]
// ["pen", "red", "mood", "one", "two"]
// ["one", "two"] //-1是数组的最后一项， -2代表倒数第二我，依次类推

 

splice()

3.splice():向数组的中部插入项,始终返回一个数组。数组中包含从原始数组中被删除的元素。三种使用方式：

（1）删除： 删除任意数量的项。指定2个参数，要删除的起始位置，和删除的项数。

（2）插入：向指定位置插入任意数量的项。提供三个参数：起始位置，要删除的项数，要插入的项。

（3）替换：向指定位置插入任意数量的项。插入和删除的项可以不同。三个参数，起始位置，要删除的项数，要插入的项。

var colors = ["blue", "yellow", "pen"];
var colors2 = colors.concat("red","mood", ["one", "two"]);
colors3 = colors2.splice(-2, 2); //从倒数第二项开始，删除2个元素
colors2.splice(2, 3, "ten", "nine"); //从第三个元素开始，删除3个，替换成ten,nine
console.log(colors3);
console.log(colors2)
// ["one", "two"]
// ["blue", "yellow", "ten", "nine"]

 

数组的位置方法：

indexOf(): 接受俩个参数，要查找的项，和(可选的参数)表示查找起点位置的索引。从头开始，返回要查找的项在数组中的索引。未找到返回-1；查找按照严格相等。

indexlastOf()：和indexOf()一样，从数组末尾开始向前查找。

 

var number = [1, 2, 3, 4, 5, 7, 8, 9, 10];

 console.log(number.indexOf(2));
 console.log(number.lastIndexOf(8));
 console.log(number.lastIndexOf(7));
 // 1
 // 6
 // 5

数组的迭代方法：

概述： 一，大多数方法的第一个参数接受一个函数（即回调函数），对数组的每个元素调用一次该函数。如果是稀疏数组，对不存在的元素不调用该函数。
回调函数有三个参数: function（数组元素，元素索引，数组本身）；

 

forEach()

forEach(function(){ }，[thisObject])
第二个参数是可选的。如果有，(改变this的指向。)

forEach(): 遍历,循环数组，为每个元素调用指定的函数。

var data = [1, 2, 3, 4, 5];
var num = 0;
data.forEach(function(value) {
num +=value;
});
console.log(num);
//15

 

forEach(): 回调函数使用三个参数: function（数组元素，元素索引，数组本身）；
 

var data = [1, 2, 3, 4, 5];
 data.forEach(function(v, i, a) {
 3a[i] = v + 1;
 });
 console.log(data);
 // [2, 3, 4, 5, 6]

 

forEach无法在所有元素都传递给调用函数之前终止遍历。如果要提前终止fofEach方法放再一个try块中，并抛出一个异常。

 function foreach(a, f, t) {
 try{a.forEach(f, t);}
 catch(e) {
if(e === foreach.break) return;
 　　　　　　else　throw e;
      }
 }
 foreach.break = new Error("StopIteration");

 

map()

map(): （映射的意思） 将数组的每个元素传递给指定的回调函数，并返回一个数组。 回调函数的参数和forEach一样

 var a = [1, 2, 3];
 b = a.map(function(x) {
 return x;
 });
 //map类似于forEach 这里回调函数的参数x就是数组元素。
 console.log(b);
 [1, 2, 3]

必须要有返回值。

var data = [1, 2, 3];
console.log(data.map(function(value, index, array){}));

//[undefined, undefined, undefined]

 

filter()

filter(): (过滤，筛选的意思) 指数组filter后，返回过滤后的新数组;

回调函数用来逻辑判定，该函数返回true,或false;

var a = [1, 2, 3, 4, 5];
smallvalues = a.filter(function(x) {
return x < 3;
});
console.log(smallvalues);
// [1, 2

 

every()和some()

every()和some() : 数组元素应用回调函数进行逻辑判断，返回true，或fasle；回调函数用于设置判断条件；

every()：数组中的所有元素被回调函数判定返回true，才返回true；

var a = [1, 2, 3, 4, 5];
console.log(a.every(function(x){
return x < 10;
}));
// true

some() : 数组元素只要有一个元素返回true就返回true；所有元素都返回false，才返回false;

var a = [1, 2, 3, 4];
console.log(a.some(isNaN));
// false

 

一旦every()和some() 确认返回false或者true就会停止遍历数组元素。
在空数组上调用every()返回true，some返回false；

reduce() 和reduceRight()

reduce(): 有俩个参数，第一个是执行化简的函数（用某种方法把俩个值组合成一个值），并返回。
第二个（可选），传递给函数的初始值。
如果没有指定第二参数，将使用数组的第一个元素作为初始值。

化简函数的参数:
function(化简操作累计的结果,数组元素,元素的索引,数组本身)

var a = [1, 2, 3, 4, 5];
var sum = a.reduce(function(x,y){
return x+y;
},0);
console.log(sum);
// 15

 

reduceRight():从数组的右边向前，执行化简函数。

var a = [1, 2, 3];
var sum = a.reduce(function(x,y){
return x + y;
},0);
console.log(sum);
//类似于2 *3 *1 6