JS数组

一、ECMAScript数组的特点

1.ECMAScript数组对数据类型没有要求，数组的每一项都可以存不同的数据
2.数组的长度可以动态增长

二、数组的创建方法

1.new操作符 (调用数组的构造函数)

var colors = new Array();      //创建一个空数组
var colors = new Array(3);     //创建一个长度为3的空数组
var colors = new Array('red','green','blue'); //给数组添加初始值

2.数组字面量创建 (不会调用数组的构造函数)

var colors = [];          //创建一个空数组
var colors = ['red','green','blue']; //给数组添加初始值

三、对象数组

var a = [{},{},{}];//定义一个长度为3的数组，数组的每一项都是一个对象
//为数组的每一项的对象添加属性
a[0] = {
  name : 'Henry',
  age    : 24
};
a[1] = {
  name : 'Tom',
  age    : 22
};
a[2] = {
  name : 'Teddy',
  age    : 26
};
console.log(a);      //[Object,Object,Object]

四、检测数组

使用 instanceof 或 Array.isArray

arr = [1,2,3]
arr instanceof Array  //true
Array.isArray(arr)    //true

五、数组的方法

1.转换方法:toLocaleString toString valueOf join

var colors = ['red','green','blue'];

• toString toLocaleString返回数组每个值,以逗号分隔
  数组中含有对象又没有自定义toString时返回[object,object]

console.log(colors.toString());      //"red,green,blue"

• valueOf 返回原数组,元素为对象时返回object

console.log(colors.valueOf())        //['red','green','blue']；

• join 返回以指定分隔符连接的字符串

console.log(colors.join('|'))；       //"red|green|blue"

2.栈方法： push pop

• push : 把参数添加到数组末尾，并返回新的数组长度，参数个数不限

var colors = ['red','green','blue'];
console.log(colors.push('black','brown')) ;  //5
console.log(colors);  // ['red','green','blue','black','brown']

• pop :移除数组的最后一项，并返回移除的项

var colors = ['red','green','blue'];
console.log(colors.pop());  // "blue"
console.log(colors);        //['red','green']

3.队列方法：shift unshift

• shift:移除数组的第一项，数组长度减1，并返回第一项

var colors = ['red','green','blue'];
console.log(colors.shift());        //"red"
console.log(colors);                //['green','blue']

• unshift: 在数组前端添加任意项，并返回新数组的长度

var colors = ['red','green','blue'];
console.log(colors.unshift('black','brown'));  //5
console.log(colors);  //["black", "brown", "red", "green", "blue"]

实现队列：
unshift->pop 队头进，队尾出
push -> shift 队尾进，队头出
实现堆栈：
push->pop 栈顶在数组末尾
ushift->shift 栈顶在数组开始

4.重排序方法：reverse sort

• reverse: 反转数组顺序

var colors = ['red','green','blue'];
console.log(colors.reverse());  //["blue", "green", "red"]

• sort:接受一个比较函数，可以通过比较函数的返回值确定是升序还是降序

//升序比较函数：
var asceCompare =  (a,b) => a< b ?  -1 : (a == b ? 0:1)
//降序比较函数：
var descCompare = (a,b) => a< b ?  1 : (a == b ? 0:-1)
//数字比较
var numbers = [1,9,0,4,39,28,5];
console.log(numbers.sort(asceCompare));  //[0, 1, 4, 5, 9, 28, 39]
console.log(numbers.sort(descCompare))   //[39, 28, 9, 5, 4, 1, 0]
//字符串比较
var colors = ["black", "brown", "red", "green", "blue"];
console.log(colors.sort(asceCompare));  //["black", "blue", "brown", "green", "red"]
console.log(colors.sort(descCompare));  //["red", "green", "brown", "blue", "black"]

5.操作方法 ： concat slice splice

• concat : 创建当前数组的一个副本，将参数添加到副本末尾，返回新数组,原数组不变

var colors =  ['red','green'];
console.log(colors.concat('yellow',['blue',black]); 
//["red", "green", "yellow", "blue", "black"]
console.log(colors);        // ['red','green']

• slice: 返回两个位置之间的值，第二个位置不传默认为数组末尾，原数组不变

var colors = ["red", "green", "yellow", "blue", "black"];
console.log(colors.slice(2,4));               //["yellow", "blue"]
console.log(colors.slice(2));               //["yellow", "blue", "black"]

• splice:删除，插入和替换,返回删除的项，原数组改变

//删除：传入2个参数，起始位置，删除项数
var colors = ["red", "green", "black"];
console.log(colors.splice(0,2));    //["red", "green"],删除前两项
console.log(colors);                       //['black']
//插入/替换：传入三个参数，起始位置，删除项数，插入的项
var colors = ["red", "green", "black"];
console.log(colors.splice(1,1,'blue'));//[ "green"],替换第二项
console.log(colors);     //["red", "blue", "black"]
var colors = ["red", "green", "black"];
console.log(colors.splice(1,0,'blue'))//[],在第二项插入一项
console.log(colors);             //["red", "blue", "green", "black"]

6.位置方法：indexOf lastIndexOf

• indexOf : 从数组开头查找，输入两个参数：查找的值 起始位置(可选)
  返回：查找项的数组下表，没找到则返回-1

var colors = ["red", "green", "yellow", "blue", "black"];
console.log(colors.indexOf('black'));              //4

(2)lastIndexOf : 从数组末尾查找，输入两个参数：查找的值 起始位置(可选)
返回：查找项的数组下表，没找到则返回-1

var colors = ["red", "green", "yellow", "blue", "black"];
console.log(colors.lastIndexOf('black'));                  //4

7.迭代方法： every filter forEach map some

接受两个参数：
a.在每一项上运行的函数 :传入三个参数, 数组项的值，该项在数组中的位置，和数组本身
b.(可选)运行该函数的作用域对象：影响this的值,默认为全局对象】

• every:对数组的每一项执行回调函数，如果回调函数对数组每一项都返回true，则返回true

var numbers = [7,8,3,4,5];
var everyResult = numbers.every((value,index) => value>index )
console.log(everyResult);                                            //true

• some: 对数组的每一项执行回调函数，任意一项返回true则返回true

var numbers = [1,2,3,4,0];
var everyResult = numbers.every((value,index) => value<index )
console.log(everyResult);               //true

• filter:返回回调函数返回true的项组成的数组

var numbers = [1,2,3,4,5];
var everyResult  = numbers.filter((value) => value>3)
console.log(everyResult);        //[4,5]                              

• forEach:遍历数组，元素租不变，无返回值，相当于for循环

var numbers = [1,2,3,4,5];
var everyResult  = numbers.forEach((value) => {console.log(value)})
console.log(everyResult);   //undefined
console.log(numbers);    // [1,2,3,4,5]

• map:对数组的每一项执行callback函数，返回每次函数执行结果组成的数组

var numbers = [1,2,3,4,5];
var everyResult  = numbers.map((value) => value*value)
console.log(everyResult);   //[1,4,9,16,25]
console.log(numbers);    // [1,2,3,4,5]

8.归并方法： reduce reduceRight

reduce 从数组的第一项开始遍历到最后
reduceRight 从数组的最后一项向前遍历到数组的第一项
两个参数：每一项上执行的回调函数和归并的初始值（可选），不传入初始值默认为数组的第一项
回调函数的参数：前一个值，当前值，项的索引，数组对象

【函数的返回值会作为第一个参数传给下一项】

var value = [1,2,3,4,5,6];
var sum = value.reduce((pre,cur,index,array)=>{return pre+cur},2);//初始值为2                  
console.log(sum);          //23 数组的和加上初始值