6.1 集合引用类型-Array

Object

构建

• 构造函数：const person = new Object();person.name = '';
• 对象字面量：const person = {name:''};

使用对象字面量的时候，并不会调用构造函数

语法

• 键必须是符号或字符串，当字符串是标识符或数值时，可省略引号，后台自动转换成字符串
• 值可以是任意值
• 存取：可通过.或[],前者只适合键是标识符的情况，后者可用于变量、字符串访问

let obj = {Name:'Bob',1:2,'age':12};
console.log(obj.age);//通过.访问，之后只能跟标识符
console.log(obj['Name']);//键只能是字符串、符号，键Name会被后台转为字符串
let number = 1;
console.log(obj[number],obj['1']);//[]访问能使用变量，除此之外要使用字符串形式

Array

存储一组有序的数据，数据可以不同类型（与其他语言不同）

构建

• 构造函数：let colors = new Array('red','blue');
• 省略版本：let colors = Array(3);//注意传入整数时是创建长度为3的数组，而不是\[3]
• 字面量：let colors = \['red','blue'];//并不会调用构造函数
• 静态方法：
  • Array.of():用于将一组参数转换为数组实例

  console.log(Array.of(1,2,3));//[1,2,3]
  

  • Array.from():用于将类数组对象转换为数组实例

  let str = 'Matt';//字符串
  let map = new Map().set(1,2).set(3,4);//映射
  let set = new Set().add(1).add(2);//集合
  let a1 = [1,2,3,4];//数组
  const iter = {*[Symbol.iterator](){//可对象对象
    yield 1;
    yield 2;
  }};
  console.log(Array.from(str));//[ 'M', 'a', 't', 't' ]
  console.log(Array.from(map));//[ [ 1, 2 ], [ 3, 4 ] ]
  console.log(Array.from(set));//[ 1, 2 ]
  console.log(Array.from(iter));//[ 1, 2 ]
  console.log(Array.from(a1) === a1);//false,进行了浅拷贝
  

属性

• length:长度，但是索引会小1，改变length会直接影响数组

const s=[1,2,3];
console.log(s[2]);//3
s.length = 2;
console.log(s[2]);//undefined

静态方法

• from/of():见上面构造
• isArray():判断是否是数组

实例方法

继承方法

• keys/values/entries():返回数组索引/元素/[索引,元素]的迭代器

• valueOf():返回本身

• toString():每个元素都调用toString(),然后将','拼接到一起

• join(间隔符):toString是将元素之间用','分割，join可以直接指定然后返回字符串

• push/unshift：向后、前存

• pop/shift：从后、前取

• reverse:数组元素方向排列，会改变调用的数组

• sort(function):对数组按照规则排序，如果不传入排序函数，则默认将元素转换成字符串后排序

const s1 = [5,2,6,10,15];
s1.sort();//默认按照对应字符串字符递增排序
console.log(s1);//[ 10, 15, 2, 5, 6 ]
function sortFunction(a,b){
  //a在b前面，则返回-1
  return (a-b)<0?-1 : (a-b)>0?1:0;
}
s1.sort(sortFunction);//按照定义的函数规则排序
console.log(s1);//[ 2, 5, 6, 10, 15 ]

• concat():返回拼接调用数组和参数形成的新数组
• slice(start,end)：返回子数组
• splice(start,length,多个插入元素):对原数组从start位置删除length个元素，并在这位置添加插入元素,返回的数组是删除元素组成的数组

const s1 = [5,2,6,10,15];
console.log(s1.splice(1,1,4,3));//[2]
console.log(s1);//[ 5, 4, 3, 6, 10, 15 ]

• indexOf/lastIndexOf/includes(查找元素，start):从起始位置开始向后/前查找索引，includes是返回是否存在，注意都是严格相等
• find/findIndex(function):查找符合函数的元素/索引，function接受3个参数：元素、索引和数组本身

const s1 = [{name:'bob',age:12},{name:'dog',age:20}];
console.log(s1.find((element,index,array)=>element.age>18));//{ name: 'dog', age: 20 }

• every/some(function):对元素都调用function，全部/其中一个元素使得function返回为真则返回true
• map(function):每个元素调用function，返回每次函数调用的结果构成的数组
• filter(function): 返回元素调用function返回值为真的元素
• forEach(function):没有返回值，每个元素都会调用function，注意回调函数中的return只会对当前回调函数起作用，并不影响后续回调函数的调用

// 定义一个数组
const numbers = [1, 2, 3, 4, 5];

// every(function): 测试数组的所有元素是否都通过了指定函数的测试
const allArePositive = numbers.every(num => num > 0);
console.log('allArePositive:', allArePositive); // 输出：true

// some(function): 测试数组中是否至少有一个元素通过了指定函数的测试
const anyAreNegative = numbers.some(num => num < 0);
console.log('anyAreNegative:', anyAreNegative); // 输出：false

// map(function): 创建一个新数组，其结果是该数组中的每个元素都调用一次提供的函数后的返回值
const squares = numbers.map(num => num * num);
console.log('squares:', squares); // 输出：[1, 4, 9, 16, 25]

// filter(function): 创建一个新数组，其包含通过所提供函数实现的测试的所有元素
const evenNumbers = numbers.filter(num => num % 2 === 0);
console.log('evenNumbers:', evenNumbers); // 输出：[2, 4]

// forEach(function): 对数组的每个元素执行一次提供的函数，但没有返回值
numbers.forEach(num => {
  console.log(num); // 依次输出：1, 2, 3, 4, 5
});

• reduce/reduceRight(function)：向后/前调用function，只是function第一个参数是上一个元素调用function后的返回值,function接受4个参数：上一个归并值、当前项、索引和数组本身

let values = [1,2,3,4,5]
console.log(values.reduce((prev,cur,index,array)=>prev+cur))//15

定型数组

主要用于计算、3D建模方面，所以针对的是number类型;而js中number由于固定了浮点数、整数占据多少字节，而没有其他语言所指定的int8、int16等类型(elementType)，所以导致其进行建模计算需要先进行转换，拖慢了速度，此时才出现定型数组。

ArrayBuffer

用于分配字节数，一经分配，就不能再调整大小，且初始化所有比特为0

构建

const buf = new ArrayBuffer(字节数)

读取写入

不能直接通过对ArrayBuffer的引用进行读写，只能通过视图，而视图分为两种，一种是没有固定的elementType，一种是有固定的elementType，前者时DataView

1、DataView

没有固定elementType

构建

const view = new DataView(ArrayBuffer实例,byteOffset,byteLength);

视图为从缓冲（ArrayBuffer实例）起点开始，前byteLength个字节

实例方法

elementType上每种方法都暴露了读取和写入，以int16为例：

• getInt8(offset,true)：按int8读取视图第offset个字符，读的时候有大端(false默认)小端(true)之分
• setUint8(offset,value,false):设置第offset的值，也有大小端，注意value会自动转换成elementType对应的值，无法转换就报错 读写如果缓冲区不够，则抛出RangeError

2、定型数组

有固定的elementType

构建

• 自有缓冲: const floats = new Float16Array(4);
• 已有缓冲：const buf = new ArrayBuffer(12);const ints=new Int32Array(buf);
• 可迭代结构： const ints1 = new Int16Array([1,2,3]);
• 静态方法：
  • from: const ints2 = Int32Array.from([1,2,3]);
  • of: const ints3 = Int32Array.of(1,2,3);

方法

很多方法都和Array一样，但是区别是定型数组的缓存大小不能改变，所以涉及到本身大小改变的操作是无效的,如push、pop、shift、unshift、concat和splice;