JavaScript中动态设置对象键名：计算属性名与动态赋值技巧

const otherName = document.getElementById(`adminPanelManageUserOtherName`).value;
const otherValue = document.getElementById(`adminPanelManageUserOtherValue`).value;

// 错误的尝试：直接使用模板字符串作为键名
let temp = { `${otherName}`: `${otherValue}` };
// 这会导致语法错误，因为对象字面量中键名位置的模板字符串不是合法的动态键语法。

let obj = {
  [expression]: value
};

// 假设从DOM元素获取值
const otherName = document.getElementById(`adminPanelManageUserOtherName`).value; // 例如，otherName的值为 "userName"
const otherValue = document.getElementById(`adminPanelManageUserOtherValue`).value; // 例如，otherValue的值为 "Alice"

// 使用计算属性名动态创建对象
let temp = { [otherName]: otherValue };

console.log(temp); // 输出: { "userName": "Alice" }

let obj = {};
obj[variableKey] = value;

// 假设从DOM元素获取值
const otherName = document.getElementById(`adminPanelManageUserOtherName`).value; // 例如，otherName的值为 "productID"
const otherValue = document.getElementById(`adminPanelManageUserOtherValue`).value; // 例如，otherValue的值为 "P12345"

// 先创建一个空对象
let temp = {};

// 动态赋值
temp[otherName] = otherValue;

console.log(temp); // 输出: { "productID": "P12345" }

/**
 * 根据一组输入元素的ID，动态构建一个对象。
 * 对象的键名可以是元素的name属性，如果name不存在则使用ID。
 * 对象的键值是元素的value属性。
 * @param {string[]} inputIds - 包含输入元素ID的数组。
 * @returns {Object} - 动态构建的对象。
 */
function createObjectFromInputs(inputIds) {
    let resultObject = {};
    inputIds.forEach(id => {
        const element = document.getElementById(id);
        if (element && (element instanceof HTMLInputElement || element instanceof HTMLSelectElement || element instanceof HTMLTextAreaElement)) {
            const key = element.name || id; // 优先使用name属性作为键名，否则使用ID
            resultObject[key] = element.value;
        }
    });
    return resultObject;
}

// 假设HTML中存在以下输入元素：
// <input id="firstNameInput" name="firstName" value="John">
// <input id="lastNameInput" name="lastName" value="Doe">
// <input id="ageInput" name="age" value="30">

const userData = createObjectFromInputs(['firstNameInput', 'lastNameInput', 'ageInput']);
console.log(userData);
// 预期输出: { firstName: "John", lastName: "Doe", age: "30" }