読者です 読者をやめる 読者になる 読者になる

一から勉強させてください( ̄ω ̄;)

最下級エンジニアが日々の学びをアウトプットしていくだけのブログです。

JavaScript

Rails4.1プロジェクトにteaspoon入れたらエラー出たので調査した

Rails4.1のプロジェクトでJavaScriptのテストをするためにteaspoonを入れたらうまく動かなかったので調査。 Rails4.0で入れたときは問題なかったのに…ツラい。 準備 まずはGemfileに記述して group :development, :test do #ここにrspec関連とか書いてる。 #…

JavaScriptでクラスっぽいコードを書く方法

今回はJavaScriptでクラスっぽいコードを書く方法について考察したいと思います。参考にさせていただいたのは、JavaScriptで関数の多重定義を行う方法の時と同様、ジョンレシグ氏の本を参考にさせていただきました!神っ!! 早速サンプルコードを。こんな感…

JavaScriptで関数の多重定義を行う方法

今回はJavaScriptで関数の多重定義を行う方法について書きます。 まず関数の多重定義というのは、何を引数に渡すか(引数の数、型など)によって異なる動作を行う関数を定義する方法です。例えばjQueryのcssメソッドとか良い例だとおもうんですが、 $(select…

JavaScriptでオブジェクトのプロパティを列挙する方法

今回はJavaScriptでオブジェクトのプロパティを列挙する方法について書きたいと思います。 オブジェクトのプロパティを列挙する方法って地味に結構あるんですよね。ただ、それぞれの手法に特徴(ていうか制限?)があって、例えば「プロトタイプがもっている…

JavaScriptの継承について

先日ひさしぶりにJavaScript The Good Partsの「継承」の章を読み返したので、今回はそのアウトプットとして記事を書きたいと思います。 まず章の冒頭にこのようなことが書いてあります。 クラスを利用する言語では、オブジェクトはクラスのインスタンスであ…

RequireJSつかってみた

今回はJavaScriptのモジュール管理ライブラリのRequireJSをつかってみました。JavaScriptにはモジュールを管理する機能がないので、大規模プロジェクトなどで、JSファイルを分割した場合、その依存関係が心配になります。でもこのRequireJSを使えば、依存関…

jasmineつかってみた

今回はJavaScriptのテストフレームワークjasmineをつかってみたときのことを書きたいと思います。 近年、テストを先に書いてから実装を行う「テスト駆動開発(TDD: Test Driven Development )」というものが注目されておりましたが、最近はそのさらに進化版…

jsPerfつかってみた

先日、JavaScriptのコードスニペットに対してベンチマークをとることができる「jsPerf」というサービスをつかってみました。 今回はそのときの備忘録的メモを書きたいと思います。 サイトはこちら↓http://jsperf.com/ それでは早速順番に進んでいきたいと思…

GruntでCSS、JSの圧縮をしてみた

今回は普段、地味に鬱陶しいCSSやJSの圧縮処理をGruntを使ってやってみたときのことを書きたいと思います。まずGruntとはなんぞやということですが、、Gruntとはファイルのコピーや削除、JSやCSSの圧縮やgzip化、画像の圧縮、Sprite化などを自動化してくれる…

JavaScriptで数字をカンマ区切りにする方法

今回はJavaScriptで数字をカンマ区切りにする方法について調査したときのことを書いておきたいと思います。ここでやりたかったことは、たとえば123456789という値を123,456,789という表示にしたいって感じです。 今回、参考にさせて頂いた記事はこちらhttp:/…

console.time、console.timeEndを使ってみた

今回はJavaScriptのデバックでよく使うconsoleの中でも時間計測に便利なconsole.time、console.timeEndを試してみました!早速、サンプルを書いてみました。これ↓ function sum(){ var x = 0; for(var i = 0; i < 10000000; i++){ x ++; } return x; } conso…

requestAnimationFrameを使ってみた

この前、jsでアニメーションをつくるときはsetIntervalよりrequestAnimationFrameを使った方がいい!という話を聞きました。自分はrequestAnimationFrameを正直まともに使った事がなかったので、今回サンプルを作って試してみました。 まず作ったサンプルは…

JavaScriptのカリー化について

先日underscore.js (http://underscorejs.org/) のbindのところ _.bind = function(func, context) { if (func.bind === nativeBind && nativeBind) return nativeBind.apply(func, slice.call(arguments, 1)); var args = slice.call(arguments, 2); return…

backbone.jsのサンプルTodosの動作を追ってみた

今回は、ついにver1.0.0になったbackbone.jsを勉強しようということでサンプルとして紹介されているTodosを真似してつくってみました。ちなみにこちらが見本のやつです↓ http://backbonejs.org/docs/todos.html ついでに今回ぼくが真似して書いたやつがこれ…

IE対応時のsetTimeoutの使い方メモ

仕事が忙しくてなかなかブログ書けませんでした。ひさしぶりの投稿です。。今回はIEでsetTimeoutを使用した際にハマった事を備忘録として書きたいと思います。 どんなものを使ったかと言うと、 以下のように締め切り時間を引数に渡し、1分ごとに現在の時間と…

Web Workerの機能を試してみた

今回はHTML5のWeb Workerを使ってみました。この機能は一言でいうと、「バックグラウンドで処理を実行するための仕組み」のことです。JavaScriptはシングルスレッドで処理が行われるため、同時に複数のスクリプトを実行する事はできません。 でもこのWeb Wor…

Web Messaging機能を試してみた

今回はHTML5で新たに追加された機能「Web Messaging」を試してみました。この機能は簡単にいうと、「ドメインの異なる複数のページ間でメッセージをやり取りできる機能」です。 従来、セキュリティの問題上、実現できなかったやり取りを実現する機能になりま…

canvasで簡単なお絵かきアプリをつくってみた

今回はcanvasで簡単なお絵かきアプリをつくったときのことを書きたいと思います。まず出来上がったサンプルはこちら↓ http://jsfiddle.net/danimal141/y3N8t/1/embedded/result/ 黒画面部分がcanvasでこのエリアでマウスを押した状態で動きまわると線が描か…

jsRender使ってみた

今回はJavaScriptのテンプレートエンジンであるjsRenderを試しに使ってみたメモです。まずこのテンプレートエンジンとは、、 テンプレートエンジンはテンプレートと呼ばれる雛形と、あるデータモデルで表現される入力データを合成し、成果ドキュメントを出力…

JSONPについて

前回、XMLHttpRequestを使った非同期通信のとこでJSONデータをちょろちょろいじっていたので、今回はJSONPを試してみました。まずJSONPとは、 JavaScript Object Notation with Paddingの略。 JSONデータに関数呼び出しを付加したもので、これを利用するとク…

非同期通信について

今回はJavaScriptを使った非同期通信について書いてみたいと思います。ほんとはjQueryのajaxメソッドを使ったほうが楽だとはおもうのですが今回は勉強のため、あえて純粋なJavaScriptで挑みました!! 一般にJavascriptで非同期通信を行うには、XMLHttpReque…

クロージャについて

今回は、JavaScriptを勉強しているとよく聞く「クロージャ」について学んだことを書いてみたいと思います。 まずクロージャとはなにか??ちょっと調べてみてなんとなくわかったことは、 ・関数の中に関数を書く「入れ子構造」が大事っぽい。 ・関数を抜けた…