Jolt中如何利用数组对象的id值引用外部USER_DETAILS_*键？

需求与问题 #

需要遍历userList数组重新构建数据结构，过程中要根据每个用户对象的id，提取外部以USER_DETAILS_+id命名的对象中的详情字段。但遍历数组时无法通过id值动态获取对应命名的对象，尝试使用&符号也无效。

输入数据 #

{
    "otherList": [
        {
            "id": "def",
            "displayDetail": "Text here."
        },
        {
            "id": "abc",
            "displayDetail": "Text"
        }
    ],
    "userList": [
        {
            "id": "FIRST-d87c-11ed-a612",
            "address": "123 Elm street",
            "metadata": {
                "userInput": "",
                "userOutput": ""
            },
            "subComponentId": "12.1"
        },
        {
            "id": "SECOND-d87c-11ed-a612",
            "accessFullName": "456 Little Elm street",
            "metadata": {
                "userInput": "",
                "userOutput": ""
            },
            "subComponentId": "12.2"
        }
    ],
    "USER_DETAILS_FIRST-d87c-11ed-a612": {
        "id": "FIRST-d87c-11ed-a612",
        "textValue": "Text value for first user.",
        "detail": "Comp|Boorgu,Johny|04-11-23"
    },
    "USER_DETAILS_SECOND-d87c-11ed-a612": {
        "id": "SECOND-d87c-11ed-a612",
        "textValue": "Text value for second user.",
        "detail": "Limit|Kaur,Rajesh|04-11-23"
    }
}

预期输出 #

{
    "components": [
        {
            "componentId": "1",
            "isEditable": true,
            "type": "other",
            "subComponent": [
                {
                    "subComponentId": "1.1",
                    "otherId": "def",
                    "inputUI": "",
                    "displayDetail": "Text here."
                },
                {
                    "subComponentId": "1.2",
                    "otherId": "abc",
                    "inputUI": "",
                    "displayDetail": "Text"
                }
            ]
        },
        {
            "componentId": "2",
            "isEditable": true,
            "type": "user",
            "subComponent": [
                {
                    "subComponentId": "2.1",
                    "userId": "FIRST-d87c-11ed-a612",
                    "address": "123 Elm street",
                    "inputUI": "Comp|Boorgu,Johny|04-11-23",
                    "displayDetail": "Text value for second user."
                },
                {
                    "subComponentId": "2.2",
                    "userId": "SECOND-d87c-11ed-a612",
                    "address": "456 Little Elm street",
                    "inputUI": "Limit|Kaur,Rajesh|04-11-23",
                    "displayDetail": "Text value for first user."
                }
            ]
        }
    ]
}

解决方案 #

核心问题是动态访问对象属性：JavaScript中不能用点符号访问动态命名的属性，必须使用方括号语法，通过拼接属性名字符串来获取对应值。

以下是完整的转换代码示例：

// 假设输入数据存储在inputData变量中
const inputData = { /* 上述输入数据 */ };

const components = [];

// 处理otherList部分
components.push({
    componentId: "1",
    isEditable: true,
    type: "other",
    subComponent: inputData.otherList.map((item, index) => ({
        subComponentId: `1.${index + 1}`,
        otherId: item.id,
        inputUI: "",
        displayDetail: item.displayDetail
    }))
});

// 处理userList部分
components.push({
    componentId: "2",
    isEditable: true,
    type: "user",
    subComponent: inputData.userList.map((item, index) => {
        // 动态拼接USER_DETAILS的属性名
        const detailKey = `USER_DETAILS_${item.id}`;
        const userDetail = inputData[detailKey];
        
        return {
            subComponentId: `2.${index + 1}`,
            userId: item.id,
            address: item.address || item.accessFullName, // 兼容不同字段名
            inputUI: userDetail?.detail || "",
            displayDetail: userDetail?.textValue || ""
        };
    })
});

const outputData = { components };
console.log(JSON.stringify(outputData, null, 2));

关键说明 #

1. 动态属性访问：用inputData[USER_DETAILS_${item.id}]替代点符号，实现根据id动态获取对应详情对象。
2. 字段兼容：处理userList中部分对象用accessFullName替代address的情况，用||做兜底取值。
3. 容错处理：userDetail?.detail使用可选链操作，避免因属性不存在导致代码报错。

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