[想试试看JavaScript ] 阵列一些操作阵列好用的方法 map

之前介绍的方法 push、pop、shift、unshift、reverse、splice、sort、fill
方法,都会修改到原来的阵列

现在介绍一些会产生新阵列的方法


产生新的阵列或新的值

map()

map 看起来好像是英文中地图的意思,不过应该是采英文中映射的意思

map 跟 forEach 一样会将阵列中的元素一个一个传进指定的 callback 函式运算。

不同的是,map 会回传一个新阵列,并将 callback 函式的运算结果放在这个新阵列,原阵列不会做更改。

语法:

map() 小括弧里面会放一个 callback 函式,函式内有三个参数

  1. currentValue,阵列中正在被处理的元素,也就是正在被传进 callback 函式的元素
  2. index,正在被处理的元素的索引值
  3. array,呼叫 map 方法的原阵列
var new_Array=Array.map(function callback(currentValue,index,array){
	// return 要放在新阵列的元素
})

范例:

原本的阵列 a 不会被修改,而是产生新阵列传进变数 b 中

var a=[1,2,3,4,5,6,7,8];
var b=a.map(function(currentValue){
	return currentValue+10
});
console.log(a); // [1,2,3,4,5,6,7,8]
console.log(b); // [11,12,13,14,15,16,17,18]

map 回传的新阵列 b 的内容,在 map 的时候就决定了

所以之後再修改阵列 a ,也不会因为 map 影响到阵列 b 的内容

var a=[1,2,3,4,5,6,7,8];
var b=a.map(function(e){
    return e+10;
})
console.log(a); // [1,2,3,4,5,6,7,8]
console.log(b);
a.push(9);
console.log(a); // [1,2,3,4,5,6,7,8,9]
console.log(b); // [11,12,13,14,15,16,17,18]

<<:  每日挑战,从Javascript面试题目了解一些你可能忽略的概念 - Day12

>>:  【Day 12】- 找出看不见也摸不着的 Process,终极办法!

Day 19 : 案例分享(6.2) 人事、差勤与薪资 - 组织架构、人事资料及个人合同管理

案例说明及适用场景 组织架构是由部门及职务做为骨架,员工就职於某一个职务 员工在企业的职务,就如同系...

最完整!转专业 CS 补学分:你适合哪种路线?

学校:University of Colorado Boulder 科系:post-baccala...

Data layer implementation (1)

在上一篇,我们把 Ktor client 加到 Dagger 的 object graph 内。现在...

# Day 29 Page Migration (四)

文件 原文文件:Page migration 翻译: 监控迁移 ======== 下列事件 (计数器...

用React刻自己的投资Dashboard Day16 - react-router-dom让SPA也有路由

tags: 2021铁人赛 React 前一篇提到的导览列的各个按钮,点击之後会跳到不同的页面,每个...