{React.Children.toArray(someData.map(item => <div> hello</div>))} | someData.map(item=>(<div key={Math.random()}> hello </div>}) | manually assigning Keys on Children |
const simon ={ age:32}; delete simon.age | const {age, ...newSimon} = simon | deleting from an object as this mutates the original object, instead generate a new one |
const nums = [ null,2 ,4]; nums.filter(Boolean); | | This will remove all the nulls as null return false aka Falsey Bouncer |
JSON.stringify(someObject, null,2) | | this will add some spacing when printing the object |
const createUser = ({username, date}); createUser({username:'asd', date:'10-10-2000'} | createUser('Simon', '01-01-2001') | first one is more extendable and easier to read |
const unique = [... new Set(numbers)] | | easy way to dedup |
if (True) { debugger;} | | force browser to stop |
someFunction && someFunction(); | someFunction?.(); | conditional execution |
const isRequired = () =>{ throw Error('Arguement is required');} | const userName = (username = isRequired())=> {} | forces parameters, null is considered a valid value |
console.trace or console.table or console.log('%c test', 'color:red;'); | console.log | formatted logging |
class Foo {} export {Foo}; import {Foo} from './Foo' | export default Foo; | shy away from default export |
async function doSomething(){}; doSomethingAsync(); | (async function doSomething(){})(); | avoid anonymous invokation IIFE |
const element = document.getElementById('id'); element.scrollIntoView({behavior: "smmoth"}); | | scroll smoothly into view |
scripts: { "preinstall": "", "postinstall" : ""} | | this will run before running and post run so you dont need to execute commands manually |
Object.entries(someObj).forEach([key,value]) =>{ console.log(key,value)} | | iterate over both key and value |
let price =0; const defaultPrice = price_1 ?? 10; console.log(defaultPrice); //0 | let price =0; const defaultPrice = price_1; console.log(defaultPrice); //10 | 0 in JS is falsey but that might not be what we want in the behavior, using ?? (nullish coalescing will only return falsey if null or undefined) |
const fs = require("fs/promises"); await fs.writeFile; ... | const fs = require("fs") | import node fs promise rather than just fs, most modules has promisified versions ie: module/promises |
commonJS:require module.exports ES6: import export | | require vs import. import are more customizable when importing. import can by async. require is only sync |