数组是js中最常用到的数据集合,其内置的方法有很多,熟练掌握这些方法,可以有效的提高我们的工作效率,同时对我们的代码质量也是有很大影响。
创建数组
一. 字面量方式
const array = [1,2,3,4,5];
二. 使用Array构造方法
1. 无参构造 - 创建一个长度为0的空数组
const array = new Array();
2. 带参构造
(1)如果只传一个数值参数,则表示创建一个初始长度为指定数值的空数组
const array = new Array(3); //length=3空数组
(2)如果传入一个非数值参数或多参数,则表示创建一个包含指定元素的数组
const array = new Array('4'); // ['4'] const array2 = new Array(1,2,3,4); // [1,2,3,4]
三. Array.of方法创建数组(es6新增)
const array = Array.of(1,2,3); // [1,2,3]
四. Array.from方法创建数组(es6新增)
const array = Array.from([4,5,6]); // [4,5,6]
数组方法
数组创建完了,接下来我们来看一下数组中的每一个方法的详细用法
1. push - 用于从数组末尾向数组添加元素,可以添加一个或多个元素,并返回新的长度。
const array = [1,2,3]; array.push(4); // [1,2,3,4] array.push(5,6,7); // [1,2,3,4,5,6,7]
2. pop - 用于删除数组的最后一个元素并返回被删除的元素。
const array = [1,2,3,4]; const value = array.pop(); // array [1,2,3] value 4
3. shift - 用于删除数组的第一个元素并返回删除的元素。
const array = [1,2,3,4]; const value = array.shift(); // 1 [2,3,4]
4. unshift - 用于向数组开头添加一个或多个元素,并返回新的长度。
const array = [4,5,6]; array.unshift(2,3); // [2,3,4,5,6] array.unshift(1); // [1,2,3,4,5,6]
5. join - 用于数组转字符串。用传入参数作为分隔符,默认逗号为分隔符。
const array = [1,2,3]; const value1 = array.join(); // '1,2,3' const value2 = array.join('-'); // '1-2-3'
6. toString和toLocaleString - 用于数组转字符串
const array = [1,2,3]; const value1 = array.toString(); // '1,2,3' const value2 = array.toLocaleString(); // '1,2,3'
7. sort - 用于数组排序
const array = [1,3,6,4]; array.sort((a,b) => {return a > b ? 1 : -1}); // 1 生序 -1 降序 [1,3,4,6]
8. reverse - 用于颠倒数组中元素的顺序
const array = [1,2,3,4]; array.reverse(); // [4, 3, 2, 1]
9. concat - 用于连接两个或多个数组。不会改变原数组,只会返回被连接数组的一个副本
const array = [1,2,3]; const value = array.concat([4,5,6],7,8,[9,10,11]); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
10. includes(es7新增) - 用于判断一个数组是否包含某个值,是返回true,否则false
const array = [0,1,2,3,4]; const value = array.includes(2); // true
11. indexOf - 用于返回数组中某个指定元素第一次出现的位置,返回索引,没有的话返回-1
const array = [0,1,2,3,4,5]; const value = array.indexOf(2); // 2
12. lastIndexOf - 用于返回一个指定的元素在数组中第一次出现的位置,从后向前搜索,没有的话返回-1
const array = [0,1,2,3,4,5,2]; const value = array.lastIndexOf(2); // 6
13. slice - 用于数组、字符串提取某个部分,并生成新的字符串或数组,不改变原数组
const array = [1,2,3,4,5,6,7]; const value = array.slice(1,3); // [2,3]
14. splice - 用于添加或删除数组中的元素,参数为 (开始位置,删除个数,添加的元素)
const array = [1,2,3,4,5,6,7]; const value = array.splice(1,3,8,9,10); // array [1, 8, 9, 10, 5, 6, 7] value [2, 3, 4]
15. find()与findIndex()(es6新增) - find返回匹配的值(第一个),findIndex返回匹配位置的索引(第一个)
const array = [1,2,3,4,5,6,7]; const value = array.find((item, keys, arr) => { return item > 3; }) // 4 const index = array.findIndex((item, keys, arr) => { return item > 3; }) // 3
16. filter - 创建一个新数组,其中的元素是通过检查指定数组中符合条件的所有元素,不会改变原数组
const array = [1,2,3,4,5,6,7]; const value = array.filter((v,i,a) => { return v > 3 }) // array [1, 2, 3, 4, 5, 6, 7] value [4, 5, 6, 7]
17. map - 用于遍历数组每个元素,返回一个新数组,元素为原始数组处理后的值。不会改变原数组
const array = [1,2,3,4,5,6,7]; const value = array.map((v,i,a) => { return v += 1 }) // array [1, 2, 3, 4, 5, 6, 7] value[2, 3, 4, 5, 6, 7, 8]
18. forEach - 用于遍历数组每个元素,并将元素传递给回调函数
let value = 0; const array = [1,2,3,4,5,6,7]; array.forEach((v,i,a) => { value += v }) // 28
19. every - 用于判断数组中的每一项是否都满足条件,只有都满足才返回true
const array = [1,2,3,4,5,6,7]; const value = array.every((v,i) => { return v > 5 }) // false
20. some - 用于判读数组中的某一项是否满足条件,只要有一项满足就返回true
const array = [1,2,3,4,5,6,7]; const value = array.some((v,i) => { return v > 5 }) // true
21. reduce - 累加器,(function, 初始值-默认0)
const array = [1,2,3,4,5,6,7]; const value = array.reduce((total,num) => { return total += num }) // 28 const value = array.reduce((total,num) => { return total += num }, 20) // 48
22. reduceRight - 同reduce,从后向前
const array = [1,2,3,4,5,6,7]; const value = array.reduceRight((total,num) => { return total += num }, 20) // 48
23. fill(es6新增) - 使用特定值填充数组中的一个或多个元素。1个参数时该参数会填充整个数组,两个或三个参数(填充的数,开始位置,结束位置)
const array = [1,2,3,4,5,6,7]; array.fill(1); // [1, 1, 1, 1, 1, 1, 1] array.fill(1,3); // [1, 2, 3, 1, 1, 1, 1] array.fill(1,3,5); // [1, 2, 3, 1, 1, 6, 7]
24. copyWithin(es6新增) - 用于从数组的指定位置拷贝元素到数组的另一个指定位置中
const array = [0,1,2,3,4,5,6,7]; array.copyWithin(3) // [0, 1, 2, 0, 1, 2, 3, 4] array.copyWithin(3, 1) // [0, 1, 2, 1, 2, 3, 4, 5] array.copyWithin(3, 1, 3) // [0, 1, 2, 1, 2, 5, 6, 7]
标签:const,元素,value,js,详解,数组,return,array From: https://www.cnblogs.com/liql/p/18083674