欢迎光临精准像素,本站所有资源仅供学习与参考,禁止用于商业用途或从事违法行为!

js教程

JavaScript优雅地修改对象属性名

js教程 精准像素 2021-01-20 共102人阅读

在项目开发中总会需要对对象进行格式化以便处理,这其中就涉及到了修改对象的属性名,也就是对象键名的修改。

比如在处理下面这个对象时

const obj = {
name :
Bobo ',
job: ' Master',
number: 1234
};

采用传统的操作方式就是进行一个拷贝处理

obj ["lastName"] = obj ["name"]; 
delete obj["name"]
console. Log(obj);
//{ job: 'Master', number: 1234, las tName: Bobo ' }

但是当需要成批的修改键名,而且数据比较多时,此方式显然不能胜任,这会导致代码量激增,容易出产BUG,在JavaScript中如果涉及到对象的拷贝还有深浅之分。

因此有必要构建一个特定的方法来实现对对象属性名称的修改,而且要是优雅的,能够批量完成的方式。

//用提供的值替换多个对象键名称
const renameKeys = (keysMap, obj) =>
object . keys ( obj) . reduce(
(acc, key) => ({
acc,
{
[keysMap[key] I1 key]: obj[key]
}
}), {}
);

在这里借助Object.keys()、Array.prototype.reduce()和扩展运算符(...)就可以轻松完成对应键名的修改,支持批量操作,此后只需要调用这个方法就能快速和优雅地得到需要的结果

console. Log (renameKeys({
name: ' fi rstName
number: ' id'
}, obj));
//{ job: 'Master', id: 1234, Las tName: ' Bobo ' }


相关推荐
  • JavaScript语法
  • JavaScript ES6-11版本语法大全教程
    JavaScript ES6-11版本语法大全教程

    视频教程说明JavaScript ES6-11版本语法大全教程,共77课时,淘宝购买免费分享给大家。JavaScript ES6教程截图课程列表9-7 空值合并运算符:Nullish coalescing Operator_.mp49-6 可选链:Optional chai...

    视频教程 17 6个月前
  • javascript制作随机样式标签云方法
    javascript制作随机样式标签云方法

    精准像素分享一段超简单的javascript随机样式标签云方法,比网上那些长篇大论的简单好理解多了,一看就懂,效果如下。JS代码$(".tags a").each(function(){var x = 5;var y = 9;var rand = parseInt(M...

    js教程 37 1年前
  • JavaScript优雅地修改对象属性名

    在项目开发中总会需要对对象进行格式化以便处理,这其中就涉及到了修改对象的属性名,也就是对象键名的修改。比如在处理下面这个对象时const obj = {name :Bobo ',job: ' Master',number: 1234};采用传统的操作方式就是进行一个拷贝处理obj [...

    js教程 102 10个月前
  • JavaScript保留两位小数,自动补零

    将传来的数值或字符串,转换为浮点数。然后将小数点向右移动两位小数,再利用Math.round()方法进行四舍五入计算,最后除以100,这样实现保留两位小数。var value = Math . round( parseFloat(num) * 100 ) / 100;去掉逗号,将数值存到数组中var arrayNum = va...

    js教程 63 9个月前
  • JavaScript语法参考手册.pdf
    JavaScript语法参考手册.pdf

    JavaScript语法参考手册,主要分为:JavaScript 函数、JavaScript 方法、JavaScript 对象、JavaScript 属性、JavaScript 语句JavaScript手册截图

    电子书 15 8个月前