js总结之数组

    0

创建数组

使用[]或者Array()构造函数来创建数组

js
let arr1 = [1, 2, 3]; let arr2 = Array(4, 5, 6);

传统方法

js
const arr=[]

构造函数

js
const arr=Array(3) [...Array(100).fill(0)]

类数组

类数组是指具有length属性和一组按照索引值存储数据的对象,但是它不具备数组的所有特性。在JavaScript中,有很多内置对象都可以被看作是类数组,例如DOM中的NodeList对象、函数中的arguments对象等。这些对象都具有类数组的特点,但是不能直接使用数组的方法进行操作。

类数组转化

js
Array.prototype.slice.call() [...] Array.apply(null, { length: 100 }).fill(0); Array.from({length: 100}, _ => 0) Array.from({length: 100}).map(()=> 0)

创建0-100的数组

js
传统方法 for 循环 Object.keys(Array.from({length: 100})); [...new Array(100).keys()] Array.from({length:100},(v,i) => i) Array.from(new Array(100).keys()) [...Array(100).keys()] [...Array.from({length:100}).keys()]

实现flat

  1. 遍历
  2. 判断是否数组

数组空位

存在空位的数组为稀疏数组,没有空位的为密数组

js
[,,,]//[empty × 3] new Array(3)//[empty × 3]

es5数组的方法处理一般会跳过数组的空位

js
// forEach 忽略空位 [1, , 2].forEach(v => console.log(v)); // 1 2 // for in 忽略空位 for(let key in [1, , 2]){ console.log(key); } // 0 2 // filter 忽略空位 console.log([1, , 2].filter(v => true)); // [1, 2] // every 忽略空位 console.log([1, , 1].every(v => v === 1)); // true // some 忽略空位 console.log([1, , 1].some(v => v !== 1)); // false // map 遍历时忽略空位 新数组保留空位 console.log([1, , 1].map(v => 11)); // (3) [11, empty, 11] // join 将空位与undefined以及null视为空字符串 console.log([1, , 1, null, undefined].join("|")); // 1||1|| // toString 将空位与undefined以及null视为空字符串 console.log([1, , 1, null, undefined].toString()); // 1,,1,,`

es6数组的方法处理一般把空位转化为undefined

js
// Array.form 将空位转为undefined console.log(Array.from([1, , 2])); // (3) [1, undefined, 2] // ... 将空位转为undefined console.log([...[1, , 2]]); // (3) [1, undefined, 2] // copyWithin 将空位一并拷贝 console.log([1, , 2].copyWithin()); // (3) [1, empty, 2] // for of 遍历空位并将值作为undefined for(let key of [1, , 2]){ console.log(key); } // 1 undefined 2 // includes 将空位处理成undefined console.log([, , ,].includes(undefined)); // true // entries 将空位处理成undefined console.log([...[1, , 2].entries()]); // [[0, 1], [1, undefined], [2, 2]] // keys 会取出空位的索引 console.log([...[1, , 2].keys()]); // [0, 1, 2] // values 将空位处理成undefined console.log([...[1, , 2].values()]); // [1, undefined, 2] // find 将空位处理成undefined console.log([, , 1].find(v => true)); // undefined // find 将空位处理成undefined console.log([, , 1].findIndex(v => true)); // 0

基础数据类型的数组

js
const array = [1, 1, 1, 1, 1, 1, 1, 1, 1, 1] console.log([...new Set(array)])//[1] console.log(Array.from(new Set(array)))//[1]

引用对象类型的数组

filter

循环遍历每个值,判断索引,当前索引和findIndex索引一致则不重复,不一致则重复

js
const arr = [{name: 'zxc'}, {name: 'zxc'}, {name: 'zxc'}, {name: 'zxc'}] const b=arr.filter((item,idx)=>{ return arr.findIndex(_=>_.name===item.name)===idx }) console.log(b)//[{name: "zxc"}]

中间值hash,循环遍历,如果存在返回flase,不存在加入hash返回true

reduce

js
const arr = [{name: 'zxc'}, {name: 'zxc'}, {name: 'zxc'}, {name: 'zxc'}] const a=arr.reduce((prev, curr) => { if (prev.some(_=>_.name===curr.name)) { return prev } else { return [...prev,curr] } }, []) console.log(a)//[{name: "zxc"}]

findIndex

javascript
const arr = [{name: 'zxc'}, {name: 'zx1c'}, {name: 'zxc'}, {name: 'zx1c'},] const newArray = [] arr.forEach((item, idx) => { if (arr.findIndex(i => i.name === item.name) === idx) { newArray.push(item) } }) console.log(newArray)

Map

javascript
const arr = [{name: 'zxc'}, {name: 'zx1c'}, {name: 'zxc'}, {name: 'zx1c'},]; const newArray = [] const set = new Set() arr.forEach((item) => { if (!set.has(item.name)) { newArray.push(item) set.add(item.name) } }) console.log(newArray)

参考文章

评论区
共有评论 0
暂无评论