gladchinda

Function with one-off initialization

Background

You have been asked to implement a new feature (with JavaScript) for an application that involves fetching some particular kind of data (on demand) from a third-party service — say GitHub profiles of some popular open source contributors. In no time, you were able to come up with a pretty straightforward implementation — a function named fetchGithubProfile with a signature like so: (username: string) => Promise<GithubProfile>.

Later on, you realized that it will be better if the application does not trigger new HTTP requests for profiles that have been fetched before, and so you decided to implement some form of caching — to keep things a bit simple, let's say you decided to use a JavaScript Map with a type like so: Map<string, GithubProfile>.

Initial Implementation

gladchinda

function multiConsumablePromiseFactory(getPromiseFn, skipWaitingFn) {
  let _this, _promise, _controller, _signal;

  function _reset() {
    _this = _promise = _controller = _signal = undefined;
  }

  function _skipWaiting() {
    if (_controller instanceof AbortController) {
      typeof skipWaitingFn === 'function' && skipWaitingFn.call(_this);

gladchinda

import { useState, useEffect, useRef, useCallback } from 'react';

const OBJECT_TYPE = '[object Object]';
const $type = Function.prototype.call.bind(Object.prototype.toString);
const $has = Function.prototype.call.bind(Object.prototype.hasOwnProperty);

export default function useObjectState(objectState) {
  const mounted = useRef(true);

  const [state, setState] = useState(() => {

gladchinda

/* eslint-disable */
import { createApp } from 'vue';
import { connect } from 'redux-vuex';

import App from './App.vue';

var onCheckoutReady = (function __once__(fn) {
  if (typeof fn === 'function') {
    let _invoked = false;

gladchinda

/* eslint-disable */
import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';

import App from './App';

var onCheckoutReady = (function __once__(fn) {
  if (typeof fn === 'function') {
    let _invoked = false;

gladchinda

function getValueFromPath(object, path) {
  const OBJECT_TYPE = '[object Object]';
  const $type = Function.prototype.call.bind(Object.prototype.toString);
  
  // Ensure that path is a string, default to an empty string if not provided.
  // Replace bracket notation occurrences on path with dot notation.
  // Split path (to array) using the `.` delimeter, discard empty elements.
  path = (path ? String(path) : String())
    .replace(/\[((?:['"])?)([^[\]]*)\1\]/g, function __replacer__($, $$, key) {
      return `.${Number(key) || String(key)}`;

gladchinda

// A generator function for generating the first n number(s)
// of the Fibonacci sequence.
// Yields numbers as BigInt.
function* fibonacci(n) {
  let i = 0;
  
  n = (Number.isInteger(n) && n > 0) ? n : Infinity;
  
  for (; i < 2 && i < n; i++) {
    yield 1n;

gladchinda

function createSalaryObject(amount, currency = "USD") {
  amount = Number(amount);
  currency = String(currency).trim().toUpperCase();
  currency = /^[A-Z]{3}$/.test(currency) ? currency : "USD";

  // The string equivalent for amount (with currency)
  const amountString = `${currency} ${amount}`;

  return {
    amount,

gladchinda

// A function that can take amount and currency as arguments
// and returns a salary object.
function createSalaryObject(amount, currency = "USD") {
  amount = Number(amount);
  currency = String(currency).trim().toUpperCase();
  currency = /^[A-Z]{3}$/.test(currency) ? currency : "USD";

  return {
    amount,
    currency,

gladchinda

import React from 'react';
import useTheme from './useTheme';
import ThemeContext from './theme';

export default function App() {
  const { theme, darkMode, inheritSystem } = useTheme();

  return <>
    {/* Render the color scheme controls widget here */}
    {/* Use `theme`, `darkMode` and `inheritSystem` as required */}