JavaScript中的Array数组方法

数组

和其他的语言不一样的是：ECMAScript中的每一项可以保存任何的数据类型

创建数组：

  var myArr = new Array(3);//创建包含3项的数组
  var myArr2 = new Array("Today");//创建包含1项的，数值为Today的

length属性

我们可以通过length属性来访问数组的长度,但是有点要注意的：length不仅可读，还可写。

let arr = ["green","yellow","red"];
arr.length = 2;
console.log(arr,arr[2]);//[ 'green', 'yellow' ] undefined

小技巧：通过length在数组的最后添加值，和push()一样的效果

arr[arr.length] = "blue";//[ 'green', 'yellow', 'red', 'blue' ]

数组检测

如果说在一个全局的作用域当中使用instanceof是可以的，但是如果网页中包含了多个框架，有不同的Array构造函数，全局作用域不一样，那就很尴尬了。

ES5提供了一个方法isArray。他只判断某个值是不是数组，不管是在哪个执行环境

if(value instanceof Array){
  //some handle
}
if(Array.isArray(value)){
  //some handle
}

转换方法toString,valueOf,toLocaleString

1. valueOf返回的数组本身
2. toString返回的是数组每个值的字符串形式拼接的一个以逗号分隔的字符串
3. toLocaleString(平时和上面俩一样)

arr.valueOf();//[ 'green', 'yellow', 'red', 'blue' ]
arr.toString();//green,yellow,red,blue

拼接字符串join()

值得注意的一点的是join(),不会改变原数组，返回一个新的数组

1. join()不带参数，默认以逗号拼接
2. join("|")一个参数(用作分隔符的字符串)

let arr = ["green", "yellow", "red"];
let arr2=arr.join("|");
console.log(arr);//[ 'green', 'yellow', 'red' ]
console.log(arr2);//'green|yellow|red'

栈方法push(),pop()

栈是一种LIFO的数据节后(Last-In-First-Out)后进先出

push:Array.push(value)

1. 从数组末端推入参数(接受任意数量任意类型参数)
2. 改变原数组
3. 返回值:数组length长度

pop:Array.pop()

1. 从数组末端抛出一个参数
2. 改变原数组
3. 返回值:抛出的参数

let arr = ["green", "yellow", "red"];
let arr2 = arr.push("blue", {a: 1}, [2, 3], undefined, null, "最后一个参数");
let arr3 = arr.pop();

console.log(arr);
console.log(arr2);//9
console.log(arr3);//最后一个参数

队列方法shift(),unshift();

shift:Array.shift()

1. 从数组前端抛出一个参数(与pop位置相反)
2. 改变原数组
3. 返回值:抛出的参数

unshift:Array.unshift()

1. 从数组前端推入参数(与push位置相反)
2. 改变原数组
3. 返回值:数组length长度

重排序 reverse(),sort()

reverse:反转数组，会改变原数组。

let arr = [1,3,10,4,9,5,8];
arr.reverse();
console.log(arr);//[ 8, 5, 9, 4, 10, 3, 1 ]

sort:调用数组的每一项toString()方法，然后比较得到的字符串，在来排序(根据unicode值).

let arr = [1,3,10,4,19,5,8];//[ 1, 10, 19, 3, 4, 5, 8 ]
let arr2 = ["s","h","f","sd"];//[ 'f', 'h', 's', 'sd' ]
arr.sort();
arr2.sort();
console.log(arr,arr2);

但是这样排起来感觉很奇怪，这并不是我们想要,我们想要的是按顺序排.所以这里可以接收一个比较函数。函数中两个参数分别代表比较的前一个数和后一个数。

let arr = [1,3,10,4,19,5,8];
arr.sort((v1,v2)=>{ return v1-v2 });//[ 1, 3, 4, 5, 8, 10, 19 ]
arr.sort((v1,v2)=>{ return v2-v1 });//[ 19, 10, 8, 5, 4, 3, 1 ]
console.log(arr);

