JS题目之数组数据拆分重组转成嵌套对象,让脑细胞活跃下
栏目: JavaScript · 发布时间: 5年前
内容简介:下班的时候在群里看到一个小伙伴,在群里问了一道来了兴趣就折腾了下,以下是解答过程,用的是格式:先拿到数据格式如下;
下班的时候在群里看到一个小伙伴,在群里问了一道 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
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。