マーカーネット株式会社

WEB制作ブログ WEBデザイン、HTMLコーディング、PHP、スマートフォン制作などWEB制作全般に役立つ情報を発信していきます。

javascript(jquery) WEB制作

javascriptの便利なライブラリについて

投稿日:2014年6月30日 更新日:

オブジェクト(配列)や文字列の処理は自作の作成した場合、時間を要してしまします。
そこで、これらの処理をおこなう際に便利なJavascriptライブラリを紹介します。

1. underscore.js
オブジェクト(配列)を操作する際にとても便利なライブラリです。

例1:_.size(list)
連想配列(オブジェクト)の要素数は、lengthでは取得できませんが、
size()メソッドを利用しますと要素数を返します。
console.log(_.size({one: 1, two: 2, three: 3})); // 3が出力されます。

例2: _.intersection(*arrays)
複数の配列を渡しまして、一致する値のみ返します。
var ret = _.intersection([1, 2, 3, 4], [2, 3, 4, 5], [3, 4, 5, 6]);
console.log(ret); // [3, 4]が出力されます

underscore.jsと互換性があります、より高速なLo-Dash.jsというライブラリも存在します。

 

2. Underscore.string
javascriptの文字列の操作は、
文字列の操作する際にとても便利なライブラリです。
underscore.jsを拡張して利用することも可能です。

例1. _.number_fomat
数字を千位毎にグループ化してフォーマットします。
var ret = _.number_format(1000);
console.log(ret); // 1,000が出力されます。

例2. _.string.truncate(string, length, truncateString)
文字列を省略します。
var ret = _.string.truncate(“hellow world”, 5);
console.log(ret); // hello…と出力されます。

例3. _.startsWith(string)
文字列が引数の文字列で開始している場合は、trueを返します。
var ret = _.string().startsWith(“sample.jpg”, “sample”);
console.log(ret); // trueが出力されます。
今回紹介させていただきました処理はごく一部で
underscore.jsとUnderscore.stirngにはその他にも多くの便利な処理が用意されております。

東京のWEB制作会社 マーカーネット株式会社 公式WEBサイトへ

-javascript(jquery), WEB制作

執筆者:

関連記事

【スタイル次第で変幻自在!】巷で話題のSVG3つのポイントご紹介

【スタイル次第で変幻自在!】巷で話題のSVG3つのポイントご紹介

「SVG」というイメージフォーマットをご存知でしょうか? SVG(Scalable Vector Graphics)とはIllustratorで制作されるような、ベクターデータをWEB上で表示すること …

【世界一カンタン?!】1枚の画像だけでロールオーバーをさせる方法

【世界一カンタン?!】1枚の画像だけでロールオーバーをさせる方法

画像のロールオーバーって面倒ですよね。 2枚の画像を用意してJavascriptで制御して、、や背景画像していしてh overで、、 というのが一般的ですが、 今回は画像1枚だけ。CSSに4行記載する …

【デザインに一工夫】ちょっと変わったアイコン素材サイト3選

【デザインに一工夫】ちょっと変わったアイコン素材サイト3選

日頃WEBデザインの仕事に携わる関係上、素材サイト巡りをすることがよくあります。 その中で、最近面白いなと思ったサイトをご紹介したいと思います。   ヒューマンピクトグラム2.0 http: …

レスポンシブにも対応!行ごとのブロック要素の高さを自動で合わせる方法。

レスポンシブにも対応!行ごとのブロック要素の高さを自動で合わせる方法。

ブロック要素の高さを揃えるJavaScriptはいくつかあります。 その中でも行ごとの高さを変えたい場合に便利な「fixHeight.js」をご紹介します。 Contents1 「fixHeight. …

【Illustrator】簡単!マーブル模様の作り方

マーブル模様って、パターンと違って規則性もないし、表現するのは大変ですよね。 アナログで作るのにも道具を引っ張り出すのも面倒・・・失敗するのも怖い・・・ そこで、Illustratorで簡単にマーブル …