worldModelのデータと便利な関数Modelの関数は37種類changeで変化した値を取得Collectionを使用するCollectionの関数は100種類以上Viewの使い方Routerの使い方Backbone.jsとは昔よく使用されていたJavaScriptライブラリ。現在はReactやVue.jsが主流なので使用されることはほとんどない。Backbone.jsをVue.jsに書き換える機会があったので復習を兼ねて記事にしてみた。Backbone.jsを使うにはVue.jsを使うにはVue.jsのJSファイルを読み込むだけで良いが、Backbone.jsを使うにはBackbone.jsのJSファイルだけでなくjQueryとUnderscore.jsを読み込む必要がある。jQueryとUnderscore.jsなしでも動作させることはできるが、Backbone.jsの仕様上、この2つを読み込んで使用するのが一般的Backbone.jsはHTMLファイル内にJSファイルをCDNで読み込む記述を以下のように書けば簡単に使用できる。src="https://backbonejs.org/backbone.js"></script>Backbone.jsを使用して読み込んだJSONを表示するサンプルBackbone.jsの機能Backbone.jsには主に以下の5つの機能がある。これらの機能を使用しないのであれば使用しても意味がない。worldを実装したい場合はModelでメソッド実行時に表示する場合は以下のようにする。Model()model.hello()クリックイベントを利用する場合はViewを使う。View()Modelのデータと便利な関数Modelは1つのデータを管理する。Modelを作るにはBackbone.Model.extendを使う。defaultsで初期値を入れられる。}})Modelのインスタンスの作成はnewを使って以下のようになる。'ゴリラ'})インスタンスのnameやauthorの値はgetで取得できる。銀魂の作者はゴリラgetだけでなくsetもある。1979年生まれsetしたものはunsetで削除できる。undefined年生まれ現在Jumpでgetで取得できるものはattributesかtoJSON()で確認できる。この2つは同じなのでどちらを使っても良い。true存在の有無はhasで確認。false複製はclone()、オブジェクトのクリアはclear()を使う。{}Modelの関数は37種類Modelの関数は全部で37種類ある。Backbone.Model).__proto__ですべて確認できるのですべて覚えておくと良いだろう。()*/changeで変化した値を取得setなどで値が変更されたことを検知するにはchangeを使用する。'ラッパ')Collectionを使用するCollectionとは複数のデータ(Model)を管理するもので配列のようなものと考えるとわかりやすい。"ワニ"}CollectionのインスタンスはforEachまたはeachが使えるが、値の取得はModel同様getである点に注意。ワニCollectionの関数は100種類以上Modelの関数は全部で100種類以上ある。Backbone.Collection).__proto__ですべて確認できるのですべて覚えておくと良いだろう。pluckなどのUnderscore.jsのメソッドが多く含まれるのでUnderscore.js(Lodash)の基本的な使い方を知っていれば新たに覚えることは少ない。"ワニ"]Viewの使い方Viewを使用してHTML内にDOM要素を挿入するにはModelとCollectionの場合は以下の通り。},})Routerの使い方RouterはハッシュによるURL振り分けを行う。意外と知られていないCSSの色々な回転アニメーションの作成方法iwbjp7@gmail.com。