数组学习二

1 for in 、for of、 for 

const a = [1, 2, 3]
const obj = {
    age: '19',
    name: '三三'
}

for (let i = 0; i < a.length; i++) {
    console.log((a[i]))
}
// 1, 2, 3
for (let item in a) {
    console.log(a[item])
}
// 1，2，3

for (let item of a) { 
　　//for of 主要用在遍历数组  
　　console.log(item) 
} 
// 1，2，3 
for (let key in obj) { 
　　//for in 主要用在遍历对象属性 
　　console.log(key, ':', obj[key]) 
} 
// age: 19 // name: 三三

2、some()、every()

// some 某个，every 每个

// some是指数组中某个满足条件就返回true， 
// every是指每一个满足条件才会返回true

const students = [
    {name: '三三', age: 25},
    {name: '斑', age: 23},
    {name: '中级妖怪', age: 30}
]

const res1 = students.some((item) => {
    return item.name.startsWith('三');
})

const res2 = students.every((item) => {
    return item.age > 10;
})

console.log(res1, res2) 
// true true

3、map()、forEach()

const res = students.map(item => {
    return item.age // [25, 23, 30]
}) 
//map有返回值，返回数组类型,新数组,原数组不改变

students.forEach(item => {
    item.age += 1 // 
})
/**

　*　[ { "name": "三三", "age": 26 },
　*　{ "name": "斑", "age": 24 },
　*　{ "name": "中级妖怪", "age": 31 } ]

*/
//forEach没有返回值,返回原数组，原数组改变

4、filter()

const res1 = studengs.filter((item) => { 
     // filter有返回值，返回值是新数组，把符合过滤条件的过滤出来，原数组不变
     return item.age >= 25;
})

console.log(res1)
// [{name: "三三", age: 25}, {name: "中级妖怪", age: 30}]

5、find()、findIndex()

const res1 = students.find((item) { 
     // find 返回符合筛选挑条件的第一个元素
    return item.age >= 25;
})
console.log(res1) //{name: "三三", age: 25}

const a = [1, 3, 5, 7];
const s = a.find(item => {
　　return item > 3
});
console.log(s) // 5

const res1 = students.findIndex((item) => { 
    //findIndex第一个满足条件的index索引
    console.log(item)
    return item.age >= 25;
})
console.log(res1) // 0

6、reduce()、reduceRight()

// 很多时候需要累加数组项或者其它数组项计算后得到一个值（比如说求和）

// 参数 从左往右开始
/*
    prev：它是上一次调用回调时返回的结果，每次调用的结果都会给prev
    cur：当前的元素
    index：当前的索引
    arr：循环的数组
*/

// 求数组的和。
const a = [1,2,3,4,5,6,7,8,9,10]
const str = a.reduce((prev,cur,index,arr) => {
    return prev + cur ;
})
str // 55

// reduceRight()方法，从右往左开始，参数和上面是一样。
const str1 = a.reduceRight((prev,cur,index,arr) => {
    return prev + cur ;
})
// str1  // 55

7、indexOf()、lastIndexOf()、includes()

// indexOf() 是从左往右查，返回第一个匹配索引，大小写敏感，找不到返回-1，内部使用严格相等
// lastIndexOf() 从右往左查，返回最后一个匹配索引
// 注意：二者返回索引都是从左往右计算的 
// includes()返回一个bool，表示包含给定的值


const arr = [1,2,3,4,5,5,6,7,1];
console.log(arr.indexOf(5));// 4 下标为4的位置
console.log(arr.lastIndexOf(5));// 5

console.log(arr.indexOf(5));

[NaN].indexOf(NaN); //-1
[NaN].includes(NaN); //true

// 可与上面find() 对比学习

8、assign() 与 解构运算符...

/*
Object.assign(target,...sources)；
target是目标对象
sources是源对象
返回目标对象
*/
var o1= {a:1};
var o2 = {b : 2};
var o3 = {c:3};
var obj = Object.assign(o1,o2,o3);
console.log(obj)  //{a:1,b:2,c:3};
console.log(o1)  //{a:1,b:2,c:3}; 注意目标对象也会发生变化

// 可以用 ... 解构运算符代替
var obj = {...o1,...o2,...o3}
console.log(obj)  //{a:1,b:2,c:3};
console.log(o1)  //{a:1};