数组Array的槽位中可以是任意类型的数据,所以可以如下:
代码语言:javascript复制let array = [12,'yes',{'name':'lisi'}]
可以存在数值、字符串、对象等。
数组的大小也是动态的,随着填入值的增多而增长。
创建数组
有两种创建方式
Array构造函数
代码语言:javascript复制// 就像新创建一个对象
let array = new Array()
// 传入数值参数,就是创建指定长度的数组 长度为20的空数组 [empty × 20]
let color = new Array(20)
// 给构造函数赋值
let array = new Array("red","green","blue")
// 但是想要赋值数值型就出问题了 会被认为是创建指定长度的数组
let color = new Array(20)
// 但是如果传入两个以上的参数 就可以
let color = new Array(20,40)
字面量
数组字面量的创建方式更常用
代码语言:javascript复制let array = [1,3,4] // [1,2,3]
let dot = [1,2,] // [1,2]
在使用数组字面量创建数组时并不会调用Array构造函数。
from()
Es6新增 我最常用到from()是将Set(唯一值处理)转为Array的时候。
代码语言:javascript复制// 1.将字符串拆分成单字符数组
Array.from("Robot")
// 2.Set() 唯一值
let set = new Set([1,3,4,4,3])
Array.from(set) // [1, 3, 4]
// 3.`Map`是一组键值对的结构,具有极快的查找速度
let mm = new Map().set(1,2) // Map(1) {1 => 2}
mm.get(1) // 2 通过键找到值
// 转为二位数组
Array.from(mm) // [[1,2]]
// 4.浅复制
const a1 = [1,2,3,4]
const a2 = Array.from(a1)
a1 === a2 //false
Array.from()还可以接收第二个可选映射函数参数,用于增强新数组的值
代码语言:javascript复制const a1 = [1,2,3]
// 将数组每个值变为平方
const a2 = Array.from(a1, x=>x**2)
of
用于将一组参数转为数组
代码语言:javascript复制Array.of(1,2,3,4) // [1,2,3,4]
数组空位
代码语言:javascript复制let a =[,,,,,]
a.length // 5
cosole.log(a) // [empty × 5] 但其实空位是undefined
const bb = [1,,,,5]
for(const p of bb){console.log(p === undefined)} // false true true true false
map()对于空位
代码语言:javascript复制bb.map(()=>6) // [6, empty × 3, 6]
join() 填充空位
代码语言:javascript复制bb.join('-') '1----5'
数组索引
通过下标访问 下标从0开始到length-1结束
代码语言:javascript复制let colors =['red','green','blue']
colors[0] // 'red'
// 下标越界会 打印会undefined
colors[3] // undefined
长度属性
不止是可读的
代码语言:javascript复制colors.length // 3
colors.length = 4 // ['red', 'green', 'blue', empty]
colors[3] // undefined
数组最多可以包含 4 294 967 295 个元素(42亿薇娅很接近了),这对于大多数编程任务应该足够了。
检测数组
instanceof
因为typeof 对于数组 和 对象来说都是 'object'类型。因此有了instanceof的出现。
instanceof的使用局限在只有一个全局执行上下文。如果网页里有多个框架,则可能涉及两个不同的全局执行上下文。
代码语言:javascript复制let a = [1,2]
a instanceof Array // true
isArray()
其没有执行上下文的限制,推荐使用
代码语言:javascript复制let a = [1,3,4]
Array.isArray(a) // true
迭代器方法
Es6中,Array的原型上暴露了 keys()、values()和entries()。
- keys() 返回数组索引 的迭代器
- values() 返回数组元素 的迭代器
- entries() 返回索引/值对 的迭代器
这些方法都返回迭代器,迭代器我们并看不到具体的内容。所以,需要通过Array.from()将迭代器转为数组实例。
代码语言:javascript复制const aa = ["foo", "bar", "baz", "qux"];
const aKeys = Array.from(aa.keys()); // [0, 1, 2, 3]
const aValues = Array.from(aa.values()); // ['foo', 'bar', 'baz', 'qux']
const aEntries = Array.from(aa.entries()); // 结果见下图
是一个二维数组
下面这个例子是使用解构才分键/值对。但是个人认为.keys()和.values()就已经分别是拆分好的键 和 值了。
代码语言:javascript复制for(const [idx,element] of aa.entries()){
console.log(idx);console.log(element)
}
复制和填充方法
复制方法
copyWithin() 个人认为只需要了解
3是索引对应的也就是5所在位置,它会把5之前的元素复制插入到5的前面,也就是 1,2,3
。其他元素会接着5向后添加,但是数组的长度是9,当存满了9个元素之后,其他的也就被踢出数组中了。
并且,这个方法会改变原数组
代码语言:javascript复制let a = [1,2,3,5,4,6,8,9,7]
a.copyWithin(3) // [1, 2, 3, 1, 2, 3, 5, 4, 6]
a // [1, 2, 3, 1, 2, 3, 5, 4, 6]
两个参数时
从a中复制 索引 5 开始的内容,插入到索引0开始的位置。我们这里复制的是6,7,8,9
一共四个元素,所以被插入索引从0开始到索引
是3的位置结束(与其说是插入不如说是替换)。
let a = [1,2,3,4,'*',6,7,8,9]
a.copyWithin(0,5) // [6, 7, 8, 9, '*', 6, 7, 8, 9]
三个参数时
第三个参数就是限制了复制的结束位置
(插入的位置,复制开始位置,复制结束位置不包含这个位置的元素)
代码语言:javascript复制let a = [1,2,3,4,'*',6,7,8,9]
a.copyWithin(4,0,3) // (9) [1, 2, 3, 4, 1, 2, 3, 8, 9]
填充方法
fill() 首先,需要数组开辟空间。才可以进行填充
代码语言:javascript复制let array=[]
array.fill(5) // []
let array1 = new Array(5)
array1.fill(5) // [5, 5, 5, 5, 5]
两个参数 用6填充索引大于3的元素
代码语言:javascript复制let array= [5, 5, 5, 5, 5]
array.fill(6,3) // [5, 5, 5, 6, 6]
三个参数 用7填充 索引大于1小于3的元素
代码语言:javascript复制let array= [5, 5, 5, 5, 5]
array.fill(7,1,3) // [5, 7, 7, 5, 5]