通过为列表设置新值来映射更改的字段

Question

我需要通过检查字段的哪个键已更改并创建一个具有将在屏幕上显示给用户的值的新键来映射已更改的字段。

log: [
    0: {type: "Changed", fields_changed: Array(2), date_modification: Timestamp, modified_by: "ID_USER"}
    1: {type: "Changed", fields_changed: Array(4), date_modification: Timestamp, modified_by: "ID_USER"}
    2: {type: "Changed", fields_changed: Array(2), date_modification: Timestamp, modified_by: "ID_USER"}
    3: {type: "Changed", fields_changed: Array(4), date_modification: Timestamp, modified_by: "ID_USER"}
]

fields_changed: [
    0: {key: "name", value: "New name"}
    1: {key: "age", value: 22}
]

我需要将其与fieldsNames 映射以检查字段名称并创建一个新的日志对象以显示给用户。

const fieldsNames = [
    {key: 'name', field_name: 'Name'},
    {key: 'age', field_name: 'Age'},
]

有了这个，我将创建一个新的日志列表，其中包含字段名称而不是字段键名称。

示例：

fields_changed: [
    0: {key: "name", value: "New name", field_name: "Nome"}
    1: {key: "age", value: 22, field_name: "Age"}
]

对于每个对象，我将在 fields_changed 键内创建一个新列表，其中包含一个名为 field_name 的新键，以便我可以在屏幕上为用户显示已更改字段的名称。

有了这个，我会有一个新的日志列表，上面的 fields_changed 列表已更改。

对于我想显示哪些字段已更改的用户，我必须通过fields_changed 并获取field_name，这是一个带有字段名称的字符串。

Answer 1

好的，

如果我对您的理解正确，这应该对您有所帮助。它使用包含{key: string, field_name: string, value: string,} 对象的fields_changed 数组创建新的日志对象。

这是一个工作示例，为简单起见，我稍微更改了您的示例。

const log = [
    {
        type: "Changed", 
        fields_changed: [
            { key: "name", value: "New name" },
            { key: 'city', value: 'new york' }
        ]
    },
    { 
        type: "Changed", 
        fields_changed: [
            { key: "age", value: '10' }
        ] 
    },
]

const fieldsNames = [
    { key: 'name', field_name: 'Name' },
    { key: 'age', field_name: 'Age' },
    { key: 'city', field_name: 'City' }
]


const changes_for_display = log
    // loop through log object.
    .map(change => ({

        // for every object, map its fields_changed property,
        fields_changed: change.fields_changed.map(field_change => {

            // Look for a field in fieldsNames with same key as field_change.
            const field = fieldsNames.find(name => name.key === field_change.key);
            if (!field) {
                throw 'Field ' + field_change.key + ' NOT FOUND....';
            }

            // build new field_change object out of it,
            // basaically, just asasign value property..
            return Object.assign(field, { value: field_change.value })

        }), type: change.type })
    );


// Cheers..
console.log(changes_for_display)