js键值对的创建与读取

Question

jquery实现
1.从DOM中遍历出id与值组成了一个键值对
2.读取或遍历其中的值

以下写法正确吗？有没更好的用法？

 let paramsObj = {};
 let key = $(this).attr("id");;
 let value = $(this).val();
 paramsObj[key] = value;   
 $.each(paramsObj, function (key, value) {                  
     console.log(key + ':' + value);
 });

Answer 1

本答案参考 多次询问 ChatGPT-3.5 后选择的最佳回答，若是满意，还请采纳，谢谢

1. 分析现有代码的正确性
   • 创建键值对部分
     • 在JavaScript中，使用let关键字声明变量是正确的。这里的代码意图是从一个DOM元素（通过$(this)获取）中获取id属性作为键，val（这里应该是获取输入框之类的值）作为值，然后将其添加到paramsObj对象中。这部分代码在逻辑上是可行的。
   • 遍历键值对部分
     • 使用$.each（这是jQuery的遍历方法）来遍历对象paramsObj。在回调函数中，它会将对象的键和值分别作为参数传递给回调函数。这里将键和值连接成一个字符串并打印到控制台，这也是一种合理的操作。
2. 改进的用法
   • 创建键值对部分
     • 可以使用对象字面量的方式更简洁地创建对象。如果是在一个事件处理函数中（因为使用了$(this)），可以考虑使用map方法来批量创建对象。例如，如果有一组具有id和value的输入元素：

let paramsObj = $('input').map(function () {
    return {
        [$(this).attr('id')]: $(this).val()
    };
}).get();

• 遍历键值对部分
  • 如果不依赖于jQuery，在现代JavaScript中，可以使用for...in循环或者Object.entries方法来遍历对象。
  • 使用for...in循环：

for (let key in paramsObj) {
    if (paramsObj.hasOwnProperty(key)) {
        console.log(key + ':' + paramsObj[key]);
    }
}

 - 使用`Object.entries`（ES2017+）：

Object.entries(paramsObj).forEach(([key, value]) => {
    console.log(key + ':' + value);
});