Vue バッチ更新 DOM 実装手順

<テンプレート>
  <div>
    <span>{{ a }}</span>
    <span>{{ b }}</span>
  </div>  
</テンプレート>
<script type="javascript">
エクスポートデフォルト{
  データ（） {
    戻る {
      : 0,
      0 です
    }
  },
  作成された() {
    // ロジックコード
    これ.a = 1
    これ.b = 2
  }
}
</スクリプト>

関数 Vue (オプション) {
  if (!(このインスタンス Vue)
  ）{
    warn('Vue はコンストラクターなので、`new` キーワードで呼び出す必要があります');
  }
  this._init(オプション);
}

Vue.prototype._init = 関数 (オプション) {
  var vm = this;
  // uid
  vm._uid = uid$3++;

  var 開始タグ、終了タグ;
  /* イスタンブールは無視します */
  if (config.performance && mark) {
    startTag = "vue-perf-start:" + (vm._uid);
    endTag = "vue-perf-end:" + (vm._uid);
    マーク(開始タグ);
  }

  // これを回避するためのフラグ
  vm._isVue = true;
  // マージオプション
  if (オプション && options._isComponent) {
    // 内部コンポーネントのインスタンス化を最適化
    // 動的オプションのマージは非常に遅く、
    // 内部コンポーネント オプションには特別な処理が必要です。
    initInternalComponent(vm、オプション);
  } それ以外 {
    vm.$options = mergeOptions(
      コンストラクタオプションを解決します(vm.constructor)、
      オプション || {},
      仮想
    );
  }
  /* イスタンブールは無視します。その他 */
  {
    プロキシサーバを初期化します。
  }
  // 本当の自分をさらけ出す
  vm._self を vm に追加します。
  ライフサイクルを初期化します(vm);
  イベントを初期化します(vm);
  initRender(vm);
  フックを呼び出します(vm、'beforeCreate')。
  initInjections(vm); // データ/プロパティの前にインジェクションを解決する
  初期化状態(vm);
  initProvide(vm); // data/props の後に provide を解決する
  callHook(vm, 'created');

  /* イスタンブールは無視します */
  if (config.performance && mark) {
    vm._name = formatComponentName(vm, false);
    マーク(endTag);
    measure(("vue " + (vm._name) + " init"), startTag, endTag);
  }

  （vm.$options.el）の場合{
    vm.$mount(vm.$options.el);
  }
}

関数 initState (vm) {
  vm._watchers = [];
  var opts = vm.$options;
  opts.props の場合、 initProps(vm, opts.props); }
  opts.methods の場合、 initMethods(vm, opts.methods); }
  if (opts.data) {
    initData(vm);
  } それ以外 {
    観察(vm._data = {}, true /* asRootData */);
  }
  opts.computed の場合、 initComputed(vm, opts.computed); }
  opts.watch の場合、opts.watch は nativeWatch と等しくなります。
    initWatch(vm, opts.watch);
  }
}

関数 initData (vm) {
  var data = vm.$options.data;
  data = vm._data = typeof data === 'function'
    ? getData(データ、vm)
    : データ || {};
  if (!isPlainObject(データ)) {
    データ = {};
    警告(
      'データ関数はオブジェクトを返す必要があります:\n' +
      'https://vuejs.org/v2/guide/components.html#data-Must-Be-a-Function',
      仮想
    );
  }
  // インスタンス上のプロキシデータ
  var keys = Object.keys(データ);
  var props = vm.$options.props;
  var メソッド = vm.$options.methods;
  var i = キーの長さ;
  (i--) {
    var キー = keys[i];
    {
      if (メソッド && hasOwn(メソッド、キー)) {
        警告(
          (「メソッド \"" + キー + "\" はすでにデータ プロパティとして定義されています。」)
          仮想
        );
      }
    }
    もしprops && hasOwn(props, key) であれば
      警告(
        「データ プロパティ \"" + キー + "\" はすでにプロパティとして宣言されています。」 +
        "代わりにプロパティのデフォルト値を使用してください。",
        仮想
      );
    } そうでなければ (!isReserved(key)) {
      プロキシ(vm、"_data"、キー);
    }
  }
  // データを観察する
  観察(データ、true /* asRootData */);
}

