ES6数组的扩展方法map、filter、reduce、fill和数组遍历for…in for…of arr.forEach
一、数组的扩展方法
1: array.map的用法
const arr = [1,2,3,4];
const newarr = arr.map(item=>item+2);
console.log(newarr);
2: array.filter() 过滤
const arr = [1,2,3,4,5,6,7];
const newarr = arr.filter(item=> item%2==0);
console.log(newarr);
3: array.reduce() "缩减" "累加器"
//currentValue:当前值
// reduce第二个参数指定初始值
const arr = [1,2,3,4,5];
let sum = arr.reduce((total,currentValue)=>{
return total + currentValue;
},10) //初始值为10，然后累加
console.log(sum);
4:fill填充
let arr = [1,2,3,4,5,6,7];
arr.fill('x',1,3);
console.log(arr);
二、数组遍历
1:for of遍历数组的值(遍历可迭代具备迭代器接口)
const arr = ["a","b","c","d"];
for(let v of arr){
console.log(v);
}
2:for in遍历索引(遍历可枚举类型)
const arr = ["a","b","c","d"];
for(let k in arr){
console.log(k);
}
3:"遍历对象" for of "遍历对象" 不能直接遍历，因为对象不是可迭代的
const Person={realname:"张三",age:19};
for(let key of Person){
console.log(key);
}这个结果是错的
下面是正确的遍历方法：先把对象的key值全部放在一个数组arr中，遍历arr，直接输出每个key对应的value
const Person={realname:"张三",age:19};
const keys = Object.keys(Person);//获得所有对象的keys
for(let k of keys){
console.log(`k:${k},v:${Person[k]}`);
}
4:forEach的用法
let arr = [1,2,3,4];
arr.forEach((item,index)=>{
console.log(`v:${item},k:${index}`);
})
三、练习
1: 数组，格式化对象，{name:'张三',birthday:'2020-10-09'} 格式化为
// {name:'张三',birthday:'2020-10-09',age:20}
✨有疑问可评论
const persons = [
{name:'张三',birthday:'2020-10-09'},
{name:'李四',birthday:'1990-01-17'},
{name:'李元芳',birthday:'2002-03-07'},
{name:'兰陵王',birthday:'1993-08-09'},
]
let newpersons = persons.map((item)=>{
let year = new Date(item.birthday).getFullYear();
let age = new Date().getFullYear()-year;
return {...item,age};
})
let str = '';
// console.log(newpersons);
for (let item of newpersons) {
str = str+`姓名：${item.name}，出生日期：${item.birthday}，年龄：${item.age} `
}
document.querySelector('ul').innerHTML = str;
2：筛选1题目中年龄小于20的信息。
年龄小于20岁
3：一组人员信息，输出到页面上用表格显示。
姓名
分数
4：输出一组人员信息，输出到页面信息如下（（姓名，分数，是否及格60分）;
