JSFiddle - React, Tailwind, and code Playground

by Alex

HTML

<pre></pre>

JavaScript

function log(...args) {
  document.querySelector('pre').innerText += args.join(', ') + "\n";
}

const obj = {}

const handler = {
  async get(target, name) {
    if (name in target) {
      return Promise.resolve(target[name]);
    } else {
      if (name.includes('/')) {
        return await fetch(name)
          .then(r => r.text())

      }
    }

    return `You asked for "${name}" in ${JSON.stringify(target)} but there is nothing.`
  }
}
const h2 = {
	async get(target, name){
  	const resp = await P[name];
  	return resp;
  
  }
}

const P = new Proxy(obj, handler);
const P2 = new Proxy(P, h2);

async function main() {
  log(await (P.property))
  log(P2.property)
  log(await P['https://api.github.com'])
  log( P2['https://api.github.com'])
  log(JSON.stringify(obj))
}

main();