一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第 10 天，点击查看活动详情。
介绍
数组是 javascript 当中很常见的一种数据存储结构，数组在内存当中按照顺序排列，每一个数组元素占用的内存是相同的，这也是为什么我们可以通过数组的下标来获取数组当中对应位置的元素。
数组的定义
// 定义一个空数组
// 第一种方法：利用Array对象来定义数组
let arr1 = new Array();
console.log(arr1); //Array[0]
// 第二种方法：直接定义一个数组
let arr2 = [];
console.log(arr2); //Array[0]
// 这两种方法实现的结果都是一样的，但是更推荐第二种
数组添加元素
// 对数组添加元素
// 先定义一个数组，里面保存三个元素
let color = ["red", "blue", "sky"];
// 向数组的最后面添加第四个元素
color[3] = "green";
console.log(color); //["red", "blue", "sky", "green"]
// 3是数组的下标，数组的下标从0开始，0对应第一个元素，依次向下，第四个元素的下标为3
// 修改数组的当中的元素
color[2] = "black";
console.log(color); //["red", "blue", "black", "green"]
//总结：利用下标修改虽然很直接，但是要知道每个元素的下标是多少，
//并且这样子对数据的处理效率很低
数组的属性
// length：数组的长度
let list = [1, 2, 3, 4, 5, 6];
console.log(list.length); //6
// 数组的长度代表着里面有多少个元素，一个元素代表着一个长度，长度和下标是不同的，每个数组都要长度，空数组长度为0
//constructor：返回对创建此对象的数组函数的引用
console.log(list.constructor); //ƒ Array() { [native code] }
// prototype:让你有能力向对象添加属性和方法
// 向数组的原型对象添加一个数组
Array.prototype.name = "张三";
console.log(list.name); //张三
数组对象的内置属性
- concat 拼接两个数组
let list = [1, 2, 3, 4, 5, 6];
let color = ["red", "blue", "sky", "green"];
// concat 拼接两个数组
// concat拼接两个数组并且返回一个新的数组
let newArr = color.concat(list);
console.log(newArr); //["red", "blue", "black", "green", 1, 2, 3, 4, 5, 6]
- join
// join 把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔,默认为，
console.log(color.join()); //red,blue,black,green
console.log(color.join("*")); //red*blue*black*green
- pop
// pop删除并且返回数组最后一个元素
let colorRemove = color.pop(); //green
- push
// push向数组的末尾添加一个或更多元素，并返回新的长度
let newColor = color.push("sky", "witer"); //
console.log(newColor); //5 注意是返回新的长度
- shift
//shift 删除并返回数组的第一个元素
let colorItem = color.shift();
console.log(colorItem); //red
- splice
// splice 删除元素，并向数组添加新元素
// 语法：arrayObject.splice(index,howmany,item1,.....,itemX)
// index：必需。整数，规定添加/删除项目的位置，使用负数可从数组结尾处规定位置
// howmany：必需。整数，规定要删除的个数
// item1：可选，要添加的元素
color.splice(1, 1, "witer");
console.log(color); //"red", "witer", "black", "green"
- unshift
// unshift 向数组的开头添加一个或更多元素，并返回新的长度
let colorLength = color.unshift("mauve");
console.log(colorLength); //5
####数组高阶函数的使用
- forEach(遍历数组元素)
// forEach 遍历数组元素
// forEach和for循环差不多，但是forEach更方便和直观
color.forEach((item) => {
console.log(item); // 循环输出 red blue black green
});
- filter(过滤，返回新数组)
let numArr = [5, 9, 78, 45, 25, 14, 36];
let newNumArr = numArr.filter((item) => {
return item > 9; //判断每个数组是否大于9 大于9的话返回给新
});
console.log(newNumArr); //78, 45, 25, 14, 36
- map(映射，返回新数组)
// map按照原始数组的排序方式依次对数组进行处理
// map返回一个新数组
let numArr = [5, 9, 78, 45, 25, 14, 36];
let newNumArr = numArr.map((item) => {
return item * 10; //对元素的每一个都进行处理操作
});
console.log(newNumArr); //50,90,780,450,250,140,360
- some(判断是否含有符合条件的元素，返回布尔值)
// some(判断是否含有符合条件的元素，返回布尔值)
// some() 方法用于检测数组中的元素是否满足指定条件（函数提供）。
// some() 方法会依次执行数组的每个元素：
// 如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测。
// 如果没有满足条件的元素，则返回false。
let numArr = [5, 9, 78, 45, 25, 14, 36];
let isItem = numArr.some((item) => {
return item > 78; //判断是否有元素大于78的
});
console.log(isItem); //false
- every(判断是否全部元素符合条件，返回布尔值)
// every 判断是否全部元素都符合条件
// every() 方法用于检测数组所有元素是否都符合指定条件（通过函数提供）。
// every() 方法使用指定函数检测数组中的所有元素：
// 如果数组中检测到有一个元素不满足，则整个表达式返回 false ，且剩余的元素不会再进行检测。
// 如果所有元素都满足条件，则返回 true。
let numArr = [5, 9, 78, 45, 25, 14, 36];
let isItem = numArr.every((item) => {
return item > 10;
});
console.log(isItem);
- reduce(累加)
// reduce（累加）
// reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。
// reduce() 可以作为一个高阶函数，用于函数的 compose。
// 注意: reduce() 对于空数组是不会执行回调函数的。
// 回调函数参数：total 必需。初始值, 或者计算结束后的返回值； currentValue 必需。当前元素； index 可选。
// 当前元素的索引值； arr 可选。当前元素所属的数组对象。
let numArr = [5, 9, 78, 45, 25, 14, 36];
let total = numArr.reduce((item) => {
return item * 5; //每个元素乘以五再相加
});
console.log(total); //78125
