JavaScript中数组常用操作和遍历方法

数组的创建方式

1.字面量

let a=[1,2,3]	//[1,2,3]

2.构造器

let a=new Array(1,2,3)	//[1,2,3]

3.Array.of()

let a=Array.of(1,2,3)	//[1,2,3]

4.Array.from()用于将字符串或者具有length属性的对象转化为数组

let a='abcdefg'
let b=Array.from(a)
console.log(b)		//['a','b','c','d','e','f','g']

let a={ 0: "xiaohei", 1: 18, length: 2 }
let b=Array.from(a)
console.log(b)		//['xiaohei', 18 ]

改变原数组的操作方法

1. pop()删除最后一个元素，返回被删除的元素

let a=[1,2,3]
console.log(a.pop())	//3
console.log(a)	//[1,2]

2. push()在数组后面添加一个元素，返回被改变后的数组的length

let a=[1,2.3]
console.log(a.push(5))	//4
console.log(a)	//[1,2,3,5]

3. shift()删除数组的第一个元素，返回被删除的元素

let a=[1,2,3]
console.log(a.shift())	//1
console.log(a)	//[2,3]

4. unshift()在数组的前面添加一个元素，返回被改变后的数组的length

let a=[1,2,3]
console.log(a.unshift(5))	//4
console.log(a)	//[5,1,2,3]

5. reverse()颠倒数组中的元素，返回被改变后的数组

let a=[1,2,3]
console.log(a.reverse())	//[3,2,1]
console.log(a)	//[3,2,1]

6. splice()用于删除/添加元素，第一个参数必填，代表从index下标开始删除，写负值会从后面向前数。第二个参数代表要删除的元素的个数，0代表不删除任何元素，如果超出数组范围，则操作到最后一个元素为止。后面的参数表示要加入数组的新元素，可以写多个。返回被删除的元素组成的新数组，如果没有元素被删除，则返回空数组。

//不删除元素
let a=[1,2,3,4]
console.log(a.splice(1,0,'a'))	//[]
console.log(a)	//[1,'a',2,3,4]
//删除元素并且替换成其他元素
let a=[1,2,3,4,5]
console.log(a.splice(1,2,'a','b','c'))	//[2,3]
console.log(a)	//[1,'a','b','c',4,5]

7. sort()对数组进行排序，参数为一个函数，不传参数默认按字母升序，如果元素不是字符串会默认调用toStrign()方法转换为Unicode再进行比较

//不穿参数默认按字母升序
let a=['a','c','b']
console.log(a.sort())	//['a','b','c']
//传参数让排序降序
let a=['a','c','b']
console.log(a.sort((a,b)=>b-a))	//['c','b','a']

利用传入的函数还可以对数组进行自定义排序

//下面实现对数组中的每一个对象按年龄从小到大进行排序
let a = [
  { name: "xiaohei", age: 18 },
  { name: "xiaobai", age: 16 },
  { name: "xiaohuang", age: 17 },
  { name: "xiaohua", age: 19 }
];
console.log(
  a.sort((a, b)=>{
    a.age - b.age;
  })
);	//[{name:'xiaobai',age:16 },{name:'xiaohuang',age:17 },{name:'xiaohei',age:18 },{name:'xiaohua',age:19 }]

8. fill()填充数组，第一个参数必填，表示要填充到数组中的内容，第二个参数和三个参数可选，代表开始位置和结束位置（不包括结束位置）,第一个参数不填默认从0开始，第三个参数不填默认填充到最后一个元素。返回被改变后的数组

let a = [1, 2, 3, 4, 5, 6];
console.log(a.fill("a", 1，4))	//[ 1, 'a', 'a', 'a', 5, 6 ]

不改变原数组的操作方法

1. join()把数组中的所有元素用分隔符进行分隔然后放入一个新的字符串，返回新的字符串,默认为逗号

let a=['b','a','c']
console.log(a.join())	//'b,a,c'

