今日したこと

某所のフロントでyamlを使ってとあるオブジェクトを構築したりしているのですが、ちょっと高度なyamlの機能を使いたくなった。　

まだやったことがなかったyamlの機能をjsで使ったら想像以上に使えて感動したので今日はその知見でも。

yamlのアンカー

yamlは参照が使えますね。この点でyamlは木構造以外のデータ構造をシンプルに表現できるので強いです。

sample.yaml

pan:
  &item1
  name: item1
  price: 100
pon:
  *item1
pen:
  *item1

こんな感じでアンカーをつけて参照すると pen,pon,penそれぞれが同じnameとpriceを参照するようになります。

jsonとかだとこれができなくて色々と辛いことがあるけどyamlはできる！！　すごい！！

javascriptでyaml

www.npmjs.com

これを使うことでyamlからパース＆yamlにシリアライズが可能です。 Loadがパース,Dumpがシリアライズです。　

yaml = require('js-yaml')
fs = require('fs')

try {
    var doc = yaml.safeLoad(fs.readFileSync('sample.yaml'))
    console.log(doc)

    doc.pon.price = 200
    console.log(doc)

    var dump = yaml.safeDump(doc)
    console.log(dump)
} catch(e) {
    console.log(e)
}

前述のyamlをパースして参照先のpriceを更新、オブジェクトをシリアライズします。

実行する

{ pan: { name: 'item1', price: 100 },
  pon: { name: 'item1', price: 100 },
  pen: { name: 'item1', price: 100 } }

{ pan: { name: 'item1', price: 200 },
  pon: { name: 'item1', price: 200 },
  pen: { name: 'item1', price: 200 } }

pan: &ref_0
  name: item1
  price: 200
pon: *ref_0
pen: *ref_0

参照になってるからpriceが全部同じところ参照してて更新すると全部変わる！シリアライズもちゃんと参照を維持してくれる。

公式のデモ

nodeca.github.io

どんなことできるか一覧のデモです。　yamlの機能（知ってる限りは）全部使える感じ。　ファンクションとかも行ける　すごい。

in webpack

github.com

この辺を使うのがいいでしょう。

ただ　yamlfile => yaml-loader => json-loader というつながりで読み込むやつなのでyamlがJSON相当のものしか扱えないのが残念です。webpackでyamlの高機能使いたいときはtextで入れて置いて実行時パースかな?

javascript object marshal?

yaml強いのでそこそこに使えそう。　ただJSON.stringifyのが速いわけだからパフォーマンス的には当然難しい。　頻度が低いなら問題なくいい感じに使えるかも。

ぬまのどろ

namazuのゆるい日記。　ゆるり更新。

javascriptとYAML