JS题目之数组数据拆分重组转成嵌套对象,让脑细胞活跃下

栏目: JavaScript · 发布时间: 5年前

内容简介:下班的时候在群里看到一个小伙伴,在群里问了一道来了兴趣就折腾了下,以下是解答过程,用的是格式:先拿到数据格式如下;

下班的时候在群里看到一个小伙伴,在群里问了一道 js 的题,发现没人理会他;

来了兴趣就折腾了下,以下是解答过程,用的是 ES6+ 的特性,在 chrome跑的

题目

JS题目之数组数据拆分重组转成嵌套对象,让脑细胞活跃下

效果图

JS题目之数组数据拆分重组转成嵌套对象,让脑细胞活跃下

解答

尽量注释,我分步骤解答

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题目之数组数据拆分重组转成嵌套对象,让脑细胞活跃下》,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对 码农网 的支持!

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

万万没想到

万万没想到

万维钢(同人于野) / 电子工业出版社 / 2014-10-1 / 39.80元

本书精选了万维钢老师的文章和书评,以“用理工科思维理解世界”为导向。作者常用有趣的实验、数据来解读感性的事物,其理工科思维涉及行为经济学、认知心理学、社会学、统计学、物理等许多学科,以前沿的科学视角解读生活,为人们提供了认知的新方法。读完本书相当于精读了十几本经过筛选 、再创作及通俗化处理的巨著,不仅有趣还十分有营养。一起来看看 《万万没想到》 这本书的介绍吧!

在线进制转换器
在线进制转换器

各进制数互转换器

URL 编码/解码
URL 编码/解码

URL 编码/解码

HEX HSV 转换工具
HEX HSV 转换工具

HEX HSV 互换工具