let a=[[1,2],3,[5,6]]
console.log(a.join())	//'1,2,3,5,6'
//如果改变默认分隔符
let a=[[1,2],3,[5,6]]
console.log(a.join('+'))	//'1,2+3+5,6'

2. slice()拷贝数组，第一个参数为起始位置，默认为0，第二个参数为结束位置（不包含），第二个参数不写默认直到数组结束。返回值为拷贝后得到的新数组。

let a=[1,2,3,4,5]
console.log(a.slice(1,3))	//[2,3]

3. concat()用于合并两个或多个数组或把某字符串合并到数组中,返回合并后的新数组

let a=[1,2,3]
console.log(a.concat([3,2,1]))	//[ 1, 2, 3, 3, 2, 1 ]
console.log(a.concat('a','b',[4]))	//[ 1, 2, 3, 'a', 'b', 4 ]

4. …合并数组

let a = [0, 1, 2];
let b = [...a, 3, 4, 5];	//[ 0, 1, 2, 3, 4, 5 ]

5. indexOf()判断数组中有没有某一个元素，第一个参数为被查找的元素，第二个参数可选，为开始查找的位置， 返回值为该元素匹配的下标，如果返回值为-1，表示不存在。

let a=[1,2,3,4]
console.log(a.indexOf(8))	//-1
console.log(a.indexOf(3))	//2

6. lastIndexOf()判断某一个元素在数组中出现的最后一次的位置，返回下标，-1表示不存在

let a=[1,2,3,4,5,4,3,2,1]
console.log(a.lastIndexOf(4))	//5
console.log(a.lastIndexOf(7))	//-1

7. includes()判断数组中存在某一个元素与否，返回布尔值，与indexOf()和lastIndexOf()不同的是includes()可以判断NaN

let a = [1, 2, 3, 4, NaN];
console.log(a.includes(6));	//false
console.log(a.includes(NaN));	//true

数组的遍历方法

ES6

1. find()找出数组中第一个符合回调函数条件的元素，如果没找到则返回undefined

let a=[1,2,3,4]
console.log(a.find(item=>item>5))	//undefined
console.log(a.find(item=>item>2))	//3

2. findIndex()找出数组中第一个符合函数条件的元素的下标，如果没找到返回-1

let a = [1, 3, 3, 4, 5, 6];
console.log(
  a.findIndex(item => {
    item % 2 == 0;
  })
);	//3
console.log(
  a.findIndex(item => {
    item > 10;
  })
);	//-1

ES5

1. forEach()参数为一个函数，函数的参数有当前元素的值（必填），当前元素下标，数组对象本身。

let a=[1,2,3]
a.forEach((item,index,arr)=>console.log(item,index,arr))
//1 0 [ 1, 2, 3 ]
//2 1 [ 1, 2, 3 ]
//3 2 [ 1, 2, 3 ]

2. some()用来判断数组中是否有至少一个元素符合函数条件,返回布尔值

let a=[1,2,3]
console.log(a.some(item=>item%2==0))	//true
console.log(a.some(item=>item>5))	//false

3. every()判断数组中的每一个元素是否全部符合函数条件，返回布尔值

let a=[5,6,7]
console.log(a.every(item=>item>1))	//true
console.log(a.every(item=>item>5))	//false

4. filter()过滤元素，返回符合条件的元素组成的新数组

let a=[1,2,3,4,5,6]
console.log(a.filter(item=>item%2==0))	//[2,4,6]

5. Map()对数组中的每一个元素进行处理，返回新的数组。

let a=[1,2,3]
console.log(a.map(item=>item*3))	//[3,6,9]

6. reduce()累加器，把数组中的元素累加到一起。参数为一个函数，函数的参数第一个第二个必填，分别代表上次计算的总数和将要被计算的元素，第三个第四个参数可选，分别为当前元素的下标和数组本身。

let a=[1,2,3,4,5]
console.log(a.reduce((a,b)=>a+b,0))	//15