1、英文键名改中文键名
日常开发中,我们从后台请求过来的数据,对象的键名一般是英文,如果我们需要的是中文,怎么办呢?如果我们手中的数据,键名是中文,发送给后台,又需要英文的键名,怎么办呢?我们一起来封装一个吧
<script>
// ◆模拟一个从后台传过来的数据
const objInfo = [
{
'id': '01',
'password': '123456',
'mobile': '13667279878',
'username': '张三',
'workNumber': 'qy123',
'departmentName': '财务部',
},
{
'id': '02',
'password': '456123',
'mobile': '13867279178',
'username': '李四',
'workNumber': 'qy125',
'departmentName': '技术部',
}]
// ◆准备改动的模板
const mapInfo = {
'id': '编号',
'password': '密码',
'mobile': '手机号',
'username': '姓名',
'workNumber': '工号',
'departmentName': '部门',
}
// ◆封装英文键名 改为 中文键名 的函数
function tarnsZH(mapInfo, objInfo) {
// 1.遍历后台传过来的数据对象
const results = objInfo.map(item => {
console.log(item, 999);
// 2.声明新对象接收转化后的对象
let newObj = {}
// 3.获取后台的英文键名
let enKeys = Object.keys(mapInfo)
// 4.循环英文键名
enKeys.forEach((key) => {
// 5.给新对象新增中文键名和键值
newObj[mapInfo[key]] = item[key]
})
// 6.返回新对象
return newObj
})
//7.返回二维数组对象
return results
}
//◆调用并打印结果
console.log(tarnsZH(mapInfo, objInfo))
</script>
2、中文键名改英文键名
以上是英文键名转中文键名,那么中文键名转英文键名也是同理呀,我们只需要把上面封装好的函数再调用一次,传入实参即可,一起来看看吧
<script>
//◆这是我们手中的数据
const list = [
{
'编号': '01',
'密码': '123456',
'手机号': '13667279878',
'姓名': '张三',
'工号': 'qy123',
'部门': '财务部',
},
{
'编号': '02',
'密码': '456123',
'手机号': '13867279178',
'姓名': '张三',
'工号': 'qy125',
'部门': '技术部',
}]
//◆我们需要把以上中文键名转化成如下对应的英文键名
const obj = {
'编号': 'id',
'密码': 'password',
'手机号': 'mobile',
'姓名': 'username',
'工号': 'workNumber',
'部门': 'departmentName',
}
//◆封装函数 中文键名转英文键名
function tarnsEN(mapInfo, objInfo) {//形参
//1.遍历数组,得到每一个对象
return objInfo.map(item => {//7.直接在这里 return 二维数组也可以
console.log(item, 999);
//2.声明空对象,准备接收转化后的对象
let newObj = {}
//3.获取中文键名
let zhKeys = Object.keys(mapInfo)
//4.循环中文键名
zhKeys.forEach((key) => {
//5.给新对象新增英文键名和键值
newObj[mapInfo[key]] = item[key]
})
//6.返回新对象
return newObj
})
}
//◆调用函数并打印结果
console.log(tarnsEN(obj, list))
</script>
3、总结、抽离、注释
现在,我们把函数抽离出来,附上注释,以后就可以 CV 啦,当然你也可以找第三方模块~
/**
* @description:中英文键名的切换
* @param {mapInfo:Object} 转换的模板
* @param {objInfo:Array} 需要转换键名的数组
* @return: 返回一个二维数组
*/
function tarnsKeys(mapInfo, objInfo) {
return objInfo.map(item => {
console.log(item, 999);
let newObj = {}
let Keys = Object.keys(mapInfo)
Keys.forEach((prop) => {
newObj[mapInfo[prop]] = item[prop]
})
return newObj
})
}