Make learning JS basic methods as game tasks

When I begin to learn JavaScript, I often feeling tired with searching document. I spent a lot of time in looking for a simple function in standard lib. Till one day, I can't stand wasting time in this anymore. Why not remember all of them in my head, I thought.

But remember the functions in std lib is a boring job. To add some fun in doing that, I worte a simple script, that will generate a todo list, with js methods name and the link to that method's MDN document.

const FundamentalObjects = [
    Object,
    Function,
    Boolean,
    Symbol,
    Error
]

const NumbersAndDates = [
    Number,
    BigInt,
    Math,
    Date
]

const TextProcessing = [
    String,
    RegExp
]

const IndexedCollections = [
    Array,
    Int8Array,
    Uint8Array,
    Uint8ClampedArray,
    Int16Array,
    Uint16Array,
    Int32Array,
    Uint32Array,
    Float32Array,
    Float64Array,
    BigInt64Array,
    BigUint64Array
]

const KeyedCollections = [
    Map,
    Set,
    WeakMap,
    WeakSet
]

const StructuredData = [
    ArrayBuffer,
    SharedArrayBuffer,
    Atomics,
    DataView,
    JSON
]

const ControlAbstractionObjects = [
    Promise,
    // Generator,
    // GeneratorFunction,
    // AsyncFunction 
]

const Reflection = [
    Reflect,
    Proxy
]

const Internationalization = [
    Intl,
    Intl.Collator,
    Intl.DateTimeFormat,
    Intl.ListFormat,
    Intl.NumberFormat,
    Intl.PluralRules,
    Intl.RelativeTimeFormat,
    Intl.Locale
]

const WASM = [
    WebAssembly,
    WebAssembly.Module,
    WebAssembly.Instance,
    WebAssembly.Memory,
    WebAssembly.Table,
    WebAssembly.CompileError,
    WebAssembly.LinkError,
    WebAssembly.RuntimeError
]


const ObjectsToLearn =
    FundamentalObjects
    .concat(NumbersAndDates)
    .concat(TextProcessing)
    .concat(IndexedCollections)
    .concat(KeyedCollections)
    .concat(StructuredData)
    .concat(ControlAbstractionObjects)
    .concat(Internationalization)
    .concat(WASM)

const listMethodsOf = (object) => {
    try {
        return Object.getOwnPropertyNames(object.prototype)
            .filter(f => !['caller', 'callee', 'arguments'].includes(f))
            .filter(f => {
                try {
                    let bool = typeof(object['prototype'][f]) == 'function'
                    return bool
                } catch (e) {
                    return false
                }
            })
    } catch (e) {
        return []
    }
}


let r =
    ObjectsToLearn
    .filter(o => o.name)
    .map(o => '# ' + o.name + '\n' +
        listMethodsOf(o)
        .map(f => '- [ ] [' + f + '](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/' + o.name + '/' + f + ')')
        .join('\n')
    )
    .join('\n')

console.log(r)

Then copy the content in console, and paste in your gist, you just got a clickable todo list of all methods of main objects in JavaScript (Browser). You can visit the result here: https://gist.github.com/Ljzn/d93dae3de64660e66be598ee88fa57be .

Happy Coding!

2019.08.06 Update:

I changed the code into two functions: "listOfJSObjectsDoc" and "listOfWebAPIDoc".

const listMethodsOf = (object) => {
    try {
        return Object.getOwnPropertyNames(object.prototype)
            .filter(f => !['caller', 'callee', 'arguments'].includes(f))
            .filter(f => {
                try {
                    let bool = typeof(object['prototype'][f]) == 'function'
                    return true
                } catch (e) {
                    return false
                }
            })
    } catch (e) {
        return []
    }
}


const listOfWebAPIDoc = modules =>
    toDoc(modules, 'https://developer.mozilla.org/en-US/docs/Web/API/')

const listOfJSObjectDoc = modules =>
    toDoc(modules, 'https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/')

const toDoc = (modules, baseURL) =>
    modules
    .filter(o => o.name)
    .map(o => '# ' + o.name + '\n' +
        listMethodsOf(o)
        .map(f => `- [ ] [${f}](${baseURL}${o.name}/${f})`)
        .join('\n')
    )
    .join('\n')

Example:

let modules = [MediaStream, MediaStreamTrack]

console.log(listOfWebAPIDoc(modules))

You can try this in https://jsbin.com/dujeril/1/edit?js,console .

Happy Coding!