es6 マップは参照型ですか?

Map は参照型です。map (コレクション) は、es6 の新しい参照データ型であり、データのマッピング関係を表します。マップ コレクション データ型のデータは、「キー/値」方式で保存されます。オブジェクトのプロパティをキーとして使用し、そのプロパティを使用して値を参照できます。マップは、new を使用して作成できます。たとえば、「const」 myMap = new Map();" 。

このチュートリアルの動作環境: Windows 7 システム、ECMAScript バージョン 6、Dell G3 コンピューター。

map は参照型です。

es6 マップ

ES6 より前では、JavaScript で 'key'=>'value' (よくキーと値のペアと呼ばれるもの) を実装するには、次のようにします。オブジェクトを使用して完了します。ただし、この実装方法には特殊なシナリオでは問題があり、ES6 では、言語に真のキーと値のペアの保存メカニズムをもたらす Map と呼ばれる新しいコレクション タイプが導入されました。

map (コレクション) は、es6 の新しい参照データ型で、データのマッピング関係を表します。マップ コレクション データ型のデータは「キー/値」方式で保存され、オブジェクトのプロパティ キーとして、プロパティを使用して値を参照します。

1-1 マップの作成

new キーワードを使用してマップをインスタンス化します

let m = new Map();

console.log(m);
// Map(0) {}

作成時の初期化:
2 次元配列パラメータを渡します (反復可能なオブジェクト、キー値は内部的に配列として渡されます)
各サブ配列の最初の要素が対応しますkey をマップするには、2 番目の要素は value

let m = new Map([[{}, 222], [{}, '123']]);

console.log(m);
// Map(2) { {} => 222, {} => '123' }

##1-2 Map Api ## です。

#1-2-1 マッピング要素を追加します set() メソッドを通じて追加し、2 つのパラメータ、最初のキーを渡します。マップの値が最初に渡され、マップの値が 2 番目に渡されます。返されるのはマッピング セットです (連鎖的に追加できることを意味します)

let m = new Map();

m.set('prop', '值');

console.log(m);
// Map(1) { 'prop' => '值' }

キー値の連鎖追加

let m = new Map();

m.set('prop', '值').set('prop2', false).set('num', {id: 13});

console.log(m);
// Map(3) { 'prop' => '值', 'prop2' => false, 'num' => { id: 13 } }

##1-2-2 マッピング長さを設定 size

属性を使用して、現在のコレクション内の要素の数を取得します

let m = new Map();

m.set('prop', '值').set('prop2', false).set('num', {id: 13});

console.log(m.size);

1-2 -3 要素の取得get() メソッドを通じて要素を取得し、ターゲットのキーを渡します##

let m = new Map();

m.set('prop', '值').set('prop2', false).set('num', {id: 13});

console.log(m.get('prop2'));
// false

1-2-4要素を削除します

delete() メソッドを使用してマッピング コレクション内の要素を削除し、削除が成功したか失敗したかを示すブール値を返します

let m = new Map();

m.set('prop', '值').set('prop2', false).set('num', {id: 13});

m.delete('prop2');
// true

console.log(m.get('prop2'), m.size);
// undefined 2

#1-2-5 要素が存在するかどうかを検出する

has()メソッドを使用して、対象の要素が存在するかどうかを検出し、検出結果のブール値を返します

let m = new Map();

m.set('prop', '值').set('prop2', false).set('num', {id: 13});

m.delete('prop2');
// true

console.log(m.has('prop2'), m.has('num'));
// false  true

1-2-6 要素のクリア メソッド

clear() メソッドを使用してすべての要素をクリアし、クリア成功のブール値を返します

let m = new Map();

m.set('prop', '值').set('prop2', false).set('num', {id: 13});

m.clear();
// true

console.log(m);
// Map(0) {}

##1-3 反復を伴うシーケンス

map は挿入順序に従って要素を反復できます マッピング インスタンス(iterator) を提供します。挿入順に [key, value] の形式で配列を生成し、entrys() メソッド (または提供された Symbol.iterator) のイテレータ インターフェイス トラバーサルを渡すことができます。

let m = new Map();

m.set('prop', '值').set('prop2', false).set('num', {id: 13});

console.log(m.entries === m[Symbol.iterator]);// true

for(let k1 of m.entries()){
    console.log(k1);
    // [ 'prop', '值' ]
    // [ 'prop2', false ]
    // [ 'num', { id: 13 } ]
    // 遍历的属性即对应映射元素的键值对数组
}

for(let k2 of m.keys()){
    console.log(k2);
    // prop
    // prop2
    // num
    // 遍历的属性对应映射元素的键
}

for(let k3 of m.values()){
    console.log(k3);
    // 值
    // false
    // { id: 13 }
    // 遍历的属性对应映射元素的值
}

for(let k4 of m[Symbol.iterator]()){
    console.log(k4);
    // [ 'prop', '值' ]
    // [ 'prop2', false ]
    // [ 'num', { id: 13 } ]
    // 遍历的属性即对应映射元素的键值对数组
}

1-4 オブジェクトとの比較

メモリ使用量ブラウザこの違いにより、2 つのストレージ メソッド間でメモリ使用量が異なります。ただし、メモリ サイズを考慮すると、map は Object よりも約 50% 多くのキーと値のペアを格納します。

挿入パフォーマンス

• 挿入速度 上記のマップとオブジェクトのパフォーマンスはほぼ同じですが、コードに多数の挿入が含まれる場合は、マップ

検索速度##を使用することをお勧めします。
• #差は小さく、オブジェクトに含まれるキーと値のペアの数が少ない場合は、オブジェクトの方が優れています。
  削除のパフォーマンス
• オブジェクトの delete() のパフォーマンスは悪いですが、map の delete() のパフォーマンスは良好です。データに大量の削除操作が含まれる場合は、map

[関連する推奨事項:
• JavaScript ビデオ チュートリアル

  、

  プログラミング ビデオ

  ]

以上がes6 マップは参照型ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。