javascript

Arrayの拡張

■.each　配列のメソッド　「各配列の要素に関数を適用する」
=>用法
myArray.each(fn[, bind]);
=>引数
fn：関数。この関数は配列の各要素に対して実行されます。この関数の引数は要素（item）とそのインデックス（index）です。bind：オブジェクト。このオブジェクトは関数の中で、’this’として使うオブジェクト

□引数にある関数(fn)の引数について
=>用法
fn(item, index, array)
=>引数
item：mixed　現在実行中の配列の要素（item）
index：数値　現在実行中の配列のインデックス（index）
array：配列　実際の配列？？※この引数の意味は宿題
例）
var testArray = ['keybord','geek','whisper','girl','devil','otaku','akiba','anime','perfume','travel','hbr'];
testArray.each(function(item, index){
document.write(index + “=>” + item)
});

■.every　配列のメソッド　「引数にある関数を全ての要素に実行し、すべてtrueであればtrueを返す」
=>返り値
論理値
=>用法
var allPassed = myArray.every(fn[, bind]);
=>引数
fn：関数。配列のそれぞれの要素にテストする関数
bind：オブジェクト。関数の中で、’this’として使うオブジェクト

□引数にある関数(fn)の引数について
=>用法
fn(item, index, array)
=>引数
item：mixed　現在実行中の配列の要素（item）
index：数値　現在実行中の配列のインデックス（index）
array：配列　実際の配列？？※この引数の意味は宿題
例）
var areAllBigEnough = [10,4,25,100].every(function(item, index){
return item > 20;
});
//10,4,25,100、すべて20より大きくはない（関数の実行結果）ので、falseが戻ってくる
//もし、[30,40,50,700]という配列でおこなった場合はtrueとなる。

■.filter　配列のメソッド　「配列の各要素に対して引数の関数を実行し、trueとなった値で新たに配列を作る」
=>返り値
array：新しい配列
=>用法
var filterdArray = myArray.filter(fn[, bind]);
=>引数
fn：関数。配列のそれぞれの要素に対して実行する関数
bind：オブジェクト。上記関数（fn）の中で’this’を使ってアクセスするオブジェクト

□引数にある関数(fn)の引数について
=>用法
fn(item, index, array)
=>引数
item：mixed　現在実行中の配列の要素（item）
index：数値　現在実行中の配列のインデックス（index）
array：配列　実際の配列？？※この引数の意味は宿題
例）
var biggerThanTwenty = [10, 3, 25, 100].filter(function(item, index){
return item >20;
});
// 20より大きい25と100が要素の配列ができるよ～

■.clean　配列のメソッド　「true と評価された配列の要素だけで構成された新しい配列ができる。」
=>返り値
array：新しい配列
=>用法
var cleanedArray = [0, 3, null, false, true, "foo", ""].clean();

ずっと疑問だったjavascriptのオブジェクト指向。。。
ようやくちょっと判明。

これがわかると、配布されているライブラリも拡張してより強力にすることができる！！

まずは～
JavaやC++、C#などのオブジェクト指向とはちょっと違います。
PHPのオブジェクト指向ともちょっと違います。
actionscriptのオブジェクト指向ともちょっと違います。

が！！

似てます。
激似です。

基本的に書き方としては、関数を定義するかのごとく書きます。
ただし、javascriptの場合、関数もデータとして扱えます。ここがミソ。
関数もほかの文字列や、数値、論理値のようにデータとして扱えちゃうのです。

ザッツ　「関数オブジェクト」　！！！！

仮に、
function test(){
・・・・・
}
という関数を定義したとしましょう。

この関数をオブジェクトとして扱えちゃいますので、
test.parame = 1;
とか
test.param2 = 2;
とか
test.param3 = 3;
とかできちゃいます。（厳密にはこれは、オブジェクトプロパティとか呼ばれる代物です。）

じゃ～、関数にプロパティが設定できるし、関数もデータとして扱えるから、プロパティとして関数を設定して、メソッドとしてしまえばいいじゃん！！

ということなんです。超簡単に言えば・・・。厳密さに問題があるかもしれません。

じゃ～、具体的に　tashizan　というクラスを作って、引数として渡された２つの値を加算した結果を返すメソッドを持たせましょう。。。

function test(a, b) {
//thisで自分自身をさしています。
//自分の　x　とういプロパティに引数　a　を
//自分の　y　というプロパティに引数　b　を設定してあげます。
//関数をオブジェクトとして扱い、それにプロパティを設定する感じ
this.x = a;
this.y = b;
}

//次に、メソッドを設定しますが、ここで仮に

function test(a, b) {
//thisで自分自身をさしています。
//自分の　x　とういプロパティに引数　a　を
//自分の　y　というプロパティに引数　b　を設定してあげます。
//関数をオブジェクトとして扱い、それにプロパティを設定する感じ
this.x = a;
this.y = b;
this.tashizan = function() {
return this.x + this.y;
}
}
といった具合でJava等のような感覚でメソッドを定義すると、インスタンスを生成する度に、各々のインスタンスが同じメソッドを持った状態で生成されてしまいます。

ザッツ　もったいない！！！！！

ということで、登場するのが

prototypeオブジェクト

これ、どういう代物かと申しますと、
クラス共通のメソッドやら、プロパティを設定できるというもの。
もっと詳しくいいますと、各々のインスタンスは、この　prototypeオブジェクト　からプロパティを継承しているという内容だそうです。
ですので、この　prototypeオブジェクトに対して、そのクラス共通のメソッドだの、プロパティを設定してあげるとよろしいそうで。

ではもう一度、コードに戻りまして、先ほどののfunction test(a, b)・・・は

function test(a, b) {
//thisで自分自身をさしています。
//自分の　x　とういプロパティに引数　a　を
//自分の　y　というプロパティに引数　b　を設定してあげます。
//関数をオブジェクトとして扱い、それにプロパティを設定する感じ
this.x = a;
this.y = b;
}

となり、
共通のメソッド　tashizan　は

test.prototype.tashizan = function() {return this.x + this.y;}

と書きます。
これで、

var test = new test(1, 2);
var test2 = new test(3, 4);

document.write(test.tashizan());
document.write(test2.tashizan());

とするみたいな。
ちょっと説明がしょーもないですね・・・・・・。

『次は、YUIなどで使われている「名前空間」
初めてYUI使ったとき、ま～ったくわからなかったです・・・・。』

とか書いて意気込んで、大事な箇所を書いていたのですが、
javascriptのオブジェクト指向を上手にできるように説明できるようにするため、何回かこのテーマで記事書きたいとおもいます・・・。

お粗末様でございました。