Array javascript

Posted 2022-02-11 wanluToPro

Array 【javascript】

构造数组

console.log(Array("1", "2")); //[ '1', '2' ]
console.log(new Array(5)); //[ <5 empty items> ]
console.log(Array.of(1, 2, 3)); //[1,2,3]

length属性

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

从 String\\Map\\Set 转为 Array

let map = new Map().set("hi", 1).set("lp", 0);
console.log(map);
let set = new Set().add(1).add(2).add(1, 2);
console.log(set); //1 2
console.log(Array.from("hello")); //[ 'h', 'e', 'l', 'l', 'o' ]
console.log(Array.from(map)); //[ [ 'hi', 1 ], [ 'lp', 0 ] ]
console.log(Array.from(set)); //[ 1, 2 ]

带有length属性的对象 转为 Array

console.log(Array.from(
    0: 1,
    1: 2,
    2: 3,
    length: 3
)); //[1,2,3]

Array.from(array,fun)

let x = [1, 2, 3];
console.log(Array.from(x, number => number + 2)); //[3,4,5]

arguments对象转array

function test() 
    console.log(arguments); //[Arguments]  '0': 1, '1': 2, '2':  l: 1  
    console.log(Array.from(arguments)); //[ 1, 2,  l: 1  ]

test(1, 2, 
    l: 1
);

Array.of(…args) 将参数转为Array

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

//map
console.log(Array.of(1, 2, 3).map((v, i) => 
    return v + i;
)); //[1,3,5]

join

console.log(x.join('-')); //1-2-3

数组空位

x = [1, , 2, 3];
console.log(x[1]); //undefined
//map()会跳过空位置
//join()会视空位置为空字符串
x = [1, 2, 3];
x[5] = 9;
console.log(x); //[ 1, 2, 3, <2 empty items>, 9 ]
console.log(x.length); //6

检测数组

x = [1, 2, 3];
console.log(Array.isArray(x)); //true
``

## 迭代器 keys() values() entries()
```js
x = [1, 2, 3];
console.log(x.keys()); //[0, 1, 2]
console.log(x.values()); //[1,2,3]
console.log(x.entries()); //[[0,1],[1,2],[2,3]]
for (const [v, i] of x.entries()) 
    console.log([v, i]); //[0,1] [1,2] [2,3]

数组析构

x = [1, 2];
const [a, b] = [...x];
console.log(a, b); //1 2

数组填充 fill

//fill改变原来的数组并返回数组
x = [1, 2, 3, 4];
console.log(x.fill(3)); //[3,3,3,3]
x = [1, 2, 3, 4];
console.log(x.fill(9, 2)); //[1,2,9,9] index大于等于2的
x = [1, 2, 3, 4];
console.log(x.fill(9, 1, 2)); //[1,9,3,4]  index大于等于1小于2
/*
x.fill(1,-1,-3) 等价于 x.fill(1,x.length-1,x.length-3)
*/

批量复制 copyWithin

x = [1, 2, 3, 4, 5, 6, 7, 8, 9, ];
console.log(x.copyWithin(5)); //[1,2,3,4,5,1,2,3,4]
//也可以接收三个参数 没必要记住 知道Array有这个方法提供类似的功能就好了
//用到时候去看看mdn

转换方法 valueOf\\toString…

x = [1, 2, 3, "你好"];
console.log(x.valueOf()); //[1,2,3,'你好']
console.log(x.toString()); //1,2,3,你好
console.log(x.toLocaleString()); //1,2,3,你好

栈方法 push\\pop

x = [1, 2, 3];
x.push(4);
console.log(x.pop()); //4
console.log(x); //[1,2,3]

队列方法 push\\shift\\unshift

//shift
x = [1, 2, 3];
x.push(4);
console.log(x.shift()); //1
console.log(x); //[2,3,4]
//unshift
x = [1, 2, 3];
x.unshift(7, 8, 9);
console.log(x); //[7,8,9,1,2,3]

排序方法 sort\\reverse

//reverse()和sort()都返回调用它们的数组的引用
x = [1, 5, 2];
console.log(x.sort()); //[1,2,5]
console.log(x.reverse()); //[5,2,1]
x = [
    n: 1
, 
    n: 5
, 
    n: 2
];
console.log(x.sort((a, b) => 
    if (a.n > b.n) 
        return -1;
     else if (a.n < b.n) 
        return 1;
     else 
        return 0;
    
)); //[  n: 5 ,  n: 2 ,  n: 1  ]

拼接concat\\切割slice\\替换splice

x = [1, 2, 3];
console.log(x.concat(1, 2, [3, 4]));
//[1, 2, 3, 1 , 2, 3, 4]
x = [1, 2, 3, 4, 5];
console.log(x.slice(1, 4)); //[2,3,4]
x = [1, 2, 3, 4, 5];
console.log(x.splice(1, 2, ...[9, 9])); //[2,3]
console.log(x); //[ 1, 9, 9, 4, 5 ]

搜索 indexOf\\lastIndexOf\\includes

x = [1, 2, 3, 4, 4];
console.log(x.indexOf(4)); //3
console.log(x.lastIndexOf(4)); //4
console.log(x.includes(4)); //true
console.log(x.includes(2, 2)); //false 从index=2开始找

断言函数 find\\findIndex

x = [1, 2, 3, 4, 5];
console.log(x.find((el, index, array) => 
    return el > 3;
)); //4

console.log(x.findIndex((el, index, array) => 
    return el > 3;
)); //3 index

迭代方法 every\\filter\\forEach\\map

every对于每一项都返回true则返回true

x = [1, 2, 3, 4];
console.log(x.every((v, index, array) => 
    return v < 1;
)); //false

filter

console.log(x.filter((v, index, array) => 
    return v >= 3;
)); //[3,4]

forEach 没有返回值

x = [1, 2, 3, 4];
x.forEach((v, index, array) => 
    console.log(index, v);
    //0 1\\ 1 2\\ 2 3\\ 3 4 
);

map 迭代

x = [1, 2, 3, 4];
console.log(x.map((v, index, array) => 
    return [index, v];
)); //[ [ 0, 1 ], [ 1, 2 ], [ 2, 3 ], [ 3, 4 ] ]

归并方法 reduce\\reduceRight

//遍历数组 可以得到方式次的返回值
x = [1, 2, 3, 4];
console.log(x.reduce((pre, cur, index, array) => 
    return pre + cur;
)); //10 = 1+2+3+4

//同理reduceRight 从右向左遍历

ArrayBuffer

const buf = new ArrayBuffer(16); //申请16字节空间
console.log(buf.byteLength); //16
const buf1 = buf.slice(4, 12);
console.log(buf1.byteLength); //8
buf[1] = '1';
console.log(buf);
/**
 ArrayBuffer 
     [Uint8Contents]: < 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 > ,
         byteLength: 16,
         '1': '1'
 
 */
console.log(buf[1]); //1

DateView

略 用时再学吧 ArrayBuffer申请的空间可以供DateView使用 DateView上有一系列操作

定型数组

我们知道js中的元素每个位置想放什么就放什么、不像Java C一样是定类型的
但js提供了形如 Int8Array() Int32Array() Int16Array() Float32Array() 的构造函数
如需用到再学吧 知道有这么回事 就好