Post

Javascript Array tips and tricks

Handy JavaScript array tips and tricks including removing duplicates, replacing values, mapping, filtering, and more.

Javascript Array tips and tricks

1. Remove duplicates value from an array

1
2
3
4
5
6
7
8
9
10
const languages = ['java', 'php', 'ruby', 'python', 'php', 'python'];
console.log(languages);

// First method
const uniqueLangs = Array.from(new Set(languages));
console.log(uniqueLangs);

// Second method
const uniqueLangs2 = [...new Set(languages)];
console.log(uniqueLangs2);

👉 Demo 1

2. Replace the specific value in an array

Using: Array.splice(index, howmany, item1, ..., itemX)

1
2
3
4
5
const languages = ['java', 'php', 'ruby', 'python', 'php', 'python'];
console.log(languages);

languages.splice(0, 2, 'go', 'js', 'perl');
console.log(languages); // return ["go", "js", "perl", "ruby", "python", "php", "python"]

👉 Demo 2

3. Create a new array with the sub-array elements concatenated into it

Using: flat() & flat(depth) (Refer)

1
2
3
4
5
6
7
8
9
10
// Ex1:
const arr1 = [0, 1, 2, [3, 4]];
console.log(arr1.flat());
console.log(arr1.reduce((acc, val) => acc.concat(val), [])); // equivalent to flat
console.log([].concat.apply([], arr1)); // equivalent to flat
// Expected output: [0, 1, 2, 3, 4]

// Ex2:
const arr2 = [0, 1, 2, [[[3, 4]]]];
console.log(arr2.flat(2)); // Expected output: [0, 1, 2, [3, 4]]

👉 Demo 3

4. Find max/min value in an array

1
2
3
4
5
6
7
8
9
10
11
12
13
let numbers = [50, 300, 400, 1500];

let min = Math.min(...numbers);
console.log(min); // 80
 // Or
min = Math.min.apply(null, numbers);
console.log(min); // 80

let max = Math.max(...numbers);
console.log(max); // 80
// Or
max = Math.max.apply(null, numbers);
console.log(max); // 80

👉 Demo 4

5. Filling an array with values

1
2
3
4
5
6
7
8
9
10
11
let values = Array.from({length: 3}); // Creating an Array with undefined
console.log(values); // [undefined, undefined, undefined]

values = Array.from({length: 3}, () => 0); // Creating an Array with small integers
console.log(values); // [ 0, 0, 0 ]

values = Array.from({length: 3}, () => ({})); // Creating an Array with unique (unshared) objects
console.log(values); // [ {}, {}, {} ]

values = Array.from({length: 3}, (x, i) => i); // Creating an Array with ascending integers
console.log(values); // [ 0, 1, 2 ]

👉 Demo 5

Updating

This post is licensed under CC BY 4.0 by the author.