- Remove duplicate values
- Get the last item
- Toggle an element
- Check existence of an element
- Loop
- Deep copy
- Merge Arrays
Remove duplicate values
function uniq(a) {
return Array.from(new Set(a));
}
uniq = [...new Set(array)];
https://stackoverflow.com/a/9229821
Get the last item
// Method 1
array[array.length - 1];
// Method 2
arr.slice(-1)[0]
// Method 3
arr.pop() -> Last item removed from arr
// Method 4
[...arr].pop(); -> arr not changed
// Method 5
arr.slice(-1).pop() -> arr not changed
// Method 6
arr.reverse()[0]
https://stackoverflow.com/questions/3216013/get-the-last-item-in-an-array
https://stackoverflow.com/questions/9050345/selecting-last-element-in-javascript-array
Toggle an element
function toggleInArray(array, value) {
var index = array.indexOf(value);
if (index === -1) {
array.push(value);
} else {
array.splice(index, 1);
}
}
PS: only removes the first instance of the value
https://stackoverflow.com/questions/17153238/how-to-toggle-an-element-in-array-using-javascript
Check existence of an element
- Array.prototype.some()
tests whether at least one element in the array passes the test implemented by the provided function
Scenario: To check if an element contains at least one of the target classes
targetClassNames.some(className => el.classList.contains(className))
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/some
Loop
- For
var list= document.getElementsByClassName("events");
for (var i = 0; i < list.length; i++) {
console.log(list[i].id);
}
- For/of
The forβ¦of statement creates a loop Iterating over iterable objects (including Array, Map, Set, arguments object and so on),
var list = document.getElementsByClassName("events");
for (let item of list) {
console.log(item.id);
}
- Array.from() [ES6]
"use strict";
Array.from(document.getElementsByClassName("events")).forEach(function(item) {
console.log(item.id);
});
- For/in (Do not recommend)
The for…in statement iterates a specified variable over all the enumerable properties of an object.
Although it may be tempting to use this as a way to iterate over Array element, the for…in statement will return the name of your user-defined properties in addition to the numeric indexes.
https://stackoverflow.com/a/22754453
Deep copy
var newArr = oldArr.map(item => ({
attr1: item.attr[x],
attr2: item.attr[y]
}));
https://stackoverflow.com/a/36602215
let newArr = oldArr.slice() // this is how to make a copy
Merge Arrays
// 2 Ways to Merge Arrays
const cars = ['π', 'π'];
const trucks = ['π', 'π'];
// Method 1: Concat
const combined1 = [].concat(cars, trucks);
const combined2 = cars.concat(trucks);
// cars stays the same, so version 1 is better.
// Method 2: Spread
const combined3 = [...cars, ...trucks];
// Result
// [ 'π', 'π', 'π', 'π' ]
// Method 3: push
const combined4 = cars.push(...trucks);
// Pay attention:
const combined5 = cars.push(trucks);
// cars: [ 'π', 'π', [ 'π', 'π' ] ]
// For method 1 & 2, the original variables stay the same, while for method 3, the original variable is changed.
- Deference with Concat and Spread
Merge vars with no clear data type:
const isArray = [1, 2, 3];
const notArray = 'random';
Spread result:
[ 1, 2, 3, 'r', 'a', 'n', 'd', 'o', 'm' ]
Concat result:
[ 1, 2, 3, 'random' ] β
https://www.samanthaming.com/tidbits/49-2-ways-to-merge-arrays/