mixin()

mixin()

// 使い方
cchance.mixin(<Object>)

ミックスインはChanceを特定のアプリケーションに合わせて拡張するための非常に強力な手法です。

まず、ミックスインを使うことを考えているなら、 他のユーザーに対してもメリットになるかどうかを検討してみてください。 もし他のユーザーにもメリットがあるなら、ミックスインを使うのではなく、プルリクエストを送ってください！

あなたの素晴らしいジェネレータを皆と共有し、愛を広げましょう。:)

アプリケーション内でランダムなものを生成したいけれども、 広く利用することは出来ないない場合もあります。 そんな時はミックスインを使いましょう！

Chanceのミックスインは、後で1回だけ使うことができるメソッドを追加することができます。

例えば、ユーザーオブジェクトとして、苗字、名前、メールアドレスからなるオブジェクトがあるとします。

var user = {
  first: 'John',
  last: 'Smith',
  email: 'john@aol.com'
};

そして、これらのユーザーオブジェクトをランダムに生成したいとします。

このようなパターンは、アプリケーション特有のものであり、 広く利用するものではありません。 ミックスインに最適です！

ミックスインを作成するには、キーがメソッド名で、値が呼び出される関数であるオブジェクトを生成します。

各関数からchance自体にアクセスすることができます。

例えば、userミックスインを作る場合、

chance.mixin({
  'user': function() {
    return {
      first: chance.first(),
      last: chance.last(),
      email: chance.email()
    };
  }
});

// ミックスイン呼び出すことができます。
chance.user();

=> {first: 'Eli', last: 'Benson', email: 'gembibuj@dugesan.com'}

ミックスインは他のミックスインを含めることもできます。

例えば、userオブジェクトを拡張するには、

chance.mixin({
  'user': function () {
    return {
      first: chance.first(),
      last: chance.last(),
      email: chance.email()
    };
  },
  'social_user': function () {
    var user = chance.user();
    user.network = chance.pick(['facebook', 'twitter']);
    return user;
  }
});

ここでは、userミックスインを使った、social_userミックスインを追加しました。 これらのミックスインは、同時に宣言すると、任意の順序で定義することができます。

デモ

年齢、性別、イニシャルを取得するミックスインを定義しています。 ボタンを押すと、年齢、性別、イニシャルを表示します。

JavaScript

var button = document.getElementById('get-result');
button.addEventListener('click', function() {
  var chance = new Chance();
  // ミックスインを定義
  chance.mixin({
    'property': function() {
      // 属性(年齢、性別)を返す
      return {
        age: chance.age(),
        gender: chance.gender(),
      };
    },
    'user_name': function() {
      // 苗字、名前を返す
      return {
        first: chance.first(),
        last: chance.last(),
      }
    },
    'user': function() {
      var property = chance.property(),
          name     = chance.user_name();
          initial  = name.first.charAt(0) + '.' + name.last.charAt(0);
      return {
        age: property.age,
        gender: property.gender,
        initial: initial
      };
    }
  });
  // ミックスイン呼び出し
  var user   = chance.user();
  // 結果格納
  var result = document.getElementById('result'),
      ul, li;
  ul = document.createElement('ul');
  Object.keys(user).forEach(function(i) {
    li = document.createElement('li');
    li.textContent = user[i];
    ul.appendChild(li);
  });
  if (result.firstChild !== null) {
    result.removeChild(result.firstChild);
  }
  result.appendChild(ul);
}, false);

HTML

<script src="./moment.min.js"></script>
<button id="get-result">結果表示</button>
<div>
  <span>結果：</span>
  <span id="result"></span>
</div>