JavaScript的集合容器
1. Array
Array
对象支持在单个变量名下存储多个元素。
- JavaScript 数组是可调整大小的,并且可以包含不同的数据类型。
- JavaScript 数组的索引从 0 开始。
- JavaScript 数组允许重复元素
1.1 创建数组的两种方式
- 通过
[]
创建
let arr = ['张三', '李四', '王五'];
- 通过
new
关键字创建
let arr = new Array('张三', '李四', '王五');
1.2 数组常用的属性
length
:返回数组的元素长度
1.3 数组常用的方法
push()
:添加元素到数组的尾部unshift()
:添加元素到数组的首端pop()
:移除数组中尾部的一个元素shift()
:移除数组中首端的一个元素splice(startIndex, deleteCount)
:从指定索引开始删除并指定删除元素数量,用一个数组返回删除的元素splice(startIndex, deleteCount, element1, element2)
:从指定索引开始删除并指定删除元素数量,再指定一个或多个元素替换删除的元素,用一个数组返回删除的元素indexOf()
:查找元素的索引map()
:映射器filter()
:过滤器reduce()
:累加器
const arr = [1, 3, 5, 7, 9];
// 对元素进行处理后,返回一个新数组
const newArr = arr.map((element) => {
return element + "hello";
})
// 对元素进行过滤后,返回一个新数组
const newArr = arr.filter((element => {
return element > 3;
}));
// 累计器,返回累计处理的结果
// 下面操作即将数组元素累加,没有指定accumulator的初始值,它的初始值为数组第一个元素
const result = arr.reduce((accumulator, currentValue) => {
return accumulator + currentValue;
})
// 下面操作即将数组元素累加,但指定了accumulator的初始值为0
const result = arr.reduce((accumulator, currentValue) => {
return accumulator + currentValue;
}, 0)
1.4 数组遍历的四种方式
let arr = ['张三', '李四', '王五']
// 数组遍历方式一
for(let i = 0; i < arr.length; i++) {
console.log(arr[i]);
}
let arr = ['张三', '李四', '王五']
// 数组遍历方式二
arr.forEach(item => {
console.log(item)
})
let arr = ['张三', '李四', '王五']
// 数组遍历方式三
for(index in arr) {
console.log(arr[index])
}
let arr = ['张三', '李四', '王五']
// 数组遍历方式四
for(item of arr) {
console.log(item)
}
2. Set
Set
对象允许存储任何类型的唯一值。
Set
中的元素只会出现一次- 可以按照插入顺序迭代集合中的元素
2.1 创建Set集合
let set = new Set();
2.2 Set常用的属性
size
:返回集合中元素的个数
2.3 Set常用的方式
add()
:添加一个元素在集合尾部delete()
:删除指定元素has()
:集合中是否有指定元素clear()
:清空集合
2.4 Set遍历的两种方式
let set = new Set();
set.add(1);
set.add(3);
set.add(2);
// Set遍历的方式二
set.forEach(item => {
console.log(item);
})
let set = new Set();
set.add(1);
set.add(3);
set.add(2);
// Set遍历的方式一
for(item of set) {
console.log(item);
}
3. Map
Map
对象保存键值对(key-value)。
- 可以记住键的原始插入顺序
- 任何值都可以作为键或值
3.1 创建Map对象
let map = new Map();
3.2 Map常用的属性
size
:Map中键值对的个数
3.3 Map常用的方式
set()
:添加键值对has()
:Map中是否包含指定的键delete()
:删除指定键值对clear()
:清空Mapget()
:获取指定键的值
3.4 Map遍历的三种方式
let map = new Map();
map.set("张三", 18);
map.set("李四", 20);
map.set("王五", 19);
// Map遍历的方式一
map.forEach((key, value) => {
console.log(`key=${key}, value=${value}`);
})
let map = new Map();
map.set("张三", 18);
map.set("李四", 20);
map.set("王五", 19);
// Map遍历的方式二
for([key, value] of map.entries()) {
console.log(`key=${key}, value=${value}`);
}
let map = new Map();
map.set("张三", 18);
map.set("李四", 20);
map.set("王五", 19);
// Map遍历的方式三
for(key of map.keys()) {
console.log(`key=${key}`);
}
for(value of map.values()) {
console.log(`value=${value}`);
}