Today I saw a friend asking a question in the Q&A section of CSDN. He wanted to convert a one-dimensional array into a three-dimensional array. I was not very busy, so I immediately arranged a task for him. Of course, I didn’t bother to look up any information or anything. I just followed my own ideas! There is source code below The above is his data format, and the following is the data format to be converted Without further ado, let’s get straight to the code let arr = [{ 'peovince': 'a', 'city': 'b', 'area': 'c' }, { 'peovince': 'a', 'city': 'b', 'area': 'd' }, { 'peovince': 'a', 'city': 'e', 'area': 'f' }, { 'peovince': 'a', 'city': 'e', 'area': 'g' }, { 'peovince': 'o', 'city': 'p', 'area': 'q' }, { 'peovince': 'o', 'city': 'p', 'area': 'r' }, { 'peovince': 'o', 'city': 's', 'area': 't' }, { 'peovince': 'o', 'city': 's', 'area': 'v' }]; Start converting let list = Array.from(new Set( arr.map(item => { return item['peovince'] }))) let subList = [] list.forEach(res => { arr.forEach(ele => { if (ele['peovince'] === res) { let nameArr = subList.map(item => item.value) if (nameArr.indexOf(res) !== -1) { let nameArr2 = subList[nameArr.indexOf(res)].children.map(item => item.value) if (nameArr2.indexOf(ele['city']) !== -1) { subList[nameArr.indexOf(res)].children[nameArr2.indexOf(ele['city'])].children.push({ value: ele['area'], label:ele['area'], }) } else { subList[nameArr.indexOf(res)].children.push({ value: ele['city'], label:ele['city'], children: [{ value: ele['area'], label:ele['area'], }] }) } } else { subList.push({ value: res, label: res, children: [{ value: ele['city'], label:ele['city'], children: [{ value: ele['area'], label:ele['area'], }] }] }) } } }) }) console.log(subList) The subList printed at the end is the desired format. Let's take a look at the printing ps: JavaScript one-dimensional array to two-dimensional array The first case: when the array contains strings let array = [1, 2, 3, 4, 5, 6, 7, 8]; len len = array.length; let n = 4; //Assume that 4 items are displayed per line let lineNum = len % n === 0 ? len / n : Math.floor( (len / n) + 1 ); let res = []; for (let i = 0; i < lineNum; i++) { // The slice() method returns a shallow copy of a portion of an array selected from the beginning to the end (excluding the end) into a new array object. The original array will not be modified. let temp = array.slice(i*n, i*n+n); res.push(temp); } console.log(res); The second case: when the array contains objects When the array elements are objects, you cannot use the slice method to intercept them, because slice is a shallow copy. The resulting problem is that if you modify the value of the newly generated array object, it will affect the value of the object in the original array. let objArray = [{a: 1}, {b: 2}, {c: 3}, {d: 4}, {e: 5}, {f: 6}, {g: 7}]; let len = objArray.length; let n = 4; //Assume that 4 items are displayed per line let lineNum = len % 4 === 0 ? len / 4 : Math.floor( (len / 4) + 1 ); let res = []; for (let i = 0; i < lineNum; i++) { let temp = objArray.slice(i*n, i*n+n); res.push(JSON.parse(JSON.stringify(temp))); } console.log(res); This is the end of this article about converting JS one-dimensional array into three-dimensional array. For more relevant content about converting JS one-dimensional array into three-dimensional array, please search previous articles on 123WORDPRESS.COM or continue to browse the related articles below. I hope everyone will support 123WORDPRESS.COM in the future! You may also be interested in:
|
<<: MySQL detailed summary of commonly used functions
>>: Method of iframe adaptation in web responsive layout
This reading note mainly records the operations r...
Table of contents What is the reason for the sudd...
This article shares the specific code for importi...
Ideas It's actually very simple Write a shell...
1 Create a user and specify the user's root p...
In the process of web front-end development, UI d...
Contents of this article: Page hollow mask layer,...
This article example shares the specific code of ...
When we make a web page, sometimes we want to hav...
Alibaba Cloud Server cannot connect to FTP FileZi...
I just bought an Alibaba Cloud host and couldn’t ...
Cause: NVIDIA graphics card driver is damaged Sol...
Preface In daily work, we sometimes run slow quer...
Author | Editor Awen | Produced by Tu Min | CSDN ...
1. Download: http://www.oracle.com/technetwork/ja...