js之map映射forEach迭代

简介: js之map映射forEach迭代

map 映射

函数定义


map<U>(callbackfn: (value: T, index: number, array: T[]) => U, thisArg?: any): U[];

一个简单的map映射示例


'use strict'
var list = [1, 2, 3, 4, 5];
var newList = list.map(value => value * 2);
console.log(newList);
// [ 2, 4, 6, 8, 10 ]

使用map映射对象数据,给每个元素添加新的属性


'use strict'
var list = [
    {
        name: "Tom",
        age: 10
    },
    {
        name: "Jack",
        age: 20
    }
];
var newList = list.map((item, index)=>{
    return {
        index: index,
        name: item.name,
        age: item.age + 1,
        active: false
    }
});
console.log(newList);
/**
[ 
    { 
        index: 0, 
        name: 'Tom', 
        age: 11, 
        active: false 
    },
    { 
        index: 1, 
        name: 'Jack', 
        age: 21, 
        active: false 
    } 
]
*/

forEach 迭代

函数定义


forEach(callbackfn: (value: T, index: number, array: T[]) => void, thisArg?: any): void;

使用 forEach 给列表添加属性


'use strict'
var list = [
    {
        name: "Tom",
        age: 10
    },
    {
        name: "Jack",
        age: 20
    }
];
list.forEach((item, index)=>{
        item.age = item.age + 1;
        item.active = false;
        item.index = index;
});
console.log(list);
/**
[ 
    { 
        name: 'Tom', 
        age: 11, 
        active: false, 
        index: 0 
    },
   { 
        name: 'Jack', 
        age: 21, 
        active: false, 
        index: 1 
    } 
]
*/

区别

map 和 forEach 都是迭代列表元素,参数都相同

map有返回值,forEach无返回值

相关文章
|
3天前
|
存储 JavaScript 索引
js开发:请解释什么是ES6的Map和Set,以及它们与普通对象和数组的区别。
ES6引入了Map和Set数据结构。Map的键可以是任意类型且有序,与对象的字符串或符号键不同;Set存储唯一值,无重复。两者皆可迭代,支持for...of循环。Map有get、set、has、delete等方法,Set有add、delete、has方法。示例展示了Map和Set的基本操作。
17 3
|
22天前
|
JavaScript 前端开发 索引
问js的forEach和map的区别
JavaScript中的`forEach`和`map`都是数组迭代方法。`forEach`遍历数组但不修改原数组,无返回值;它接受回调函数处理元素。`map`则遍历数组并返回新数组,新数组元素为回调函数处理后的结果。两者都接收元素、索引和数组作为回调函数参数。
20 7
|
1月前
|
JavaScript 前端开发
解释 JavaScript 中的`map()`、`filter()`和`reduce()`方法的用途。
解释 JavaScript 中的`map()`、`filter()`和`reduce()`方法的用途。
19 1
|
3月前
|
JavaScript 前端开发 定位技术
JavaScript 中如何代理 Set(集合) 和 Map(映射)
JavaScript 中如何代理 Set(集合) 和 Map(映射)
50 0
|
3月前
|
分布式计算 JavaScript 前端开发
JS中数组22种常用API总结,slice、splice、map、reduce、shift、filter、indexOf......
JS中数组22种常用API总结,slice、splice、map、reduce、shift、filter、indexOf......
|
1月前
|
存储 JavaScript
JS中Map对象与object的区别
JS中Map对象与object的区别
|
1月前
|
存储 JavaScript 前端开发
javascript中的Map和Set
javascript中的Map和Set
|
3月前
|
JavaScript 前端开发 测试技术
[小笔记]TypeScript/JavaScript模拟Python中的zip(不使用map)
[小笔记]TypeScript/JavaScript模拟Python中的zip(不使用map)
19 0
|
3月前
|
存储 前端开发 JavaScript
javascript 数组处理的两个利器: `forEach` 和 `map`(下)
javascript 数组处理的两个利器: `forEach` 和 `map`(下)
|
3月前
|
存储 JavaScript 前端开发
javascript 数组处理的两个利器: `forEach` 和 `map`(上)
javascript 数组处理的两个利器: `forEach` 和 `map`(上)
javascript 数组处理的两个利器: `forEach` 和 `map`(上)