フレームワークモジュール / ObservableArray

ObservableArray

"ObservableArray"モジュールは、 オブジェクトのコレクションの変更を検出してそれに対応する機能を提供することにより、Arrayクラスを拡張します。 ObservableArrayは、concat, push, reduce, slice, splice, reverseなどの既知のメソッドをサポートしています (完全なリストはこちら

基本

ObservableArrayモジュールのインポート

ObservableArrayを使用するにObservableArrayは、関連モジュールが必要です。

const ObservableArray = require("tns-core-modules/data/observable-array").ObservableArray;
import { ObservableArray, ChangedData } from "tns-core-modules/data/observable-array";

ObservableArrayの作成

異なるクラスのコンストラクターでObservableArrayを作成します。

// Create ObservableArray with lenght
let myObservableArray = new ObservableArray(10);

// Create ObservableArray from array.
const arr = [0, 1, 1, 2, 3, 5, 8, 13, 21, 34];
myObservableArray = new ObservableArray(arr);
// Create ObservableArray from arguments.
myObservableArray = new ObservableArray(1, 2, 3, 5, 8, 13, 21, 33, 55, 89);
// Create ObservableArray with lenght
let myObservableArray = new ObservableArray(10);

// Create ObservableArray from array.
const arr = [0, 1, 1, 2, 3, 5, 8, 13, 21, 34];
myObservableArray = new ObservableArray(arr);
// Create ObservableArray from arguments.
myObservableArray = new ObservableArray(1, 2, 3, 5, 8, 13, 21, 33, 55, 89);

配列アイテムの取得、設定、追加

通常の配列の実装との違いの1つは、項目にインデックスを介してアクセスする方法です。 一般的なJS配列ではarray[index]ですが、ObservableArrayではgetItem(index)メソッドを使用する必要があります。

const firstItem = myObservableArray.getItem(0);
const secondItem = myObservableArray.getItem(1);
const thirdItem = myObservableArray.getItem(2);
const firstItem = myObservableArray.getItem(0);
const secondItem = myObservableArray.getItem(1);
const thirdItem = myObservableArray.getItem(2);

setItem(index, item)メソッドを使用して指定されたインデックスに項目を設定します。

myObservableArray.on(ObservableArray.changeEvent, (args) => {
    console.log(args.index); // Index of the changed item (in this case 7).
    console.log(args.action); // Action (In this case "update")
    console.log(args.addedCount); // Number of added items (In this case 1).
    console.log(args.removed); // Array of removed items (in this case 33).
});
myObservableArray.setItem(7, 34); // at seventh (7) index setting value of 34
myObservableArray.on(ObservableArray.changeEvent, (args: any) => {
    console.log(args.index); // Index of the changed item (in this case 7).
    console.log(args.action); // Action (In this case "update")
    console.log(args.addedCount); // Number of added items (In this case 1).
    console.log(args.removed); // Array of removed items (in this case 33).
});
myObservableArray.setItem(7, 34); // at seventh (7) index setting value of 34

push(item)メソッドを使用して配列に単一の要素を追加します。

myObservableArray.push(144);
myObservableArray.push(144);

push()メソッドを使用して、ソース配列からObservableArrayに複数の要素を追加します。

myObservableArray.push([377, 233]);
myObservableArray.push([377, 233]);

反転、削除、ソート操作

reverse()メソッドを使用してObservableArrayの要素の順序を逆にします。

myObservableArray.reverse();
myObservableArray.reverse();

shift()メソッドを使用して配列の最初の要素を削除します。

myObservableArray.shift();
myObservableArray.shift();

sort()メソッドを使用して配列をソートします。このメソッドは、比較関数を受け入れることができます。

myArray.sort();

アイテムインデックスの取得

indexOf(item)メソッドを使用して、配列内の目的の項目のインデックスを取得します。

const index = myObservableArray.indexOf(13);
console.log(index);
const index = myObservableArray.indexOf(13);
console.log(index);

デモソース

入門

コアコンセプト

ユーザーインターフェース

ツール

ハードウェアアクセス

プラグインの開発

リリース

アプリテンプレート

パフォーマンスの最適化

フレームワークモジュール

ガイド

サポートを受ける

トラブルシューティング

Siedkick