JavaScript/配列操作

すぐ忘れるのでメモ

配列オブジェクトを作る

var hoge = new Array();

短縮版としてよくこうやって書く

var hoge = [];

先頭を削除し先頭を取得する(POPな動作)

var hoge = [1,2,3,4];
var piyo = hoge.shift(); //[2,3,4];
alert(piyo);    //1

戻りと副作用が動作としてセットなので↑は破壊的。

末尾を削除し末尾を取得する

var hoge = [1,2,3,4];
var piyo = hoge.pop(); //[1,2,3]
alert(piyo);    //4

破壊的

末尾に追加する

var hoge = new Array();
hoge.push('aaa');

破壊的

実はこのメソッド

var hoge = [];
hoge.push('aaa', 'bbb', 'ccc');

引数を何個もとって連続で追加することができる。

配列を結合する(破壊的)

「末尾に追加する」pushは引数を複数個とれるので、こいつを応用すると破壊的に配列を結合することができる

var hoge = ['aaa'];
Array.prototype.push.apply(hoge, ['bbb', 'ccc']);

applyメソッドは関数に成り代わって関数を実行するメソッドで第二引数を配列でとることができる。

だからこれを利用してpushを呼び出せば内部的には展開されてpushされるので、結果配列を結合したことと同じ効果を得ることができる。

配列を結合して新たな配列を作る(非破壊的)

var hoge = [1,2,3];
var moge = hoge.concat([4,5,6]);

mogeは

[1,2,3,4,5,6]

非破壊的

このconcatメソッドは引数を複数取ることもでき複数の配列を並列に同じようにつなぐ

var hoge = [1,2,3];
var moge = hoge.concat([4,5,6],[7,8,9]);

mogeは

 [1,2,3,4,5,6,7,8,9]

配列を空にする

長さをゼロに指定すると内部もなくなります

var hoge = [1,2,3];
hoge.length = 0;

オブジェクトを無理やり配列化する

JavaScriptは数値っぽいメンバとlengthプロパティがくっついていればオブジェクトになるみたい

つまりオブジェクトに無理やりつけてやればそう動くw Javascript/jQuery内部ではそういう操作してた。

Javascriptのダックタイピング的性質

とういうことでこういうコードが記述可能

var hoge = {}
hoge[0] = 'aaa';
hoge[1] = 'bbb';
hoge.length = 2;
Array.prototype.push.apply(hoge, ['ccc']);
alert(hoge[2]);

要素を削除する(詰めない版)

なんでか知らんけどArrayには削除メソッドが無いw ・・・っが結局内部は単なる連想配列なのでdelete演算子が使える。

var a = ["a","b","c"];
delete a[1];  //=>["a", undifined, "c"]

結果はundifinedがセットされて要素数は変わらない

要素を削除する(詰める版)

deleteと違って要素数も減らす版

var a = ["a","b","c"];
a.splice(1, 1);  //=>["a", "c"]

注意点としてこの「詰める版」は要素数が減少するので定番のforループとかで操作すると操作対象とインデックスがズレます。

消した場合だけインデックスをデクリメントすれば問題ないです。

JSON形式の文字列に変換する

toStringメソッドを使うことによって、JSON形式の文字列に変換してくれる。

基本的に要素のカンマ区切りとして展開される(一番外側の[]括弧が無い)が、要素に格納されているtoStringメソッドを勝手に探索して存在したならばそれを実行し戻りで展開してくれる。

これによってオリジナルオブジェクトにtoStringを実装しておけば容易にJSON形式の文字列を生成することができるようになる。

配列の一部を配列として取り出す

これにはsliceメソッドを使う。第一引数に取り出したい場所の開始インデックス、第二引数に終了未満インデックスを入力する。つまり第一引数以上第二引数未満の要素を配列として取り出すことができる。

1個ズレなら1要素

[4, 5, 6, 7].slice(2, 3);
//[6]

同じなら無し

[4, 5, 6, 7].slice(2, 2);
//[]

オーバーしてもOK

[4, 5, 6, 7].slice(2, 10);
//[6, 7]

開始を指定して最後まで切り出す

第二引数を省略すると最後まで切り出す

[4, 5, 6, 7].slice(0);
//[4, 5, 6, 7]
[4, 5, 6, 7].slice(1);
//[5, 6, 7]

範囲を指定して頭から切り出す

[4, 5, 6, 7].slice(0, 2);
//[4, 5]

後ろから切り出す

負の数を指定することで後ろ側から切り出せる。順番は格納順と変わらない。後ろ3要素を切り出したいなら

[4, 5, 6, 7].slice(-3);
//[5, 6, 7]

っで切り出せる

タグ

javascript/array_ope.txt · 最終更新: 2010-11-14 11:05 by ore
www.chimeric.de Valid CSS Driven by DokuWiki do yourself a favour and use a real browser - get firefox!! Recent changes RSS feed Valid XHTML 1.0