在上个栗子当中我们总结：

1. 函数返回正数就是换位置，负数不换位置
2. v1-v2为正排序。v2-v1为倒排序
3. 会覆盖原来的数组，返回排序好的数组

操作方法concat(),slice(),splice()

concat:合并数组

1. 接收参数为非数组,简单的添加到数组后
2. 接收参数为数组,每一项都添加在数组后
3. 可以接收多个参数
4. 返回一个新数组
5. 原数组不变

let arr = [1,"hello","red"];
let arr2 = ["world",{a:1},null,undefined,()=>{return "fn"}];
let a = "blue";

let arr3 = arr.concat(a,arr2);//[ 1, 'hello', 'red','blue', 'world', { a: 1 }, null, undefined, [Function] ]

slice:拆分数组

1. 一个参数:截取参数1到最后的数组(不包含参数1位置的数)
2. 两个参数:截取参数1到参数2的所有数组成数组(不包含1，包含2)
3. 返回截取数组
4. 原数组不变

let num =[1,2,3,4,5,6,7,8,9];
let result = num.slice(3,this.length);//[ 4, 5, 6, 7, 8, 9 ]

splice:拼接数组
5. 删除:俩参数,在数组中从参数1(index)删除参数2(number数量)个值。
6. 插入:n参数,在数组中从参数1(index)删除0个,添加参数3～参数100的值
7. 替换:n个参数,在数组中从参数1(index)删除参数2(number数量)个值,添加参数3～参数100的值

注意: 返回的是在原数组中删除的值

let arr = [0,1,2,3,4,5,6,7,8,9];

let result = arr.splice(4,2);
let result1 = arr.splice(4,0,"hello");
let result2 = arr.splice(4,2,"hello","world");

位置方法indexOf(),lastIndexOf()

Array.indexOf(value,count)

indexOf:数组前端开始第(count)项开始寻找第一个(value)并返回索引值。

lastIndexOf:数组后端开始第(count)项开始寻找第一个(value)并返回索引值。

let num = [1,3,5,7,9,7,5,3,2,1];
console.log(num.indexOf(5));//2
console.log(num.indexOf(5,3));//6

注意:只是查找并不会改变数组

迭代方法 every(),some(),forEach(),map(),filter();

some():参数:函数,任意一项为true返回true;

every():参数:函数,所有返回true返回true;

let arr = ["a","b","c","d"];
let arr2 = arr.every((item,index,array)=>{
    return item=="a"?true:false;
});//false
let arr3 = arr.some((item,index,array)=>{
    return item=="a"?true:false;
});//true

forEach():参数:函数，没有返回值

let arr4 = arr.forEach((item,index,array)=>{
    //some handle
})

map():返回每次调用函数生成的结果

let arr2 = arr.map((item,index,array)=>{
    return item +=1;
});//arr2=[ 'a1', 'b1', 'c1', 'd1' ]

filter:返回由返回值为true的项组成的数组

let arr = ["a","b","c","d","a"];
let arr2 = arr.filter((item,index,array)=>{
    return item == "a"
});//arr2 = [ 'a', 'a' ]

归并方法 reduce(),reduceRight()(迭代)

Array.reduce(prev,cur,index,array){return prev+cur}

let arr = [1, 2, 3, 4, 5, 6];
let sum = arr.reduce((prev, cur,index,array) => {
    return prev + cur;
});//21

reduceRight就是数组右边开始向左归并。prev是前一个数，cur是后一个数，在每次归并之后，prev会成为之前归并所得的值。

小结:
会改变数组的方法有:

1. 栈方法push,pop,shift,unshift
2. reverse,sort,数据操作splice

不改变数组的方法有:

1. 归并reduce，reduceRight 可以返回求合的值
2. 迭代some,every,filter,forEach,map 返回需求的值
3. 查询位置indexOf,lastIndexOf 返回value的index
4. join,数组操作concat，slice