JS数组 Array
JS没有真正数组，数组实际上是一种特殊的对象
创建数组的方法：
let arr = [1,2,3]; // let arr = new Array([1,2,3)
let arr = new Array(2)
**伪数组：**是在原型链中没有数组的原型，也就是没有数组共用的属性的「数组」
let divlist = Document.querySelectorAll('div')
合并数组
Array.prototype.concat() MDN
用于合并两个或多个数组。此方法不会更改现有数组，而是返回一个新数组。
对应字符串，同样拥有String.prototype.concat()的方法合并新字符串。
let a = [1,2,3]
let b = [2,4,6]
let ab = a.concat(b) // (6) [1, 2, 3, 2, 4, 6]
slice 截取数组
Array.prototype.slice()
语法：arr.slice( [begin [, end]] )
返回新的数组对象，由 begin 和 end 决定的原数组的浅拷贝,原始数组不会被改变。
let a = [1,2,3,4,5,6,7,8,9,10]
let b = a.slice(5,10) // (5) [6, 7, 8, 9, 10]
删除数组
对象的增删改查同样可以运用在数组上，同时也会引发一些错误。修改后**「数组的长度“length不会改变」**
三种删除数组元素的方法
Array.prototype.shift()
从数组中删除第一个元素，并返回该元素的值。此方法更改数组的长度。
let a = [1,2,3,4,5,6,7,8,9,10]
a.shift() // 不接受参数，直接删除引索为0的数值
Array.prototype.pop()
从数组中删除最后一个元素，并返回该元素的值。此方法更改数组的长度。
let a = [1,2,3,4,5,6,7,8,9,10]
a.pop() // 不接受参数，直接删除引索为
Array.prototype.splice()
删除或替换现有元素或者原地添加新的元素来修改数组,并以数组形式返回被修改的内容。此方法会改变原数组。
此方法同样可以修改数组的值
语法：array.splice(start[, deleteCount[, item1[, item2[, ...]]]])
let a = [1,2,3,4,5,6,7,8,9,10] //
a.splice(5,1,666) // 从引索为 5 的数值开始，删除 1 个数值，插入 666
// 输出结果：(10) [1, 2, 3, 4, 5, 666, 7, 8, 9, 10]
添加数组
尾部添加元素
Array.push( item1 [,item2] )
头部添加元素
Array.unshift( item1 [,item2] )
运行splice插入元素
Array.splise( index , 0 , 'x') // 在index位置插入‘x'，0
查看数组
IndexOf()
返回可以在数组中找到给定元素的第一个索引；如果不存在，则返回-1。
var array = [2, 9, 9];
array.indexOf(9); // 1
array.indexOf(7); // -1
find()
返回提供的数组中满足提供的测试功能的第一个元素的值。
let classScore = [
{name: 'aziz', score: 100},
{name: '吴彦祖', score: 96},
{name: '学霸', score: 99}
];
classScore.find( ({ name }) => name === 'aziz' );
// {name: "aziz", score: 100}
findIndex()
返回满足提供的测试功能的数组中第一个元素的索引 . 否则，它返回 -1
let classScore = [
{name: 'aziz', score: 100},
{name: '吴彦祖', score: 96},
{name: '学霸', score: 99}
];
classScore.findIndex( ({ name }) => name === 'aziz' );
// 0
转化数组
String.prototype.split()
let string = 'abc';
string.split('') // (3) ["1", "2", "3"]
string.split(',') // ["123"]
Array.from()
Array.from(string) // (3) ["1", "2", "3"]
// 可以对数组进行map方法运算
Array.from([1, 2, 3], x => x + x) // (3) [2, 4, 6]
遍历数组
查看数字（字符串）的属性名和值
let a = [1,2,3,4,5,6,7,8,9,10];
for(let i =0;i < a.length;i++){
console.log(`${i}:${[i]}`)
}
forEach
Array.prototype.forEach()
语法：arr.forEach(callback(currentValue [, index [, array]])[, thisArg])
let a = [1,2,3,4,5,6,7,8,9,10];
a.forEach(a => console.log(a));
顺序修改
反转顺序函数
Array.prototype.reverse()
用于修改数组顺序，字符串需要 → 转数组 → 转换 → 合并
let s = 'abcde'
s.split('').reverse().join('') //不改变原有值
自定义顺序
Array.prototype.sort MDN
对数组的元素进行排序，并返回数组。默认排序顺序是在将元素转换为字符串，然后比较它们的UTF-16代码单元值序列时构建的
var numbers = [4, 2, 5, 1, 3];
numbers.sort((a, b) => a - b); // a-b为默认顺序，b-a相当于“从大到小”
// (5) [1, 2, 3, 4, 5]
对象排序
⚠️注意：会改变原有数组
let classScore = [
{name:'aziz',score:78},
{name:'胖虎', score:59},
{name:'学霸',score:100}
]
classScore.sort((a,b) => b.score - a.score)
数组变换
对数组进行”运算“
Array.prototype.map()
map （对每一个数值进行操作）
let square = [1,2,3,4,5,6]
square.map( item => item*item )
// (6) [1, 4, 9, 16, 25, 36]
let abs = [1,2,3,4,5,6]
abs.map(item => item*item)
// (6) [1, 4, 9, 16, 25, 36]
对数组进行”筛选“
Array.prototype.filter()
let a = [1,2,3,4,5,6,7,8,9,10]
a.filter(a=> a%2===0)
// (5) [2, 4, 6, 8, 10]
对数组进行函数”运算“
Array.prototype.reduce()
属于高级用法，基本可以实现大多数的数组运算。
有点类似for...if循环，也可以结合if使用。
arr.reduce(callback( accumulator, currentValue)[ initialValue ])
-------------- 相当于 --------------
arr.reduce( 累积器, 数组正在处理的元素 )[ 默认参数])
实现数组值的相乘、相加
let a = [1,2,3,4,5,6,7,8,9,10];
a.reduce((acc,cur)=>{return acc*cur},1) // 3628800
a.reduce((acc,cur)=>{return acc+cur},0) // 55
要注意，如果默认值为 0 ，则已 0 作为原始值计算
a.reduce((acc,cur)=>{return acc*cur},0) // 0
高级用法，可以使用数组来统计名字，输出结果成为一个对象
let names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice']
let countedNames = names.reduce(function (allNames, name) {
if (name in allNames) {
allNames[name]++
}
else {
allNames[name] = 1
}
return allNames
}, {})
// countedNames is:
// { 'Alice': 2, 'Bob': 1, 'Tiff': 1, 'Bruce': 1 }
end.
map
let arr = [0,1,2,2,3,3,3,4,4,4,4,6]
let arr2 = arr.map((i)=>{
return {0:'周日',1:'周一',2:'周二',3:'周三',4:'周四',5:'周五',6:'周六'}[i]
})
console.log(arr2) // ['周日', '周一', '周二', '周二', '周三', '周三', '周三', '周三', '周四', '周四', '周四', '周四' ]
let arr3 = [0,1,2,2,3,3,3,4,4,4,4,6]
let arr4 = arr.map( a => {
if (a===0){return a="周日";}
if(a===1){return a="周一";}
if(a===2){return a="周二";}
if(a===3){return a="周三";}
if(a===4){return a="周四";}
if(a===5){return a="周五";}
if(a===6){return a="周六";}
else return a
})
console.log(arr4)
数组去重方法
function unique(arr) {
let res = new Map();
let result = arr.filter((a) => !res.has(a) && res.set(a, 'only'));
return console.log(result)
}
unique(array)
数组indexOf
function unique(array) {
let arr = [];
for (i = 0; i < array.length; i++) {
if (arr.indexOf(array[i]) === -1) {
arr.push(array[i])
}
}
console.log(arr)
}
unique(array)
for循环
function unique(array){
for(let i=0;i< array.length;i++){
for(let j = i + 1; j<array.length;j++){
if(array[i] === array[j]){
array.splice(j,1)
j -= 1
}
}
}
console.log(array)
}
unique(array)
Set 方式
array = [1,5,2,3,4,2,3,1,3,4]
console.log(Array.from(new Set(array)))
console.log([...new Set(array)]) //第二种方式
Set为内置对象，由于该函数是对象值的集合，具有唯一性。使用在数组去除返回为 set 对象，需要对结果转换为数组
map | filter
function unique(arr) {
let res = new Map();
let result = arr.filter((a) => !res.has(a) && res.set(a, 'only'));
return console.log(result)
}
unique(array)
map 与 weakMap 使用大致相同，主要区别在于
- Map对象的键可以是任何类型，但WeakMap对象中的键只能是对象引用
- WeakMap不能包含无引用的对象，否则会被自动清除出集合（垃圾回收机制）。