定义
作用:存储一组变量
取值:数组名[下标]
元素:数组中保存的每个数据都叫数组元素
下标:数组中数据的编号
长度:数组中数据的个数,通过数组的length属性获得
1.创建数组
使用new Array() 创建数组
javascript
// 元素值类型为字符型
var area = new Array('Beijing', 'Shanghai', 'Shenzhen');
// 元素值类型为数值型
var score = new Array(56, 68, 98, 44);
// 元素值类型为混合型
var mix = new Array(123, 'abc', null, true, undefined);
// 空数组
var arr1 = new Array(); // 或 var arr2 = new Array;使用 [ ] 创建数组
javascript
var weather = ['wind', 'fine',]; // 相当于:new Array('wind', 'fine',)
var empty = []; // 相当于:new Array
var mood = ['sad', , , ,'happy']; // 控制台输出mood:(5) ["sad", empty × 3, "happy"]2.操作数组
获取数组长度
使用.length
javascript
var arr1 = [78, 88, 98];
var arr2 = ['a', , , , 'b', 'c'];
console.log(arr1.length); // 输出结果为:3
console.log(arr2.length); // 输出结果为:6设置数组长度
使用.length并初始化
大于留空
小于删除
javascript
var arr1 = [];
arr1.length = 5;
console.log(arr1); // 输出结果:(5) [empty × 5]
var arr2 = [1, 2, 3];
arr2.length = 4;
console.log(arr2); // 输出结果:(4) [1, 2, 3, empty]
var arr3 = ['a', 'b'];
arr3.length = 2;
console.log(arr3); // 输出结果:(2) ["a", "b"]
var arr4 = ['hehe', 'xixi', 'gugu', 'jiujiu'];
arr4.length = 3;
console.log(arr4); // 输出结果:(3) ["hehe", "xixi", "gugu"]遍历数组
for in 循环
javascript
var navlistArr = ['首页','新闻','关于'];
var str = '<ul>';
for(var i in navlistArr){
str += '<li><a>'+ navlistArr[i] +'</a></li>';
}
str += '</ul>';
document.getElementById('navlist').innerHTML = str;3.操作元素
使用 数组名[下标]的方式
增加元素
javascript
// 为空数组添加元素
var height = [];
height[5] = 183;
height[0] = 175;
height[3] = 150;
console.log(height); // 输出结果:(6) [175, empty × 2, 150, empty, 183]
// 为非空数组添加元素
var arr = ['Asa', 'Taylor'];
arr[2] = 'Tom';
arr[3] = 'Jack';
console.log(arr); // 输出结果:(4) ["Asa", "Taylor", "Tom", "Jack"]删除元素
delete 数组名[下标]
删除后依旧占用空间
javascript
var stu = ['Tom', 'Jimmy', 'Lucy'];
console.log(stu); // 输出结果:(3) ["Tom", "Jimmy", "Lucy"]
delete stu[1]; // 删除数组中第2个元素
console.log(stu); // 输出结果:(3) ["Tom", empty, "Lucy"]修改元素
javascript
var arr = ['a', 'b', 'c', 'd'];
arr[2] = 123;
arr[3] = 456;
console.log(arr); // 输出结果:(4) ["a", "b", 123, 456]解构赋值
javascript
// 传统方式
var arr = [1, 2, 3];
var a = arr[0];
var b = arr[1];
var c = arr[2];javascript
// ES6解构赋值
var arr = [1, 2, 3];
[a, b] = arr;
console.log(a + ' - ' + b); // 输出结果:1 - 2
var n1 = 4, n2 = 8;
[n1, n2] = [n2, n1];
console.log(n1 + ' - ' + n2); // 输出结果:8 - 4查找数组
javascript
var arr = ['hello', 'JavaScript', 22.48, true];
console.log(arr[0]);
console.log(arr[2]);
console.log(arr);4.数组属性与方法
| 方法 | 功能 |
|---|---|
| push() | 向数组尾部添加元素 |
| pop() | 删除数组尾部元素 |
| shift() | 删除数组头部元素 |
| unshift() | 向数组头部添加元素 |
| 方法 | 功能 |
|---|---|
| reverse() | 反转数组 |
| sort() | 对数组元素进行排序 |
| join() | 将数组元素连接成字符串 |
| concat() | 连接两个数组 |
| slice() | 截取数组 |
| splice() | 删除数组元素 |
| indexOf() | 查找数组元素位置 |
| forEach() | 遍历数组 |
| map() | 映射数组 |
| filter() | 过滤数组 |
| every() | 判断数组元素是否满足条件 |
| some() | 判断数组元素是否满足条件 |
| reduce() | 数组元素累加 |
| reduceRight() | 数组元素累加 |
| find() | 查找数组元素 |
| findIndex() | 查找数组元素位置 |
| fill() | 填充数组 |
| entries() | 返回数组元素键值对 |
| keys() | 返回数组元素键名 |
| values() | 返回数组元素键值 |
| Symbol.iterator() | 返回数组迭代器 |
| includes() | 判断数组是否包含某个元素 |
| Array.isArray() | 判断是否为数组 |
| Array.from() | 将类数组对象转换为数组 |
| Array.of() | 将一组值转换为数组 |
| indexOf() | 查找数组元素位置 |
| lastIndexOf() | 查找数组元素位置 |
5.MAP集合
6.set集合
7.迭代器
一、基本操作
1.数组定义
作用:存储一组变量
取值:数组名[下标]
元素:数组中保存的每个数据都叫数组元素
下标:数组中数据的编号
长度:数组中数据的个数,通过数组的length属性获得
2.创建数组
javascript
var 数组名 = new Array()
var 数组名 = [ ]javascript
var arr = new Array(123, 'abc', null, ,true, undefined)
var arr = [123, 'abc', null, ,true, undefined]3.获取长度
javascript
.lengthjavascript
var arr1 = [78, 88, 98];
console.log(arr1.length); // 输出结果为:34.遍历数组
for in 循环
javascript
var navlistArr = ['首页','新闻','关于'];
var str = '<ul>';
for(var i in navlistArr){
str += '<li><a>'+ navlistArr[i] +'</a></li>';
}
str += '</ul>';
document.getElementById('navlist').innerHTML = str;5.增加元素
javascript
// 为空数组添加元素
var height = [];
height[5] = 183;
height[0] = 175;
height[3] = 150;
console.log(height); // 输出结果:(6) [175, empty × 2, 150, empty, 183]
// 为非空数组添加元素
var arr = ['Asa', 'Taylor'];
arr[2] = 'Tom';
arr[3] = 'Jack';
console.log(arr); // 输出结果:(4) ["Asa", "Taylor", "Tom", "Jack"]6.删除元素
删除后依旧占用空间
javascript
var stu = ['Tom', 'Jimmy', 'Lucy'];
console.log(stu); // 输出结果:(3) ["Tom", "Jimmy", "Lucy"]
delete stu[1]; // 删除数组中第2个元素
console.log(stu); // 输出结果:(3) ["Tom", empty, "Lucy"]7.修改元素
javascript
var arr = ['a', 'b', 'c', 'd'];
arr[2] = 123;
arr[3] = 456;
console.log(arr); // 输出结果:(4) ["a", "b", 123, 456]解构赋值
javascript
// 传统方式
var arr = [1, 2, 3];
var a = arr[0];
var b = arr[1];
var c = arr[2];javascript
// ES6解构赋值
var n1 = 4
var n2 = 8;
[n1, n2] = [n2, n1];8.查找数组
javascript
var arr = ['hello', 'JavaScript', 22.48, true];
console.log(arr[0]);
console.log(arr[2]);
console.log(arr);二、二维数组
1.创建数组
javascript
var 数组名 = new Array(new Array(),new Array())
var 数组名 = [[],[]]javascript
var arr = new Array(new Array(12,59,66),new Array(212,32))
var arr = [[12,59,66],[212,32]]2.遍历数组
javascript
var arr = [[12,59,66],[212,32]]
var sum = 0
for(let i in arr){
for(let j in arr[i]){
sum += arr[i][j]
}
}
console.log(sum) // 3813.数组转置
javascript
var arr = [[1,2,3],[4,5,6],[7,8,9],[10,11,12]]
console.log("转置前",arr)
/*
[
[1,2,3],
[4,5,6],
[7,8,9],
[10,11,12]
]
*/
//定义空数组存放转置后的值
var res = []
for(i=0;i<arr[i].length;i++){
//获取层数
res[i] = []
for(j=0;j<arr.length;j++){
//交换位置
res[i][j]=arr[j][i]
}
}
console.log("转置后",res)
/*
[
[1, 4, 7, 10]
[2, 5, 8, 11]
[3, 6, 9, 12]
]
*/三、数组排序
1.冒泡排序
javascript
var arr = [12,56,2,11,23,101,64]
for(i=1;i<arr.length;i++){
for(j=0;j<arr.length-i;j++){
if(arr[j]>arr[j+1]){
var temp = arr[j]
arr[j] = arr[j+1]
arr[j+1] = temp
}
}
}
console.log(arr) // [2, 11, 12, 23, 56, 64, 101]2.插入排序
3.快速排序
4.选择排序
5.希尔排序
6.归并排序
7.堆排序
8.桶排序
10.计数排序
四、数组方法
1.栈和队列
| 方法 | 功能 |
|---|---|
| push() | 向数组尾部添加元素 |
| pop() | 删除数组尾部元素 |
| shift() | 删除数组头部元素 |
| unshift() | 向数组头部添加元素 |
2.检索方法
| 方法 | 功能 |
|---|---|
| includes() | 判断数组是否包含某个元素 |
| Array.isArray() | 判断是否为数组 |
| indexOf() | 查找数组中第一个该元素位置 |
| lastIndexOf() | 查找数组中最后一个该元素位置 |
3.数组转字符串
| 方法 | 功能 |
|---|---|
| join() | 将数组元素连接成字符串 |
| toString() | 返回一个字符串 |
4.数据过滤
| 方法 | 功能 |
|---|---|
| filter() | 过滤数组 |
直接修改数组
javascript
//筛选出偶数
const arr = [3,4,5,6,7,8]
const arr2 = arr.filter(number => number %2 == 0)
console.log(arr2) // [4,6,8]数据筛选
javascript
//筛选高价值客户
//过去一年内消费总额超过10000元或订单数量超过10个的高价值客户
/*
customers:客人数组
id:唯一id
name:客人名称
orders:订单数组
amount:金额
date:日期
*/
const customers = [
{ id: 1, name: '张三', orders: [
{ amount: 1200, date: '2023-05-15' },
{ amount: 2500, date: '2023-07-22' },
{ amount: 1800, date: '2023-08-05' }
]},
{ id: 2, name: '李四', orders: [
{ amount: 9000, date: '2023-03-01' },
{ amount: 2200, date: '2023-09-12' }
]},
{ id: 3, name: '王五', orders: [
{ amount: 750, date: '2023-02-17' },
{ amount: 1100, date: '2023-04-03' },
{ amount: 1500, date: '2023-05-09' },
{ amount: 1300, date: '2023-06-21' }
]},
{ id: 4, name: '赵六', orders: [
{ amount: 2000, date: '2023-01-05' },
{ amount: 1700, date: '2023-02-20' },
{ amount: 2300, date: '2023-03-18' }
]},
{ id: 5, name: '孙七', orders: [
{ amount: 3500, date: '2023-04-08' },
{ amount: 4200, date: '2023-05-22' }
]},
{ id: 6, name: '老八', orders: [
{ amount: 550, date: '2023-03-02' },
{ amount: 850, date: '2023-08-16' }
]},
];
const highCustomer = customers.filter(people => { //从customers数组中筛选具体的对象
const cost =people.orders.reduce((sum,times) => { //将上述对象中的orders中的amount累加
const orderDate = new Date(times.date) //获取订单时间
const currentDate = new Date() //获取当前日期 2025-1-6
currentDate.setFullYear(currentDate.getFullYear() -2)
// getFullYear()获取当前时间 2025,setFullYear()设置当前时间 2025
return sum + (orderDate >= currentDate ? times.amount : 0)
},0) // 初始值为0,从0开始相加
return cost >= 10000 || people.orders.length >10
})
console.log(highCustomer);
/*
{ id: 2, name: '李四', orders: [
{ amount: 9000, date: '2023-03-01' },
{ amount: 2200, date: '2023-09-12' }
]}
*/数据清洗
数据过滤
5.其他方法
| 方法 | 功能 |
|---|---|
| reverse() | 反转数组 |
| sort() | 对数组元素进行排序 |
| concat() | 连接两个数组 |
| slice() | 截取数组 |
| splice() | 删除数组元素 |
| forEach() | 遍历数组 |
| map() | 映射数组 |
| every() | 判断数组元素是否满足条件 |
| some() | 判断数组元素是否满足条件 |
| reduce() | 数组元素累加 |
| reduceRight() | 数组元素累加 |
| find() | 查找数组元素 |
| findIndex() | 查找数组元素位置 |
| fill() | 填充数组 |
| entries() | 返回数组元素键值对 |
| keys() | 返回数组元素键名 |
| values() | 返回数组元素键值 |
| Symbol.iterator() | 返回数组迭代器 |
| Array.from() | 将类数组对象转换为数组 |
| Array.of() | 将一组值转换为数组 |
标签匹配
修改原数组
- push:末尾添加
- pop:末尾删除
- unshift:开头添加
- shift:开头删除
- splice:增删改
- reverse:反转
- sort:排序
不修改原数组
- concat:合并
- slice:提取
- map:挨个执行函数
- filter:过滤
- flat:拉平数组
- flatMap:先map再flat
迭代与遍历
- forEach:挨个执行函数,不返回
- reduce:累加器
- every:检查全部满足
- some:检查部分满足
查找与判断
- find:找第一个元素
- findIndex:找第一个元素索引
- includes:判断是否包含
- indexOf:找首次出现元素索引
- lastindexOf:找最后出现元素索引
转换与拼接
- join:添加连接符号
- toString:转字符串
- toLocalString:转本地化字符串
