파이프 인터페이스 정의 - ChoDragon9/posts GitHub Wiki

Spec

• 속성을 정의할 수 있는 오퍼레이터를 제공한다.

import {immutable, merge} from './helper'

export const spec = (...attrs) => immutable({spec: merge(...attrs)})
export const on = (eventName, listener) => immutable({[eventName]: listener})
export const className = className => immutable({className})

Exporter

• 데이터 타입으로 변환해주는 오퍼레이터를 제공한다.

export const json = state => JSON.parse(JSON.stringify(state))

Hypertext

• 객체 생성 오퍼레이터를 제공한다.

import {immutable, merge} from './helper'

export const children = (...children) => immutable({children: [...children]})
export const div = (...props) => merge({nodeName: 'div'}, ...props)
export const p = (...props) => merge({nodeName: 'p'}, ...props)
export const text = value => immutable({nodeName: 'text', value})

Helper

• 헬퍼 함수들을 정의한다.

export const immutable = obj => Object.freeze(obj)
export const merge = (...objs) => Object.assign({}, ...objs)

사용예제

import {spec, on, className} from './spec'
import {children, div, p, text} from './hypertext'
import {json} from './exporter'

const attr = spec(
  on('click', () => {}),
  className('table table-border')
)
const child = children(
  div(),
  p(),
  text('Hello world')
)
const tag = div(attr, child)
const data = json(tag)