JavaScript & TypeScript Flashcards
add an array to an existing array in JS
«array1».push(…«array2»)
deep copy a string to another const in JS
const «variable name» = (‘ ‘ + «string»).slice(1)
what are the primitive types in TS?
» undefined » null » any » boolean » number » string
declare a variable’s type in TS
«variable»: «type»
what are the complex types in TS?
» void » never » Array » object » enum » tuple
declare an enum in TS
enum Color {
Red _= 1,
Green _= 2,
Blue _= 4
}
let c: Color = Color.Green
console.log( Color[2] )
» numbering starts at 0 as a default, set first number to change
declare an array in TS
let fruits: string[] = [‘apple’, ‘orange’, ‘banana’]
let fruits: Array = [‘apple’, ‘orange’, ‘banana’]
declare a tuple in TS
let coordinates: [number, number]
when to declare type void in TS?
function warnUser(): void {
console.log('This is my warning message');
}
» for functions that don’t return a value
when to declare type never in TS?
function error(message: string): never {
throw new Error(message);
}
» for functions that always throw errors
------------------------
function infiniteLoop(): never {
while (true) {}
}
» for functions that never return
cast variable as type in TS
«variable» as «type»
» only AS syntax is valid in JSX
what is an interface in TS?
» a name for a data structure
declare an interface in TS
interface «object interface name» {
«prop1»: «type»
«prop2»?: «type» » optional
readonly «prop3»: «type» » readonly
}
» readonly value is set only in assignment
declare a function interface in TS
interface «function name» {
(«param1»: «type», «param2»: «type»): «return type»
}
» parameter names do not need to match the implementation names
declare an indexable object interface in TS
interface «object name» {
_readonly [«index name»: number | string]: «index value type»
«_another prop1»: «property type»
}
» property type must be subset of index value type
» readonly value is only set in assignment
interpolate string in JS
I am ${«age»} years old
parse JSON string in JS
JSON.parse(«string»)
transform JSON object to string in JS
JSON.stringify(«json»)
difference between normal functions and arrow functions in JS
» arrow functions don’t bind their «this» value
get first array element that matches a condition in JS
«array».find(«condition»)
» stops on finding the first matching element
execute function with a delay in JS
setTimeout(«callback», «milliseconds»)
set object property using object property shorthand in JS
const name = 'Edvard' const years = '32'
const user = {
name
age: years
}
destructure JS object property
const { «property» } = «object»
destructure and name JS object property
const { «property»: «new name» } = «object»
destructure JS object property and set default value
const { «property» = «default value» } = «object»
destructure function parameter(s) from a JS object
function «name»({ «param1», «_param2» }) {
...
}extract keys of object into an array in JS
Object.keys(«object»)
check if an array contains a specific element in JS
«array».includes(«element»)
check if a string contains a specific substring in JS
«string».includes(«substring»)
check if every array element passes a specific test in JS
«array».every((«element») => «test result»)
replace part of string in JS
«string».replace(«to replace», «replacement»)
» replaces only first match
remove property from object in JS
delete «object».«property»
manipulate JSON.stringify() output of object in JS
«object».toJSON(() => {
const value = this
...
return «return value»
})convert string to number in JS
parseInt(«string»)
parseFloat(«string»)
naming convention for DOM elements in JS
$«name»
» $button = document.querySelector(‘button’)
disable DOM element in JS
«element».setAttribute(‘disabled’, ‘disabled’)
enable DOM element in JS
«element».removeAttribute(‘disabled’)
focus DOM element in JS
«element».focus()
remove leading an tailing whitspaces and newlines from string in JS
«string».trim()
remove element from array by its index in JS
«array».splice(«index», «count»)
» returns array of removed objects
get array index of element that complies a criteria in JS
«array».findIndex(«check function»)
combine array elements in JS
«array».reduce((accumulator, currentValue) => {
…
return «value»
})
» accumulator initiates as first array element
» currentValue initiates as second array element
check if one or more array elements comply a criteria in JS
«array».some(«check function»)
» returns true or false
destructure array value(s) to variables in JS
const [«var0», «_var1»] = «array»
get array index of specific element in JS
«array».indexOf(«element»)
ignore specific TS error
//@ts-ignore «line of code with error»
round number in JS
Math.round(«number»)
format date to German date string in JS
«date».toLocaleDateString(‘de-DE’)
