JS题目之数组数据拆分重组转成嵌套对象,让脑细胞活跃下
栏目: JavaScript · 发布时间: 6年前
内容简介:下班的时候在群里看到一个小伙伴,在群里问了一道来了兴趣就折腾了下,以下是解答过程,用的是格式:先拿到数据格式如下;
下班的时候在群里看到一个小伙伴,在群里问了一道 js 的题,发现没人理会他;
来了兴趣就折腾了下,以下是解答过程,用的是 ES6+ 的特性,在 chrome跑的
题目
效果图
解答
尽量注释,我分步骤解答
1:数组变形
格式:先拿到数据格式如下;
[ [ 'code', 'Zh' ], [ 'code', 'Cn' ], [ 'taobao', '.cn' ], [ 'taobao', '.com' ] ] 复制代码
实现
这一步是拆开数据拿到我们想要的,比如基于大写字母,基于域名后缀;
因为数据格式是死的,所以正则也相对较为简单
let arr = ['codeZh', 'codeCn', 'taobao.cn', 'taobao.com'];
let arrSplit = arr.map(item => {
if (item.indexOf('.')!== -1){
return item.replace(/(\.)/g, ",$1").split(',')
} else {
return item.replace(/([A-Z])+/g, ",$1").split(',')
}
})
console.log(arrSplit);
复制代码
2:输出构建对象数据
格式:先拿到数据格式如下;
[ { code: { Zh: 'codeZh' } },
{ code: { Cn: 'codeCn' } },
{ taobao: { '.cn': 'taobao.cn' } },
{ taobao: { '.com': 'taobao.com' } } ]
复制代码
实现
let arrGroup = arrSplit.map(item => {
return {[item[0]]:{[item[1]]:item.join('')}}
})
console.log(arrGroup);
复制代码
3: 实现符合的JSON
格式: 先拿到数据格式如下;
{
"code": {
"Zh": "codeZh",
"Cn": "codeCn"
},
"taobao": {
".cn": "taobao.cn",
".com": "taobao.com"
}
}
复制代码
实现
let resultObj = {};
for (let i = 0; i < arrGroup.length; i++){
for (const [key, value] of Object.entries(arrGroup[i])) {
resultObj[key] = {
...resultObj[key],
...value
}
}
}
console.log(resultObj);
复制代码
完整代码
// 求数组转换成jso
//['codeZh', 'codeCn', 'taobao.cn', 'taobao.com']
// 输出
/*
{
'code':{Zh:'codeZh',Cn:'codeCn'},
'taobao':{'.cn':'taobao.cn},'.com':'taobao.com'
}
*/
const resultObj = {};
let arr = ['codeZh', 'codeCn', 'taobao.cn', 'taobao.com'];
let arrSplit = arr.map(item => (item.indexOf('.') !== -1 ? item.replace(/(\.)/g, ",$1").split(',') : item.replace(/([A-Z])+/g, ",$1").split(',')))
let arrGroup = arrSplit.map(item => ({ [item[0]]: { [item[1]]: item.join('') } }))
for (let i = 0; i < arrGroup.length; i++){
for (const [key, value] of Object.entries(arrGroup[i])) {
resultObj[key] = {
...resultObj[key],
...value
}
}
}
console.log(arrSplit);
console.log(arrGroup);
console.log(resultObj);
复制代码
以上所述就是小编给大家介绍的《JS题目之数组数据拆分重组转成嵌套对象,让脑细胞活跃下》,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对 码农网 的支持!
猜你喜欢:- iOS组件化拆分之业务与拆分并行开发
- html – 当我们拆分表时,如何将div拆分为两列?
- Python 循环嵌套
- MyBatis嵌套查询解析
- MyBatis嵌套查询解析
- Android 嵌套 Intent
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。
Head First 设计模式(中文版)
弗里曼 / O'Reilly Taiwan公司 / 中国电力出版社 / 2007-9 / 98.00元
《Head First设计模式》(中文版)共有14章,每章都介绍了几个设计模式,完整地涵盖了四人组版本全部23个设计模式。前言先介绍这本书的用法;第1章到第11章陆续介绍的设计模式为Strategy、Observer、Decorator、Abstract Factory、Factory Method、Singleton,Command、Adapter、Facade、TemplateMethod、I......一起来看看 《Head First 设计模式(中文版)》 这本书的介绍吧!