関数 getData (データ, vm) {
  // #7573 データゲッターを呼び出すときに依存関係コレクションを無効にする
  プッシュターゲット();
  試す {
    データを返します。call(vm, vm)
  } キャッチ (e) {
    handleError(e, vm, "データ()");
    戻る {}
  ついに
    ポップターゲット();
  }
}

関数 observe (値、asRootData) {
  if (!isObject(value) || value instanceof VNode) {
    戻る
  }
  var ob;
  if (hasOwn(value, '__ob__') && value.__ob__ instanceof Observer) {
    ob = 値.__ob__;
  } それ以外の場合 (
    観察すべき &&
    !isServerRendering() &&
    (Array.isArray(値) || isPlainObject(値)) &&
    Object.isExtensible(値) &&
    !値._isVue
  ）{
    ob = 新しいオブザーバー(値);
  }
  if (asRootData && ob) {
    ob.vmCount++;
  }
  戻り値
}

var Observer = 関数 Observer (値) {
  this.value = 値;
  this.dep = 新しい Dep();
  this.vmCount = 0;
  def(値、'__ob__'、これ);
  Array.isArray(値)の場合{
    (hasProto) の場合 {
      protoAugment(値、配列メソッド);
    } それ以外 {
      copyAugment(値、配列メソッド、配列キー);
    }
    this.observeArray(値);
  } それ以外 {
    this.walk(値);
  }
}

Observer.prototype.walk = 関数 walk (obj) {
  var キー = Object.keys(obj);
  (var i = 0; i < keys.length; i++) の場合 {
    Reactive$$1 を定義します(obj、キー[i])。
  }
}

関数defineReactive$$1 (
  オブジェクト、
  鍵、
  ヴァル、
  カスタムセッター、
  浅い
）{
  var dep = 新しい Dep();

  var プロパティ = Object.getOwnPropertyDescriptor(obj, key);
  if (プロパティ && property.configurable === false) {
    戻る
  }

  // 定義済みのゲッター/セッターに対応
  var getter = property && property.get;
  var setter = property && property.set;
  if ((!getter || setter) && arguments.length === 2) {
    val = obj[キー];
  }

  var childOb = !shallow && observe(val);
  Object.defineProperty(obj, キー, {
    列挙可能: true、
    設定可能: true、
    取得: 関数reactiveGetter() {
      var value = getter ? getter.call(obj): val;
      if (依存ターゲット) {
        依存関係
        if (childOb) {
          childOb.dep.depend();
          Array.isArray(値)の場合{
            依存配列(値);
          }
        }
      }
      戻り値
    },
    設定: 関数 reactiveSetter (newVal) {
      var value = getter ? getter.call(obj): val;
      /* eslint は自己比較を無効にします */
      if (newVal === 値 || (newVal !== newVal && 値 !== 値)) {
        戻る
      }
      /* eslint を有効にして自己比較をしない */
      if (カスタムセッター) {
        カスタムセッター();
      }
      // #7981: セッターのないアクセサープロパティの場合
      if (getter && !setter) { return }
      if (セッター) {
        setter.call(obj, newVal);
      } それ以外 {
        val = 新しいVal;
      }
      childOb = !shallow && observe(newVal);
      通知します。
    }
  });
}

<テンプレート>
  <div>
    <span>{{ a }}</span>
    <span>{{ b }}</span>
  </div>  
</テンプレート>
<script type="javascript">
エクスポートデフォルト{
  データ（） {
    戻る {
      : 0,
      0 です
    }
  },
  作成された() {
    // ロジックコード
    これ.a = 1
    これ.b = 2
  }
}
</スクリプト>

関数reactiveSetter(newVal){
  var value = getter ? getter.call(obj): val;
  /* eslint は自己比較を無効にします */
  if (newVal === 値 || (newVal !== newVal && 値 !== 値)) {
    戻る
  }
  /* eslint を有効にして自己比較をしない */
  if (カスタムセッター) {
    カスタムセッター();
  }
  // #7981: セッターのないアクセサープロパティの場合
  if (getter && !setter) { return }
  if (セッター) {
    setter.call(obj, newVal);
  } それ以外 {
    val = 新しいVal;
  }
  childOb = !shallow && observe(newVal);
  通知します。
}

関数reactiveGetter() {
  var value = getter ? getter.call(obj): val;
  if (依存ターゲット) {
    依存関係
    if (childOb) {
      childOb.dep.depend();
      Array.isArray(値)の場合{
        依存配列(値);
      }
    }
  }
  戻り値
}

依存関係ターゲット = null;
var ターゲットスタック = [];

関数pushTarget(ターゲット){
  ターゲットスタックをプッシュします。
  依存関係ターゲット = ターゲット;
}

関数popTarget() {
  ターゲットスタックをポップします。
  Dep.target = targetStack[targetStack.length - 1];
}

関数handleError(err, vm, info) {
  // 無限レンダリングを回避するために、エラー ハンドラーの処理中に依存関係の追跡を無効にします。
  // 参照: https://github.com/vuejs/vuex/issues/1505
  プッシュターゲット();
  試す {
    もし（VM）{
      var cur = vm;
      ((cur = cur.$parent)) の間 {
        var フック = cur.$options.errorCaptured;
        if (フック) {
          (var i = 0; i < hooks.length; i++) の場合 {
            試す {
              var capture = hooks[i].call(cur, err, vm, info) === false;
              if (キャプチャ) { 戻り値 }
            } キャッチ (e) {
              globalHandleError(e, cur, 'errorCaptured フック');
            }
          }
        }
      }
    }
    グローバル ハンドル エラー (err、vm、情報)。
  ついに
    ポップターゲット();
  }
}

関数callHook(vm, hook) {
  // #7573 ライフサイクルフックを呼び出すときに依存関係コレクションを無効にする
  プッシュターゲット();
  var ハンドラー = vm.$options[フック];
  var info = hook + "フック";
  if (ハンドラ) {
    (var i = 0, j = handlers.length; i < j; i++) の場合 {
      ハンドラを呼び出し、エラー処理を実行します。
    }
  }
  （vm._hasHookEvent）の場合{
    vm.$emit('hook:' + フック);
  }
  ポップターゲット();
}

Watcher.prototype.get = 関数 get() {
  pushTarget(これを);
  var 値;
  var vm = this.vm;
  試す {
    値 = this.getter.call(vm, vm);
  } キャッチ (e) {
    if (this.user) {
      handleError(e, vm, ("ウォッチャーのゲッター \"" + (this.expression) + "\""));
    } それ以外 {
      投げる
    }
  ついに
    // すべてのプロパティを「タッチ」して、すべて次のように追跡されるようにします。
    // ディープウォッチングの依存関係
    if (this.deep) {
      トラバース(値);
    }
    ポップターゲット();
    this.cleanupDeps();
  }
  戻り値
}

関数 getData (データ, vm) {
  // #7573 データゲッターを呼び出すときに依存関係コレクションを無効にする
  プッシュターゲット();
  試す {
    データを返します。call(vm, vm)
  } キャッチ (e) {
    handleError(e, vm, "データ()");
    戻る {}
  ついに
    ポップターゲット();
  }
}

Vue.prototype._init = 関数 (オプション) {
  var vm = this;
  // uid
  vm._uid = uid$3++;

  var 開始タグ、終了タグ;
  /* イスタンブールは無視します */
  if (config.performance && mark) {
    startTag = "vue-perf-start:" + (vm._uid);
    endTag = "vue-perf-end:" + (vm._uid);
    マーク(開始タグ);
  }

  // これを回避するためのフラグ
  vm._isVue = true;
  // マージオプション
  if (オプション && options._isComponent) {
    // 内部コンポーネントのインスタンス化を最適化
    // 動的オプションのマージは非常に遅く、
    // 内部コンポーネント オプションには特別な処理が必要です。
    initInternalComponent(vm、オプション);
  } それ以外 {
    vm.$options = mergeOptions(
      コンストラクタオプションを解決します(vm.constructor)、
      オプション || {},
      仮想
    );
  }
  /* イスタンブールは無視します。その他 */
  {
    プロキシサーバを初期化します。
  }
  // 本当の自分をさらけ出す
  vm._self を vm に追加します。
  ライフサイクルを初期化します(vm);
  イベントを初期化します(vm);
  initRender(vm);
  フックを呼び出します(vm、'beforeCreate')。
  initInjections(vm); // データ/プロパティの前にインジェクションを解決する
  初期化状態(vm);
  initProvide(vm); // data/props の後に provide を解決する
  callHook(vm, 'created');

  /* イスタンブールは無視します */
  if (config.performance && mark) {
    vm._name = formatComponentName(vm, false);
    マーク(endTag);
    measure(("vue " + (vm._name) + " init"), startTag, endTag);
  }

  （vm.$options.el）の場合{
    vm.$mount(vm.$options.el);
  }
}

Vue.prototype.$mount = 関数 (
  エル、
  水分補給
）{
  el = el && inBrowser ? query(el) : 未定義;
  mountComponent(this, el, hydrating) を返します
}

関数 mountComponent (
  vm、
  エル、
  水分補給
）{
  vm.$el = el;
  （！vm.$options.render）の場合{
    vm.$options.render = createEmptyVNode;
    {
      /* イスタンブールは無視します */
      ((vm.$options.template && vm.$options.template.charAt(0) !== '#') の場合 ||
        vm.$options.el || el) {
        警告(
          'テンプレートが' + であるVueのランタイムのみのビルドを使用しています。
          'コンパイラが利用できません。テンプレートを ' + に事前コンパイルするか、
          '関数をレンダリングするか、コンパイラに含まれるビルドを使用してください。',
          仮想
        );
      } それ以外 {
        警告(
          「コンポーネントのマウントに失敗しました: テンプレートまたはレンダリング関数が定義されていません。」
          仮想
        );
      }
    }
  }
  callHook(vm, 'beforeMount');

  var コンポーネントを更新します。
  /* イスタンブールは無視します */
  if (config.performance && mark) {
    更新コンポーネント = 関数 () {
      var name = vm._name;
      var id = vm._uid;
      var startTag = "vue-perf-start:" + id;
      var endTag = "vue-perf-end:" + id;

      マーク(開始タグ);
      var vnode = vm._render();
      マーク(endTag);
      measure(("vue " + name + " render"), startTag, endTag);

      マーク(開始タグ);
      vm._update(vnode、ハイドレーション);
      マーク(endTag);
      measure(("vue " + name + " patch"), startTag, endTag);
    };
  } それ以外 {
    updateComponent = 関数（）{
      vm._update(vm._render(), ハイドレーション);
    };
  }

  // ウォッチャーのコンストラクタ内でこれを vm._watcher に設定します
  // ウォッチャーの初期パッチは$forceUpdateを呼び出す可能性があるので（例えば、子プロセス内で）、
  // コンポーネントのマウントされたフック)、これはvm._watcherが既に定義されていることに依存します
  新しいウォッチャー(vm、updateComponent、noop、{
    before: 関数before() {
      (vm._isMounted && !vm._isDestroyed) の場合 {
        callHook(vm, 'beforeUpdate');
      }
    }
  }, true /* isRenderWatcher */);
  水分補給 = false;

  // 手動でマウントされたインスタンス、自身にマウントされた呼び出し
  // マウントは、挿入されたフック内のレンダリングによって作成された子コンポーネントに対して呼び出されます
  (vm.$vnode == null)の場合{
    vm._isMounted = true;
    callHook(vm, 'マウント済み');
  }
  戻り値
}

関数reactiveGetter() {
  var value = getter ? getter.call(obj): val;
  if (依存ターゲット) {
    依存関係
    if (childOb) {
      childOb.dep.depend();
      Array.isArray(値)の場合{
        依存配列(値);
      }
    }
  }
  戻り値
}

Dep.prototype.depend = 関数depend() {
  if (依存ターゲット) {
    Dep.target.addDep(this);
  }
}

Watcher.prototype.addDep = 関数 addDep (dep) {
  var id = dep.id;
  if (!this.newDepIds.has(id)) {
    this.newDepIds.add(id);
    this.newDeps.push(dep);
    if (!this.depIds.has(id)) {
      dep.addSub(これを);
    }
  }
}

Dep.prototype.addSub = 関数 addSub (sub) {
  this.subs.push(sub);
}

<テンプレート>
  <div>
    <span>{{ a }}</span>
    <span>{{ b }}</span>
  </div>  
</テンプレート>
<script type="javascript">
エクスポートデフォルト{
 データ（） {
    戻る {
      : 0,
      0 です
    }
  },
  作成された() {
    // ロジックコード
    これ.a = 1
    これ.b = 2
  }
}
</スクリプト>

関数reactiveSetter(newVal){
  var value = getter ? getter.call(obj): val;
  /* eslint は自己比較を無効にします */
  if (newVal === 値 || (newVal !== newVal && 値 !== 値)) {
    戻る
  }
  /* eslint を有効にして自己比較をしない */
  if (カスタムセッター) {
    カスタムセッター();
  }
  // #7981: セッターのないアクセサープロパティの場合
  if (getter && !setter) { return }
  if (セッター) {
    setter.call(obj, newVal);
  } それ以外 {
    val = 新しいVal;
  }
  childOb = !shallow && observe(newVal);
  通知します。
}

Dep.prototype.notify = 関数notify() {
  // まず購読者リストを安定させる
  var subs = this.subs.slice();
  （！config.async）の場合{
    // 非同期で実行されていない場合、サブはスケジューラでソートされません
    // 正しく実行されるように並べ替える必要があります
    // 注文
    subs.sort(function (a, b) { return a.id - b.id; });
  }
  (var i = 0, l = subs.length; i < l; i++) の場合 {
    subs[i].update();
  }
}

Watcher.prototype.update = 関数 update() {
  /* イスタンブールは無視します。その他 */
  if (this.lazy) {
    this.dirty = true;
  } それ以外の場合は (this.sync) {
    これを実行してください。
  } それ以外 {
    キューウォッチャー(これ);
  }
}

関数 queueWatcher (ウォッチャー) {
  var id = ウォッチャーid;
  （has[id] == null）の場合{
    [id] が true である。
    if (!フラッシュ) {
      キューにプッシュします(ウォッチャー)。
    } それ以外 {
      // すでにフラッシュしている場合は、IDに基づいてウォッチャーをスプライスします
      // すでに ID を過ぎている場合は、すぐに次に実行されます。
      var i = キューの長さ - 1;
      i > インデックス && queue[i].id > watcher.id の間 {
        私 - ;
      }
      キュー.splice(i + 1, 0, ウォッチャー);
    }
    // フラッシュをキューに入れる
    if (!待機中) {
      待機 = true;

      （！config.async）の場合{
        スケジューラキューをフラッシュします。
        戻る
      }
      nextTick(スケジューラキューをフラッシュ);
    }
  }
}

関数 nextTick (cb, ctx) {
  var _resolve;
  コールバック.push(関数() {
    もし（cb）{
      試す {
        cb.call(ctx);
      } キャッチ (e) {
        handleError(e, ctx, 'nextTick');
      }
    } それ以外の場合 (_resolve) {
      _resolve(ctx);
    }
  });
  （！保留中）の場合{
    保留中 = true;
    タイマー関数();
  }
  // $flow-disable-line
  if (!cb && typeof Promise !== 'undefined') {
    新しいPromise(function(resolve){を返す
      _resolve = 解決する;
    })
  }
}

var タイマー関数;

// nextTick動作はマイクロタスクキューを活用し、
// ネイティブの Promise.then または MutationObserver のいずれかを介して。
// MutationObserverはより幅広いサポートを提供していますが、深刻なバグがあります
// iOS 9.3.3以上のUIWebViewではタッチイベントハンドラでトリガーされます。
// 数回トリガーすると完全に動作しなくなります...つまり、ネイティブの場合
// Promise が利用可能なので、それを使用します:
/* istanbul 次を無視、$flow-disable-line */
if (typeof Promise !== 'undefined' && isNative(Promise)) {
  var p = Promise.resolve();
  timerFunc = 関数 () {
    p.then(コールバックをフラッシュします);
    // 問題のあるUIWebViewでは、Promise.thenは完全には機能しませんが、
    // コールバックがプッシュされる奇妙な状態でスタックする可能性があります
    // マイクロタスクキューですが、ブラウザが
    // タイマーの処理など、他の作業も行う必要があります。そのため、
    // 空のタイマーを追加して、マイクロタスク キューを強制的にフラッシュします。
    if (isIOS) { setTimeout(noop); }
  };
  マイクロタスクを使用しているかどうか = true;
} そうでない場合、(!isIE && typeof MutationObserver !== 'undefined' && (
  MutationObserver がネイティブかどうかを確認します。
  // PhantomJS と iOS 7.x
  MutationObserver.toString() === '[オブジェクト MutationObserverConstructor]'
)) {
  // ネイティブのPromiseが利用できない場合はMutationObserverを使用します。
  // 例: PhantomJS、iOS7、Android 4.4
  // (#6466 MutationObserver は IE11 では信頼できません)
  var カウンタ = 1;
  var オブザーバー = 新しい MutationObserver(flushCallbacks);
  var textNode = document.createTextNode(String(counter));
  オブザーバー.observe(textNode, {
    文字データ: true
  });
  timerFunc = 関数 () {
    カウンター = (カウンター + 1) % 2;
    textNode.data = String(カウンター);
  };
  マイクロタスクを使用しているかどうか = true;
} そうでない場合 (typeof setImmediate !== 'undefined' && isNative(setImmediate)) {
  // setImmediate にフォールバックします。
  // 技術的には（マクロ）タスクキューを活用します。
  // ただし、setTimeout よりも優れた選択肢です。
  timerFunc = 関数 () {
    即時設定(コールバックをフラッシュ)。
  };
} それ以外 {
  // setTimeout にフォールバックします。
  timerFunc = 関数 () {
    タイムアウトを設定します(コールバックをフラッシュします、0);
  };
}

関数flushSchedulerQueue() {
  現在のフラッシュタイムスタンプ = getNow();
  フラッシュ = true;
  var ウォッチャー、id;

  // フラッシュ前にキューをソートします。
  // これにより次のことが保証されます:
  // 1. コンポーネントは親から子へと更新されます。(親は常に
  // 子より先に作成される)
  // 2. コンポーネントのユーザーウォッチャーは、レンダリングウォッチャーの前に実行されます（
  // ユーザーウォッチャーはレンダリングウォッチャーの前に作成されます)
  // 3. 親コンポーネントのウォッチャー実行中にコンポーネントが破棄された場合、
  // ウォッチャーはスキップできます。
  キューのソート(関数(a, b) { return a.id - b.id; });

  // より多くのウォッチャーがプッシュされる可能性があるため、長さをキャッシュしない
  // 既存のウォッチャーを実行すると
  (インデックス = 0; インデックス < キューの長さ; インデックス++) {
    ウォッチャー = キュー[インデックス];
    if (watcher.before) {
      ウォッチャーの前に();
    }
    id = ウォッチャーid;
    has[id] = null;
    ウォッチャーを実行します。
    // 開発ビルドでは、循環更新をチェックして停止します。
    （has[id] != null）の場合{
      円形[id] = (円形[id] || 0) + 1;
      （円形[id] > MAX_UPDATE_COUNT）の場合{
        警告(
          '無限更新ループが発生している可能性があります' + (
            ウォッチャーユーザー
              ? ("ウォッチャー内の式 \"" + (watcher.expression) + "\"")
              : 「コンポーネント レンダリング関数内」
          ）、
          ウォッチャー.vm
        );
        壊す
      }
    }
  }

  // 状態をリセットする前に投稿キューのコピーを保持します
  var activatedQueue = activatedChildren.slice();
  var updatedQueue = queue.slice();

  スケジューラ状態をリセットします。

  // コンポーネントの更新とアクティブ化のフックを呼び出す
  アクティブ化されたキューを呼び出します。
  更新されたキューを呼び出します。

  // 開発ツールフック
  /* イスタンブールは無視します */
  devtools の場合:
    devtools.emit('フラッシュ');
  }
}

Watcher.prototype.run = 関数run() {
  アクティブの場合
    var 値 = this.get();
    もし （
      値 !== this.value ||
      // ディープウォッチャーとオブジェクト/配列のウォッチャーは、
      // 値が同じ場合、値は
      // 変異しました。
      isObject(値) ||
      これ.深い
    ）{
      // 新しい値を設定
      var oldValue = this.value;
      this.value = 値;
      if (this.user) {
        試す {
          this.cb.call(this.vm、値、古い値);
        } キャッチ (e) {
          handleError(e, this.vm, ("ウォッチャーのコールバック \"" + (this.expression) + "\""));
        }
      } それ以外 {
        this.cb.call(this.vm、値、古い値);
      }
    }
  }
}

<テンプレート>
  <div>
    <span>{{ a }}</span>
    <span>{{ b }}}
  </div>  
</テンプレート>
<script type="javascript">
エクスポートデフォルト{
  データ（） {
    戻る {
      : 0,
      0 です
    }
  },
  作成された() {
    // ロジックコード
    これ.a = 1
    これ.b = 2
  }
}
</スクリプト>