常用的javaScript数据处理方法

最新推荐文章于 2023-12-28 08:49:37 发布

Chestnut*

最新推荐文章于 2023-12-28 08:49:37 发布

阅读量374

点赞数

分类专栏： js 文章标签： javascript 数组

本文链接：https://blog.youkuaiyun.com/weixin_43830188/article/details/110952778

版权

js 专栏收录该内容

15 篇文章

订阅专栏

本文介绍了JavaScript中常见的数据处理方法，包括filter用于过滤数组元素，map用于转化数组内对象，find则返回第一个符合条件的元素，而forEach用于遍历数组。此外，还讨论了includes方法检查数组是否包含特定值。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >


const students = [
    { name: 'Alice', score: 100 },
    { name: 'Bob', score: 90 },
    { name: 'Trunp', score: 80 },
    { name: 'Biden', score: 70 },
    { name: 'Joe', score: 60 },
    { name: 'Sunshine', score: 50 },
    { name: 'Elon', score: 40 },
    { name: 'Jack', score: 30 },
];

1. filter
过滤方法，返回符合的元素

//返回成绩大于75的高分学生
const highScores = students.filter(stu => stu.score > 75);
console.log(highScores);

结果：

[
    { name: 'Alice', score: 100 },
    { name: 'Bob', score: 90 },
    { name: 'Trunp', score: 80 }
]

这些操作返回的是一个新对象，不会影响到原值；

2. map
将数组内的item转化成另一种对象

//返回全部对象的name属性
const names = students.map(stu => stu.name);
console.log(names);

结果：

[ 'Alice','Bob', 'Trunp','Biden','Joe', 'Sunshine','Elon','Jack']

3. find
类似于filter方法，但返回第一个符合条件的元素。filter返回一个数组，find返回一个object。

//返回name长度为4的第一个对象
const foundedOne = students.find(stu=>stu.name.length === 4);
console.log(foundedOne);

结果：

{ name: 'Elon', score: 40 }

4、forEach
遍历数组内全部元素。

//打印元素
students.forEach(item=>console.log(`stu-name=${item.name},stu-score=${item.score}`));

结果：

stu-name=Alice,stu-score=100
stu-name=Bob,stu-score=90
stu-name=Trunp,stu-score=80
stu-name=Biden,stu-score=70
stu-name=Joe,stu-score=60
stu-name=Sunshine,stu-score=50
stu-name=Elon,stu-score=40

5. includes
是否包含指定的元素值。

const isIncludes = students.includes({ name: 'Jack', score: 30 });
console.log(isIncludes);

结果：false。