今回はJavaScriptやJQueryで配列の作成方法と取得方法についてを解説していきたいと思います。
それではいってみましょう！
Menu
配列の作成方法
配列の作成の方法を2パターンご紹介したいと思います。
①let 配列変数 = [要素1,要素2…];
[ ]の中をカンマで区切ってデータを入れていけば作成できます。
1 | let ary = ['日', '月', '火', '水', '木', '金', '土']; |
②let 配列変数 = newArray(要素1,要素2…);
new Array( )の中をカンマで区切ってデータを入れていけば作成できます。
1 | let ary = new Array('日', '月', '火', '水', '木', '金', '土'); |
➂let 配列変数 =[ ];
空の配列を作成。
1 | let empAry = []; |
配列の取得方法
配列数を取得
lengthプロパティ
1 2 3 4 | //lengthプロパティ let ary = ['日', '月', '火', '水', '木', '金', '土']; console.log(ary.length); //【結果】7 |
基本の配列取得
先頭要素 : 配列[0]
末尾要素 : 配列[配列.length-1]
※配列のインデックスは0から数えます。
1 2 3 4 5 6 7 8 9 10 11 12 | //配列作成 let ary = ['日', '月', '火', '水', '木', '金', '土']; //配列の先頭要素を取得 let first = ary[0]; console.log(first); //【結果】日 //配列の末尾要素を取得 let last = ary[ary.length - 1]; console.log(last); //【結果】土 |
ループで配列取得（Javascript）
JavascriptのFor文で添え字（インデックス）と要素を取得することができます。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | //Javascriptのforで取得 let ary = ['日', '月', '火', '水', '木', '金', '土']; for (let index = 0; index < ary.length; index++){ console.log(index +':'+ary[index]); }; //【結果】 // 0:日 // 1:月 // 2:火 // 3:水 // 4:木 // 5:金 // 6:土 |
ループで配列取得（JQuery）
JQueryのeachメソッドで添え字（インデックス）と要素を取得することができます。
2パターンご紹介します(*^^)v
JQeryのeachメソッド①
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | //JQueryのeachメソッド let ary = new Array('日', '月', '火', '水', '木', '金', '土'); $.each(ary, function(index,val) { console.log(index+':'+val); }); //【結果】 // 0:日 // 1:月 // 2:火 // 3:水 // 4:木 // 5:金 // 6:土 |
JQeryのeachメソッド②
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | //JQueryのeachメソッド⓶ let ary = new Array('日', '月', '火', '水', '木', '金', '土'); $(ary).each(function(index,val) { console.log(index+':'+val); }); //【結果】 // 0:日 // 1:月 // 2:火 // 3:水 // 4:木 // 5:金 // 6:土 |
添字(インデックス)を取得する
IndexOfでインデックスを取得することができます。
1 2 3 4 5 6 | //IndexOf let ary = ['日', '月', '火', '水', '木', '金', '土']; let index = ary.indexOf('金'); console.log(index); // 結果 5 |
indexOfメソッドは一致する配列要素が最初から数えて何番目かを知ることができる関数です。
※インデックスは0から数えます。
まとめ
今回は基本的な配列の作成から取得方法について解説しました。
今回のような基本形さえ頭に叩き込んでおけば、だいたいの配列は取得はできるので使用時は多分忘れるのでこんなんがあったな～と思いだせるように記事にしてみました。
以上です(^^♪
