map() 方法创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。
并举了个例子:
var array1 = [1,4,9,16];
const map1 = array1.map(x => x *2);
console.log(map1);
打印结果为:
> Array [2,8,18,32]
我这样写时:
var array1 = [1, 4, 9, 16];
const map1 = array1.map(x => {
if (x == 4) {
return x * 2;
}
});
console.log(map1);
打印结果为:
> Array [undefined, 8, undefined, undefined]
为什么会出现三个undefined呢?而不是我预期的[1,8,9,16]。
这样写只是增加了一个条件,即x的值为4时才乘以2,之所以会出现undefined,是因为map()方法创建了一个新数组,但新数组并不是在遍历完array1后才被赋值的,而是每遍历一次就得到一个值。所以,下面这样修改后就正确了:
var array1 = [1, 4, 9, 16];
const map1 = array1.map(x => {
if (x == 4) {
return x * 2;
}
return x;
});
这里注意箭头函数有两种格式:
1.只包含一个表达式,这时花括号和return都省略了。
2.包含多条语句,这时花括号和return都不能省略。
大家可以参考:ES6标准新增了一种新的函数
转载于:JS语法之:map()方法_OldWang-AI的博客-CSDN博客_js map()
js从数组中的对象取出特定字段并生成新的数组
let arr = [
{
'id': '1',
'name': '小红',
},
{
'id': '2',
'name': '小白',
},
{
'id': '3',
'name': '小黄',
}
];
// 使用map()生成数组
let new_arr = arr.map(obj => {return obj.name})
// 输出 ['小红','小白','小黄']
let xzbm=["1", "2", "3"]
let new_arr = xzbm.map(obj => {
return {
label:obj,
value:obj,
}
})
// 输出 [{label: '1', value: '1'},{label: '2', value: '2'},{label: '3', value: '3'}]