JSFiddle - React, Tailwind, and code Playground

by tlgreg

JavaScript

const $data = Symbol()

class FluidContainer {
 	constructor() {
  	this[$data] = new Map()

  	return new Proxy(this, {
    	get(target, prop, receiver) {
      	if (prop in target) return target[prop]
      	return (...args) => {
        	if (!args.length) return target[$data].get(prop)
          const value = args.length === 1 ? args[0] : args
          target[$data].set(prop, value)
          return receiver
        }
      },
      has(target, prop) {
      	return prop in target || target[$data].has(prop)
      },
      ownKeys(target) {
        return Array.from(target[$data].keys())
      },
      getOwnPropertyDescriptor() {
      	return {
        	enumerable: true,
          configurable: true,
        }
      },
    })
  }
  
  *[Symbol.iterator]() {
  	for (const item of this[$data]) {
    	yield item
    }
  }
}

const a = new FluidContainer()

a.foo('FOO')
	.bar('BAR')
  .baz('BAZ')

for (let item of a) {
	console.log(item)
}