Javascript基础--数组Array

74 阅读2分钟

转载链接

image.png

Array静态方法

Array.from(): 从数组类对象或可迭代对象创建一个新的Array实例,浅拷贝数组实例。

Array.isArray(): 如果参数是数组则返回true,否则返回falseArray.of(): 创建一个新的Array实例,具有可变数量的参数,而不管参数的数量或类型。

Array实例属性

Array.prototype.length:  反映数组中元素的数量。
const arr = new Array(50).fill(0).map((item, index) => index + 1)
// const arr = Array.from(Array(100), (item, index) => index+1)
// const arr = [...Array(100).keys()]
// console.log(arr);

/*
* 1浅拷贝
*/ 
const arr_copy = [...arr]
arr_copy[0] = arr_copy[0] + 1  // 不改变原数组
// console.log(arr_copy);

/*
* 2数组合并
*/ 
const arr2 = ['1', '2', '3', 1, 1, 2]
const arr_concat = [...arr2, ...arr]  // 不改变原数组
// console.log(arr_concat);


/*
* 3数组去重取交集
*/ 
const arr_set = [...new Set(arr2)].filter(it => arr.includes(it))
// 数组去重取差集
const arr_set2 = [...new Set(arr_concat)].filter(item => !arr2.includes(item) || !arr.includes(item))
// console.log(arr_set); // [1, 2]
// console.log(arr_set2); 


/*
* 4将类数组(具有length属性)转换为数组
* 1-[...new Set(arr)]   2-Array.from({0: 'a', 1: 'b'})
*/ 

 
/*
* 5数组摊平
* 三维及以上用array.flatMap()。array.flat(2)可以传参数字如2
*/ 
const obj = {a: '群主', b: '群友', c: '裙友', d: '未知性别'}
const getName = function (item) { return item.includes('群')}
// 方法1
// const flatArr = Object.values(obj).flat().filter(item => item.includes('群'))
// 方法2
const flatArr = Object.values(obj).flat().filter(getName)
// console.log(flatArr);


/*
* 6数组遍历
* 常用方法:
* forEach、
* filter、map【返回数组】
* every、some【返回boolean】
* find、findIndex【find返回查询到的**满足条件的第一个**子项,findIndex返回子项的下标】
* reduce、reduceRight、

* 注:find、findIndex、some都是短路运算,即找到就终止
*/ 
// const arr3 = arr.map(item => item * 3).filter(item => item % 2 === 0)
const arr1 = ['s0', 's4', 's1', 's2', 's8', 's3']
const arr3 = arr1.reduce((prev, cur) => {  
  const curIndex = Number(cur.replace('s', ''))
  return curIndex > prev ? curIndex : prev
}, 0)
// console.log(arr3);

/**
* 7 array.includes() 返回布尔值,array.indexOf(val) 返回子项索引值
*/
// const arr4 = arr.includes(100)  // false
const arr4 = arr.indexOf(30)  // 49
// console.log(~arr4);


const data = {
  'if _ then s9': [
    '作用属于各种,结构属于住宅,结构能承受作用,作用属于在正常建造和正常使用过程中可能发生',
    '作用属于各种,结构属于住宅,结构能承受作用,作用属于在正常建造和正常使用过程中可能发生',
    '作用属于各种,结构属于住宅,结构能承受作用,作用属于在正常建造和正常使用过程中可能发生'
    ],
  'if C then s4': [
    '当有条件时时,结构构件满足要求,要求属于安全性、适用性和耐久性',
    '当有条件时时,住宅结构满足要求,要求属于安全性、适用性和耐久性'
  ]
}
const ifthens = Object.entries(data).reduce((prev, cur) => {
  const values = cur[1].reduce((prev, cur) => `${prev}<p>${cur}</p>`, '')
  return `
    ${prev}
    <li>
      <p>${cur[0]}</p>
      ${values}
    </li>
  `
}, '')
// console.log(ifthens);


/**
* 7 array.reverse() 反转数组,会改变原数组
*/
// 不会改变数组自身
const myReverse = (arr = []) => {
    return  arr.reduceRight((prev, cur) => [...prev, cur], []) // 也可以返回逗号表达式 (prev.push(cur), prev)
}
var arr5 = ['yanggb1', 'yanggb2', 'yanggb3'];
console.log(myReverse(arr5));
console.log(arr5);