クロージャについて
ボタンをクリックすると、そのボタンが何番目かを表示する。
var add_the_handlers = function(nodes) { var i; for (i = 0; i < nodes.length; i++) { nodes[i].onclick = function(e) { alert(i); }; } };
これだとボタンの総数を返してしまう。
なぜなら、alert(i)する無名関数は変数iを直接返しているからだ。
関数が作られた時の変数を返しているのではない。
var add_the_handlers = function(nodes) { var helper = function(index) { return function(e) { alert(index); }; }; var i; for (i = 0; i < nodes.length; i++) { nodes[i].onclick = helper(i); } }; add_the_handlers(document.getElementsByTagName("button"));
このプログラムは、引数に代入されたindexをalertする無名関数を返す。
indexとiは別物なので、こんどは期待通りの値を表示してくれるはずだ。
ちょっと今回の記事は自信がない。なにか付け足したかったり、間違っていることを見つけた方はTwitterなどで連絡していただきたい。
よろしくお願いします。
Good Parts 4.10
var myObject = (function() { var value = 0; return { increment: function (inc) { value += typeof inc === 'number' ? inc : 1; }, getValue: function () { return value; } }; })(); console.log(myObject.value);
これを実行すると"undefined"が表示される。
apply();
JavaScriptでずっとわからなかったapply関数の使い方がわかった.
var Person = function(name, age) { this.name = name; this.age = age; }; Person.prototype.greet = function(greet) { console.log(greet + ", " + "My name is " + this.name); }; var Doggy = { name: "Koma", age: 1 }; Person.prototype.greet.apply(Doggy, ["Bow"]);
"Bow, My name is Koma"と表示された。
うちの犬がゲスト出演しています。
JavaScirpt: The Good Parts
JavaScriptのライブラリとか、 Angular.jsみたいなフレームワークをいじっている。
「JavaScript本格入門」という本を読み終えてから、特にJavaScriptの本は読んでいなかったけれど、本格的に深いところまで学びたいと思って、2冊ほど本を買ってみた。
Amazon.co.jp: JavaScript: The Good Parts ―「良いパーツ」によるベストプラクティス: Douglas Crockford, 水野 貴明: 本
この本はJavaScirptの世界的権威、Douglas Crockfordさんの著書。
Amazonのレビューとかを見るとページ数は少ないながら、内容が濃いと評判である。
Node.jsをいじってみたくなり、「実践Node.jsプログラミング」という本も合わせて買った。
Amazon.co.jp: 実践Node.jsプログラミング Programmer's SELECTION 電子書籍: Mike Cantelon, Marc Harter, T.J. Holowaychuk, Naithan Rajlich, 吉川 邦夫, 生越 昌巳: Kindleストア
JavaScriptにはまってしまった。とても奥が深くて、Geekな言語だと思う。
これからも頑張ろうと思う。
have gone と have beenの違い。
英文法、完了系のgoneとbeenはよく混合されるのでここで自分が学んだことをブログに書いておきたい。
I have been to Paris twice.
僕はパリに2回行ったことがある。
まあこれはわかるだろう。学校で習う文法用語っぽく言うと、「現在完了形経験」とかいうやつだ。
でも、
I have gone to Paris twice.
この文は文法的に正しくない。goneは、「すでに行ってしまっている」とかそういうニュアンスを含んでいるからだ。
I have gone to Paris
少し変かもしれないが、この文だったら文法的に合っているはずだ。
「僕はパリに行ってしまった。」
そして、このgoneは自動詞的に使うことも出来る。
She has gone
「彼女は行ってしまった。」
beenと違って、目的語なしでも使える。
Underscore.jsを使ってみた(その①)
この週末は大忙しだった。英語の勉強をしたり、TOEICの申し込みをしたり、アメリカ大使館の学生ビザの書類を用意したり(これが一番心が折れた)、デザインの勉強を始めてみたり。
Underscore.jsっていうユーティリティライブラリを使ってみた。jQueryとは結構違って、なかなかいい感じだったので少し紹介してみたいと思う。
var foo = _.shuffle([2, 8 ,11]); console.log(foo);
こうやると、配列を適当な順番に並べ替えたものを表示してくれる。
_.shuffleの_の部分がjQueryの$に当たるものだと思う。"_"だからUnderscore.jsなのか。そのまま。
配列の要素で、5より大きい値をxに代入して表示させてみた。(jQueryとの夢のコラボ)
jQueryは正直使わなくてもいいんだけど使ってみた。$('p').appendの存在を知らなかったので勉強になった。
var a = [2, 5, 8, 42, 12]; var x; x = _.filter(a, function(index) { return index > 5; }); $.each(x, function() { $('p').append(this + " "); });
ー実行結果ー
8 42 12
_.filterは引数のコールバック関数に該当する値を返してくれる。
return index > 5 && index % 4 == 0;
みたいな真似はできなかった。
追記. うそですできました。
Underscore.jsは日本語のドキュメントやリファレンスがjQueryに比べて少ないのが、少し痛いかもしれない。