JavaScript Array map() 方法

简介: JavaScript Array map() 方法

 map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。map() 方法按照原始数组元素顺序依次处理元素。
注意:1. map()不会改变原始数组。
   2. map()不会对空数组进行检测。

array.map(function(currentValue,index,arr), thisValue)

image.png
返回值: 返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。

遍历和进行运算

const arr = [1,4,9,16]
console.log(arr.map((item) => Math.sqrt(item)))

image.png


 var studentList = [
    {
   "id": 1, "name": "李赫尔南", "age": 18},
    {
   "id": 2, "name": "李小白", "age": 28},
    {
   "id": 3, "name": "李小小", "age": 8},
]
console.log(studentList.map(item =>{
   
    return {
   name: item.name, age: item.age}
}))

image.png
注意:
 map()的遍历会跳过空位置,但是它会保留空的元素!

const arr = [1, , , 3, ,2 ,]
console.log(arr.map((item) => item*2))

image.png

相关文章
|
16天前
|
JavaScript 前端开发
JavaScript基础知识-方法
文章通过示例代码讲解了JavaScript中如何给对象添加方法以及如何调用这些方法。
18 2
JavaScript基础知识-方法
|
16天前
|
JavaScript 前端开发
JavaScript基础知识-数组的常用方法
关于JavaScript基础知识-数组的常用方法。
14 1
JavaScript基础知识-数组的常用方法
|
1天前
|
存储 JavaScript
js切割截取字符串方法
js切割截取字符串方法
|
1天前
|
JavaScript
JS数组合并的常用方法
JS数组合并的常用方法
|
14天前
|
前端开发 JavaScript
前端ES5 | js —添加元素方法
前端ES5 | js —添加元素方法
|
12天前
|
存储 JavaScript 前端开发
JS篇(Array、Object)
JS篇(Array、Object)
9 1
|
19天前
|
JavaScript 前端开发 开发者
|
19天前
|
Java 开发者 关系型数据库
JSF与AWS的神秘之旅:如何在云端部署JSF应用,让你的Web应用如虎添翼?
【8月更文挑战第31天】在云计算蓬勃发展的今天,AWS已成为企业级应用的首选平台。本文探讨了在AWS上部署JSF(JavaServer Faces)应用的方法,这是一种广泛使用的Java Web框架。通过了解并利用AWS的基础设施与服务,如EC2、RDS 和 S3,开发者能够高效地部署和管理JSF应用。文章还提供了具体的部署步骤示例,并讨论了使用AWS可能遇到的挑战及应对策略,帮助开发者更好地利用AWS的强大功能,提升Web应用开发效率。
42 0
|
JavaScript 前端开发 索引
|
2月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
70 2