Here is a list of array operations that you can review, such as blitz. From now on, we'll be working with these arrays.
const numbers: number[] = [0, 1, 2];
const alphabet: string[] = ['a', 'b', 'c'];
Indexing
numbers.indexOf(2) // 2
numbers.indexOf(10) // -1
numbers[5] // undefined
numbers[-1] // undefined
numbers[Infinity] // undefined
numbers['1'] // 1
Bonus tips (negative index)
numbers.at(-1); // 2, (builtin at method)
const coolNumbers = new Proxy(numbers, {
get(target, props) {
const index: number = +(<string>props)
if (index < 0)
return Reflect.get(target, index + target.length)
return Reflect.get(target, props)
},
})
coolNumbers[-1] // 2
Adding (appending) items
/* IMMUTABILITY */
numbers.concat([3, 4]) // [ 0, 1, 2, 3, 4 ]
numbers // [ 0, 1, 2]
/* INPLACE CHANGES */
numbers.push(3) // numbers -> [0, 1, 2, 3]
numbers.unshift(-2) // numbers -> [-2, 0, 1, 2, 3]
numbers.splice(1, 0, -1) // numbers -> [-2, -1, 0, 1, 2, 3]
numbers.splice(0,0, ...[-6, -4, -3])
numbers // [-6, -4, -3, -2, -1, 0, 1, 2, 3]
Replacing item
numbers.splice(0, 1, -5) // numbers -> [-5, -4, -3, -2, -1, 0, 1, 2, 3]
numbers.splice(500, 100, 4) // numbers -> [-5, -4, -3, -2, -1, 0, 1, 2, 3, 5]
numbers[9] = 4 // numbers -> [-5, -4, -3, -2, -1, 0, 1, 2, 3, 4]
numbers [-5, -4, -3, -2, -1, 0, 1, 2, 3, 4]
Creating array
new Array(5) // [ <5 empty items> ]
Array.from({ length: 5 }) // [ undefined, undefined, undefined, undefined, undefined ]
Array.from('12345', _ => undefined) // [ undefined, undefined, undefined, undefined, undefined ]
Array.from(document.querySelectorAll('img'), img => img.src)
Array.of(1, 2, 3, 4, 5) // [ 1, 2, 3, 4, 5 ]
Array(5) // [ <5 empty items> ]
Array.from({ length: 5 }, (_, i) => i) // [ 0, 1, 2, 3, 4 ]
Bonus tips (manipulating array length)
alphabet.length = 5
alphabet // [ 'a', 'b', 'c', <2 empty items> ] length is 5
alphabet[7] = 'e'
alphabet // [ 'a', 'b', 'c', <4 empty items>, 'e' ] length is 8
alphabet.length = 3
alphabet // [ 'a', 'b', 'c' ] length is 3
Iteration
alphabet.entries() // Iterator over [[0,'a'], [1, 'b'], [2, 'c']]
for (const [index, element] of alphabet.entries()) {}
alphabet.keys() // Iterator over [0, 1, 2]
for (const index in alphabet) {}
alphabet.values() // Iterator over [ 'a', 'b', 'c' ]
for (const value of alphabet) {}
Inclusion
alphabet.includes('c') // true
alphabet.includes('c', 1) // true, from index 1
alphabet.includes('c', -2) // true, from index (length - 2)
alphabet.find(item => item.charCodeAt(0) > 'b'.charCodeAt(0)) // c
alphabet.findIndex(item => item.charCodeAt(0) > 'b'.charCodeAt(0)) // 2
alphabet.lastIndexOf('c') // 2
alphabet.indexOf('c') // 2
alphabet.indexOf('d') // -1
Operators
alphabet.every(item => item.charCodeAt(0) < 'c'.charCodeAt(0)) // false
alphabet.some(item => item.charCodeAt(0) < 'c'.charCodeAt(0)) // true
// **flat** ES2019
const nested = [0, [1], [[2]], [[[3]]], [[[[4], 3], 2], 1]]
nested.flat() // [ 0, 1, [ 2 ], [ [ 3 ] ], [ [ [4], 3 ], 2 ], 1 ], default level 1
nested.flat(3) // [0, 1, 2, 3, [ 4 ], 3, 2, 1]
nested.flat(Infinity) // [0, 1, 2, 3, 4 , 3, 2, 1]
// **joining**
alphabet.join(',') // a,b,c
// @ts-ignore
alphabet.join`,` // a,b,c
alphabet.toString() // a,b,c
// **reducing**
alphabet.reduce((acc, chr) => acc + ', ' + chr, '') // , a, b, c
alphabet.reduceRight((acc, chr) => acc + ', ' + chr, '') // , c, b, a
alphabet.reverse() // alphabet -> [ 'c', 'b', 'a' ]
alphabet // [ 'c', 'b', 'a' ]
// **sorting**
alphabet.sort() // shuffle alphabet, e.g. alphabet -> [ 'b', 'a', 'c' ]
alphabet.sort(() => Math.random() - 0.5) // alphabet -> [ 'a', 'b', 'c' ]
alphabet // [ 'a', 'b', 'c' ]
// **subset**
alphabet.slice(1) // ['b', 'c']
alphabet.slice(0, 2) // [ 'a', 'b' ]
Bonus tips
For mapping over an array it must have value, it can be undefined or null or any thing, but it can not be empty .
/* cool python range */
const range = (start: number, stop?: number, step?: number) => {
if (step === undefined) step = 1
if (stop === undefined) {
stop = start
start = 0
}
return Array.from(
{ length: (stop - start) / step + 1 },
(_, i) => start + i * step!,
)
}
for (let i in range(10)) console.log(i)
Top comments (0)