prototype.js 復習 Enumerable each _each

• Gaucheを非常にゆっくりな速度で勉強しているが、それのおかげでプログラミングの考え方とかをきちんと身につけることができている気がする。

• 以下はprototype.jsの復習。以前に分析したときより自然にコードを読めたので書きとめておきました

1：配列の中身を走査したい

<script>
var array = ['hoge', 'moge'];
for(var i=0, l=array.length; i<l; i++){
	alert(array[i]);
}
</script>

2： 個別の配列に対して同じ手続きを書くのは意味がないのでprototypeメソッド(?)に組み込む。その際、1の「alert」部分は抽象化できるので(document.writeでもいいわけなので。)そうする。(javascriptは引数に関数を取れる)

<script>
var array = ['hoge', 'moge'];

Array.prototype._each = function(iterator){
	for(var i=0, l=this.length; i<l; i++){
		iterator(this[i]);
	}
}

var mytest = function(value){
	alert(value);
}
array._each(mytest);
</script>

(function(value){
	alert(value);
})(this[i])

3：配列のkeyとvalueを走査したい

• 配列の中身にアクセスするというメソッドが根底にある。そこにその他のメソッドを上乗せしていくことになる。慣れない内はややこしく感じていたが、自然な思考の流れで見るとそれがごく当たり前のように感じてきた。

<script>
var array = ['hoge', 'moge'];

Array.prototype._each = function(iterator){
	for(var i=0, l=this.length; i<l; i++){
		iterator(this[i]);
	}
}

//keyとvalueを使いたい

Array.prototype.each = function(iterator){
	var index = 0;
	this._each(function(value){
		iterator(value, index++);
	});
}

var mytest = function(value, key){
	alert(value + "->" + key);
}

array.each(mytest);

</script>

this._each(function(value){
	(function(value, key){
		alert(value + "->" + key);
	})(value, index++)
})
			↓これを展開すると
for(var i=0, l=this.length; i<l; i++){
	(function(value){
		(function(value, key){
			alert(value + "->" + key);
		})(value, index++);
	})(this[i]);
}