1. Array flattening (also known as array dimensionality reduction) const test = ["a", ["b", "c"], ["d", ["e", ["f"]], "g"]] // When flat does not pass parameters, it defaults to flattening one layertest.flat() // ["a", "b", "c", "d", ["e", ["f"]], "g"] // flat passes in an integer parameter, which is the number of flattened layers test.flat(2) // ["a", "b", "c", "d", "e", ["f"], "g"] // When the Infinity keyword is used as a parameter, no matter how many layers of nesting there are, it will be converted into a one-dimensional array test.flat(Infinity) // ["a", "b", "c", "d", "e", "f", "g"] // Passing an integer <= 0 will return the original array without flattening test.flat(0) test.flat(-1) // ["a", ["b", "c"], ["d", ["e", ["f"]], "g"]] // If there are vacancies in the original array, the flat() method will skip the vacancies. ["a", "b", "c", "d",,].flat() // ["a", "b", "c", "d"] Method 1: Using the reduce methodFlatten all at once function flattenDeep(arr) { return Array.isArray(arr) ? arr.reduce( (acc, cur) => [...acc, ...flattenDeep(cur)] , []) : [arr] } // Test var test = ["a", ["b", "c"], ["d", ["e", ["f"]], "g"]] flattenDeep(test) // ["a", "b", "c", "d", "e", "f", "g"] Implement the flat function: function flat(arr, depth = 1) { return depth > 0 ? arr.reduce((acc, cur) => { if(Array.isArray(cur)) { return [...acc, ...flat(cur, depth-1)] } return [...acc, cur] } , []) :arr } // Test var test = ["a", ["b", "c"], ["d", ["e", ["f"]], "g"]] // When no parameters are passed, the default flattening is one layer flat(test) // ["a", "b", "c", "d", ["e", ["f"]], "g"] // Pass in an integer parameter, which is the number of flattened layers flat(test, 2) // ["a", "b", "c", "d", "e", ["f"], "g"] // When the Infinity keyword is used as a parameter, no matter how many nested levels there are, it will be converted to a one-dimensional array flat(test, Infinity) // ["a", "b", "c", "d", "e", "f", "g"] // Passing an integer <= 0 will return the original array without flattening flat(test, 0) flat(test, -10) // ["a", ["b", "c"], ["d", ["e", ["f"]], "g"]]; // If there are vacancies in the original array, the flat() method will skip the vacancies. var arr = ["a", "b", "c", "d",,] flat(arr) // ["a", "b", "c", "d"] Method 2: StackReduce all dimensions at once function flattenDeep(arr) { const result = [] //Copy array elements to the stack. Direct assignment will change the original array const stack = [...arr] // If the stack is not empty, loop through while (stack.length !== 0) { const val = stack.pop() if (Array.isArray(val)) { // If the array is pushed onto the stack again and one layer is expanded stack.push(...val) } else { // If it is not an array, insert it into the result array using head insertion result.unshift(val) } } return result } // Test var test = ["a", ["b", "c"], ["d", ["e", ["f"]], "g"]] flattenDeep(animals) // ["a", "b", "c", "d", "e", "f", "g"] 2. Array deduplicationMethod 1: Set (ES6)function unique(arr) { return Array.from(new Set(arr)) } // or var unique = arr => [...new Set(arr)] // Test var arr = [1, 2, 2, 3] unique(arr); // [1, 2, 3] Method 2: reducefunction unique(arr) { return arr.sort().reduce((acc, cur) => { if (acc.length === 0 || acc[acc.length - 1] !== cur) { acc.push(cur); } return acc }, [])} ; // Test var arr = [1, 2, 2, 3] unique(arr); // [1, 2, 3] Method 3: filterfunction unique(arr) { return arr.filter( (element, index, array) => { return array.indexOf(element) === index }) } // Test var arr = [1, 2, 2, 3] unique(arr); // [1, 2, 3] This is the end of this article about JavaScript array deduplication and flattening functions. For more relevant js array deduplication and flattening function content, please search 123WORDPRESS.COM's previous articles or continue to browse the following related articles. I hope everyone will support 123WORDPRESS.COM in the future! You may also be interested in:
|
<<: Docker installation and configuration steps for Redis image
>>: CSS HACK for IE6/IE7/IE8/IE9/FF (summary)
Table of contents Initialize MySQL Install MySQL ...
In my last post I talked about how to make a web p...
1. CSS background tag 1. Set the background color...
First, let me explain the version of MySQL: mysql...
MySQL database basic syntax DDL Operations Create...
Table of contents 1. Object properties 1.1 Attrib...
html4: Copy code The code is as follows: <form...
What is DOM? With JavaScript, you can reconstruct...
Table of contents 1. Installation Environment 2. ...
The method of wrapping the content (title attribut...
Table of contents Overview Same Origin Policy (SO...
Preface Usually when making h5 pages, you need to...
Project Purpose Migrate the data in MySQL 5.5.53 ...
need: In background management, there are often d...
This article shares the specific code for WeChat ...