一，遍历数据array
1,for循环遍历
JavaScript中的for循环是一种控制流语句，用于重复执行某个操作，直到满足指定的条件
for (初始化表达式; 条件表达式; 更新表达式) {
// 循环体语句
}
const arr=[1,2,3]
for (let i=0; i<arr.length; i++){
console.log(arr[i]);
//1
//2
//3
}
2，for of
for...of循环是JavaScript中的一种循环结构，它允许开发者遍历各种数据结构，如数组、字符串、Map、Set等，从而更加高效地编写代码。for...of循环的语法如下：
for(variable of iterable) {
// code block to be executed
}
keys，values，entries
它们都返回一个遍历器对象，可以用 for…of 循环进行遍历
keys – 返回元素索引
values – 返回元素本身
entries – 返回元素和下标
const arr = ['a', 'b', 'c'];
// keys
for (let index of arr.keys()) {
console.log(index);
// 0
// 1
// 2
}
// values
for (let ele of arr.values()) {
console.log(ele);
// a
// b
// c
}
//entries
for (let [index, ele] of arr.entries()) {
console.log(idnex, ele);
// 0 "a"
// 1 "b"
// 2 "c"
}
3,forEach遍历
遍历数组，和for循环功能一致
arr.forEach((item,index,self)=>{
item：数组的每一个元素
index：元素下标
self：数组本身
// 无返回值
})
4,map
映射数组的所有项
arr.map((item,index,self)=>{
item：数组的每一个元素
index：元素的下标
self：数组本身
// 有返回值
// 返回满足某个条件的元素构成的数组
})
let arr = [1,2,3]
// 完整写法
let res = arr.map((item,index)=>{
return item* 2
})
// 简写
let res = arr.map(item=>item*2) // 返回数组[2,4,6]
let res = arr.map(item=>item*2).join(',') // 返回拼接后的字符串'2,4,6'
5,filter
筛选数组；将符合条件的元素放入新数组
let arr = [1,2,3,4,5]
// 完整写法
let res = arr.filter((item,index)=>{
if(item % 2 == 0){
return true
}
})
// 简写 筛选偶数
let res = arr.filter(item=>item % 2 == 0) // [2,4]
6,every
判断数组中是否所有元素都符合条件
arr.every((item,inedx, self)=>{
item：数组的每一个元素
index：元素的下标
self：数组本身
// 有返回值
// 检测数组里的每一个值是否满足条件，如果有一个值不满足，则返回false，剩余的值不在进行检测
// 如果所有的值都满足，则返回true
})
let arr = [1,2,-1]
// 完整写法
let res=arr.every((item,index)=>{
if(item>0){
return true
}
})
// 简写
let res = arr.every(item=>item>0) // false
7,some
判断数组中是否有符合条件的元素；非空判断
arr.some((item,inedx, self)=>{
item：数组的每一个元素
index：元素的下标
self：数组本身
// 有返回值
// 检测数组里的每一个值是否满足条件，如果有一个值满足，则返回true，剩余的值不在进行检测
// 如果所有的值都不满足条件，则返回false
})
let arr = [1,2,3,4,5,-1]
// 完整写法
let res = arr.some((item,index)=>{
if(item < 0) {
return true
}
})
let res = arr.some(item=>item < 0) // true
let res2 = arr.some(item=>item) // true
let arr2 = []
let res3 = arr.some(item=>item ) // false
8，find（返回符合条件的第一项）
没找到返回undefined，对于空数组，是不会执行的，并且不会改变原数组
const arr = [
{name: 'tony', age: '20'},
{name: 'jack', age: '18'}
]
const result1 = arr.find(item => {
return item.name === 'jack';
})
console.log(result1); // {name: 'jack', age: 18}
const result2 = arr.find(item => {
return item.namee === 'mary';
})
console.log(result2); // undefined
9、findIndex（返回符合条件的第一项的下标）
const arr = [
{name:'tony1',age:'20'},
{name:'tony2',age:'20'},
{name:'tony3',age:'20'},
{name:'jack',age:"30"}, // 只管返回第一个满足条件的
{name:'jack',age:"100"}
];
const result = arr.findIndex(item => {
return item.name === 'jack';
})
// 简写
const res = arr.findIndex(item=>item.name === 'jack')
console.log(result); // 3
10，reduce高阶函数（迭代（累加器））
reduce()函数是 ECMAScript 6 (ES6) 中数组的一个迭代方法，它接收一个回调函数作为累加器（accumulator），对该数组的所有元素（从左到右）执行操作，最后将计算结果累积为单一输出值。
reduce 函数是 JavaScript 中的一个功能强大的高阶函数，它算是 JS 数组方法里面较为复杂的一个函数了。reduce 的灵活性在于它能够遍历数组的所有元素，根据提供的函数累积一个最终的返回值。reduce()方法可以应用的场景特别多，循环遍历能做的，reduce都可以做，比如数组求和、数组求积、统计数组中元素出现的次数、数组去重等等。
function(（total,currentValue, index,arr）=>{},initialValue)：回调函数，必需。
total：上一次回调函数的返回值，第一次调用回调函数时，如果指定的初始值 initialValue，那么该参数值就是 initialValue，否则就是数组元素的第一个。
currentValue：数组中正在处理的元素。在第一次调用时，若指定了初始值 initialValue，那么当前处理的元素就是数组的第一个元素，否则的话就是第二个元素。
currentIndex：数组中正在处理的元素的索引。若指定了初始值 initialValue，则起始索引号为 0，否则从索引 1 起始。
array：用于遍历的数组。
initialValue：可选。传递给函数的初始值。也就是第一次调用回调函数时参数total，是否指定初始值将会影响其它几个参数的值。
reduce 方法的返回值就是遍历所有数组执行回调函数后的返回值。
arr.reduce((total,item,index,self)=>{
total：初始值或计算结束后的返回值
item：数组的每一个元素
index：元素的下标
self：数组本身
// 有返回值
// 返回计算结束后的total
},0) // 初始值，不写0 遇到空数组会报错
let arr = [1,2,3,4,5]
// 累加
let res = arr.reduce((prev,cur)=>prev+cur,0) // 15
// 求最大值
let max = arr.reduce((prev,cur)=>prev>cur ? prev: cur,0) // 5
//按指定属性求和：
const arr = [
{ name: '小明', score: 98 },
{ name: '小花', score: 96 },
{ name: '小强', score: 90 },
];
const result = arr.reduce((total, currentValue) => {
return total + currentValue.score
}, 0);
console.log(result); // 284
//数组去重
const arr = [1, 2, 2, 3, 3, 4, 4, 5, 6];
const result = arr.reduce((total, currentValue) => {
if(!total.includes(currentValue)) {
total.push(currentValue)
}
return total;
}, []);
console.log(result);
// [1, 2, 3, 4, 5, 6]
二，遍历对象object
1，for … in
用于迭代对象的可枚举字符串属性，包括自身属性和继承的属性，但不会遍历对象的原型链上的 非可枚举属性，以及对象的方法
for( let key in obj ) {
key：属性名
obj[key]：属性值
}
2,for of
用于迭代可迭代对象定义的要进行迭代的值。可迭代对象 包括 数组、字符串、Set、Map等，还包括 arguments 对象。它遍历的是可迭代对象的迭代器（Iterator）返回的值或键值对，而不能直接用于普通的对象。
keys，values，entries
它们都返回一个遍历器对象，可以用 for…of 循环进行遍历
keys – 返回元素索引
values – 返回元素本身
entries – 返回元素和下标
//for..of 遍历对象
for( const key of obj){
console.log(key) //报错 Uncaught TypeError: obj is not iterable
}
//Object.keys()方法
for(const key of Object.keys(obj)){
console.log(key)
}
3,Object.keys
Object.keys：返回对象自身属性名组成的数组
Object.values：返回对象自身属性值组成的数组
Object.entries
Object.keys(obj).forEach((key)=>{
key：属性名
obj[key]：属性值
})
三，数组去重
1,利用Set()+Array.from()
将数组的每一个元素依次与其他元素做比较，发现重复元素，删除
Set对象：是值的集合，你可以按照插入的顺序迭代它的元素。 Set中的元素只会出现一次，即Set中的元素是唯一的。
Array.from() 方法：对一个类似数组或可迭代对象创建一个新的，浅拷贝的数组实例。
const arr = [1, 2, 2, 'abc', 'abc', true, true, false, false, undefined, undefined, NaN, NaN]
const result = Array.from(new Set(arr))
console.log(result) // [ 1, 2, 'abc', true, false, undefined, NaN ]
2,利用数组的includes+push方法
此方法逻辑与indexOf方法去重异曲同工，只是用includes方法来判断是否包含重复元素。
includes()方法：用来判断一个数组是否包含一个指定的值，根据情况，如果包含则返回 true，否则返回 false。
const arr = [1, 2, 2, 'abc', 'abc', true, true, false, false, undefined, undefined, NaN, NaN]
function removeDuplicate(arr) {
const newArr = []
arr.forEach(item => {
if (!newArr.includes(item)) {
newArr.push(item)
}
})
return newArr
}
const result = removeDuplicate(arr)
console.log(result) // [ 1, 2, 'abc', true, false, undefined, NaN ]
3,利用forEach+indexOf方法
新建一个空数组，遍历需要去重的数组，将数组元素存入新数组中，存放前判断数组中是否已经含有当前元素，没有则存入。此方法也无法对NaN去重。
indexOf() 方法：返回调用它的String对象中第一次出现的指定值的索引，从 fromIndex 处进行搜索。如果未找到该值，则返回 -1。
const arr = [1, 2, 2, 'abc', 'abc', true, true, false, false, undefined, undefined, NaN, NaN]
function removeDuplicate(arr) {
const newArr = []
arr.forEach(item => {
if (newArr.indexOf(item) === -1) {
newArr.push(item)
}
})
return newArr // 返回一个新数组
}
const result = removeDuplicate(arr)
console.log(result) // [ 1, 2, 'abc', true, false, undefined, NaN, NaN ]
4，对象数组去重利用filter 和Map
function uniqueObjectArray(arr: any) {
const map = new Map()
return arr.filter((item: any) => {
const key = JSON.stringify(item)
const isNew = !map.has(key)
map.set(key, item)
return isNew
})
}
let arr1 = [{a:1,b:2},{a:1,b:2},{a:4,b:5}]
console.log(uniqueObjectArray(arr1));
///[{a:1,b:2}{a:4,b:5}]
