如何提取对象数组指定属性值并拼接为指定格式的字符串

最简实现（ES6+） #

直接使用map+join组合即可完成需求，代码如下：

// 原数组
const skillArr = [
    {
        "id": 1,
        "name": "skill 1"
    },
    {
        "id": 2,
        "name": "skill 2"
    },
    {
        "id": 3,
        "name": "skill 3"
    }
];

// 拼接逻辑
const result = skillArr.map(item => item.name).join(' - ');

// 输出结果：skill 1 - skill 2 - skill 3
console.log(result);

实现逻辑 #

• Array.map()：遍历原数组，提取每个对象的name属性，生成仅包含name值的新数组 ["skill 1", "skill 2", "skill 3"]
• Array.join()：接收分隔符' - '作为入参，将数组所有元素拼接为单个字符串

兼容ES5及更早版本的循环实现 #

如果需要兼容不支持ES6语法的环境，可以用for循环实现：

var skillArr = [/* 原数组内容 */];
var nameList = [];
for (var i = 0; i < skillArr.length; i++) {
    nameList.push(skillArr[i].name);
}
var result = nameList.join(' - ');

可选优化 #

如果数组中可能存在无name属性的对象，可新增过滤步骤避免空值拼接：

const result = skillArr.map(item => item.name).filter(Boolean).join(' - ');

内容的提问来源于stack exchange，提问作者arlabbafi