Underscore.js入門

2015.04.25 春のJavaScript祭

自己紹介

株式会社ホットスタートアップ

香月雄介(@katsukii)

　　

Underscore.jsとは

JavaScriptの便利関数の集合体ライブラリ。100個くらいの関数が定義されている。

Backbone.jsもUnderscore.jsに依存している。

Underscore.jsの導入

1. 公式サイトからファイルをダウンロードする

http://underscorejs.org/

2.HTMLのheadタグで読み込む

Underscore.jsの書き方

Underscore.jsを読み込むと、「_」というオブジェクトがが生成される。

このオブジェクトに便利な機能が詰まっている。

Underscore.js便利関数5選

each PHPでいうforeachに近い。配列にもオブジェクトにも使える。第二引数である関数の第二引数にはindex番号が渡される（オブジェクトの場合はkey）

sortBy 配列を渡すと、関数処理により昇順に並べ替えられた配列として返ってくる。

filter集合要素から条件にマッチしたものを探して配列にして

isUndefined他にもisEmpty, isString, isNull, isNumberなど。

keys, valueskeys:オブジェクトのプロパティ名を配列にして返す

values:オブジェクトのプロパティの値をすべて返す

Underscore.jsを使うメリット

- 関数名により処理内容が明示的になるため、可

読性が上がる

- コード量が減る

- 配列扱うときに繰り返し処理とかやらなくてよく

なる

jQueryとの棲み分け

jQueryにもeachやbindとかはあるけど？？？

jQueryとの棲み分け

jQueryにもeachやbindとかはあるけど？？？

AjaxやDOM操作etc...

配列・オブジェクト操作etc...

jQueryとの棲み分け

UnderscoreはjQueryのタキシードとBackbone.jsのサスペンダーにあうようなネクタイです。

親和性は非常に高いので両方読み込んで便利に使える。

ペライチお手伝いメンバー募集

ペライチでは平日夜や土日にお手伝いいただける方を

募集しています。

- Webサービス開発に興味がある方

- スタートアップの中身を覗きたい方

- チーム開発に参加してみたい方

ご興味ある方は懇親会でお話しましょう！！

https://peraichi.com/