コレクション型 | Lightning Aura Components Developer Guide (Lightning Aura コンポーネント開発者ガイド)

次に、サポートされているコレクション型の値を示します。

型	例	説明
`type`[] (配列)	`<aura:attribute name="colorPalette" type="String[]" default="['red', 'green', 'blue']" />`	定義された種別の項目の配列。デフォルト値を設定するには、`default="['red', 'green', 'blue']"` のようにカンマ区切り値を `[]` で囲みます。角括弧のないデフォルト値の設定が廃止されるため、予期しない動作が発生する可能性があります。メモ
`List`	`<aura:attribute name="colorPalette" type="List" default="['red', 'green', 'blue']" />`	順序付けされた項目のコレクション。デフォルト値を設定するには、`default="['red', 'green', 'blue']"` のようにカンマ区切り値を `[]` で囲みます。角括弧のないデフォルト値の設定が廃止されるため、予期しない動作が発生する可能性があります。メモ
`Map`	`<aura:attribute name="sectionLabels" type="Map" default="{ a: 'label1', b: 'label2' }" />`	キーを値に対応付けるコレクション。対応付けに重複キーを含めることはできません。各キーを複数の値に対応付けることはできません。 JavaScript では、デフォルト値を持たない属性のデフォルトは `null` になります。JavaScript でマップ値を設定したい場合は、空のマップ用のマークアップで `default="{}"` を使用してください。値を取得するには、`cmp.get("v.sectionLabels")['a']` を使用します。
`Set`	`<aura:attribute name="collection" type="Set" default="['red', 'green', 'blue']" />`	重複する要素を含まないコレクション。セット項目の順序は保証されません。たとえば、`"['red', 'green', 'blue']"` が `blue,green,red` と返される可能性があります。デフォルト値を設定するには、`default="['red', 'green', 'blue']"` のようにカンマ区切り値を `[]` で囲みます。角括弧のないデフォルト値の設定が廃止されるため、予期しない動作が発生する可能性があります。メモ

変数種別の確認

変数種別を判断する場合は、代わりに typeof を使用するか、JavaScript の標準メソッド (Array.isArray() など) を使用します。instanceof 演算子は、複数のウィンドウまたはフレームが存在する可能性があるため信頼性が低下します。

リスト項目の設定

リスト内の項目を設定するには、いくつかの方法があります。クライアント側のコントローラを使用するには、List 型の属性を作成し、component.set() を使用して項目を設定します。

次の例では、ボタンをクリックしたときにクライアント側のコントローラから数値のリストを取得します。

1<aura:attribute name="numbers" type="List"/>
2<lightning:button onclick="{!c.getNumbers}" label="Display Numbers" />
3<aura:iteration var="num" items="{!v.numbers}">
4  {!num.value}
5</aura:iteration>

1/** Client-side Controller **/
2({
3  getNumbers: function(component, event, helper) {
4    var numbers = [];
5    for (var i = 0; i < 20; i++) {
6      numbers.push({
7        value: i
8      });
9    }
10    component.set("v.numbers", numbers); 
11    }
12})

対応付け項目の設定

キーと値のペアを対応付けに追加するには、構文 myMap['myNewKey'] = myNewValue を使用します。

1var myMap = cmp.get("v.sectionLabels");
2myMap['c'] = 'label3';

次の例では、対応付けからデータを取得します。

1for (var key in myMap){
2     //do something
3}