Bagaimana cara mengubah objek biasa menjadi Peta ES6?

Untuk beberapa alasan saya tidak dapat menemukan hal sederhana ini di dokumen MDN (mungkin saya melewatkannya).

Saya berharap ini berhasil:

const map = new Map({foo: 'bar'});

map.get('foo'); // 'bar'

... tapi baris pertama melempar TypeError: (var)[Symbol.iterator] is not a function

Bagaimana cara membuat Peta dari objek biasa? Apakah saya benar-benar harus mengonversinya terlebih dahulu menjadi array array pasangan kunci-nilai?

Ya, Mapkonstruktor mengambil larik pasangan nilai kunci.

Object.entriesadalah metode statis Objek baru yang tersedia di ES2017 (19.1.2.5) .

const map = new Map(Object.entries({foo: 'bar'}));

map.get('foo'); // 'bar'

Saat ini diterapkan di Firefox 46+ dan Edge 14+ dan versi Chrome yang lebih baru

Jika Anda perlu mendukung lingkungan lama dan transpilasi bukanlah pilihan untuk Anda, gunakan polyfill, seperti yang direkomendasikan oleh georg:

Object.entries = typeof Object.entries === 'function' ? Object.entries : obj => Object.keys(obj).map(k => [k, obj[k]]);

Silakan lihat jawaban nils menggunakanObject.entries dan / atau jawaban bergi menggunakan fungsi generator . Meskipun Object.entriesbelum ada dalam spesifikasi ketika pertanyaan diajukan, itu berada di Tahap 4 , jadi aman untuk melakukan polyfill dan digunakan bahkan pada bulan April 2016 (hanya). (Lebih lanjut tentang tahapan di sini .) Dan fungsi generator ada di ES2015. OP secara khusus diminta untuk menghindari perantara, dan sementara generator tidak sepenuhnya menghindarinya, ia melakukan pekerjaan yang lebih baik daripada di bawah atau (sedikit) Object.enties.

FWIW, menggunakan Object.entries:

• Membuat [name, value]larik untuk diteruskannew Map
• The Mapkonstruktor memanggil fungsi pada array untuk mendapatkan iterator; array membuat dan mengembalikan objek interator array.
• The Mappenggunaan konstruktor bahwa objek iterator untuk mendapatkan entri (dalam [name, value]array) dan membangun peta

Menggunakan generator:

• Membuat objek generator sebagai hasil dari pemanggilan fungsi generator
• The Mapkonstruktor memanggil fungsi pada objek generator untuk mendapatkan iterator dari itu; objek generator mengembalikan dirinya sendiri
• The Mapkonstruktor menggunakan objek Generator (sebagai iterator) untuk mendapatkan entri (dalam [name, value]array) dan membangun peta

Jadi: Satu perantara lebih sedikit (array dari Object.entries).

Namun, menggunakan Object.entrieslebih sederhana dan membuat array itu tidak menjadi masalah 99,999% dari waktu. Jadi sungguh, salah satunya. Tapi keduanya lebih baik dari yang di bawah. :-)

Jawaban asli:

Untuk menginisialisasi a Map, Anda dapat menggunakan iterator apa pun yang mengembalikan pasangan kunci / nilai sebagai array, seperti array array:

const map = new Map([
    ['foo', 'bar']
]);

Tidak ada konversi bawaan dari objek ke peta, tetapi itu mudah dilakukan dengan Object.keys:

const map = new Map();
let obj = {foo: 'bar'};
Object.keys(obj).forEach(key => {
    map.set(key, obj[key]);
});

Anda bisa, tentu saja, memberi diri Anda fungsi pekerja untuk mengatasinya:

function buildMap(obj) {
    let map = new Map();
    Object.keys(obj).forEach(key => {
        map.set(key, obj[key]);
    });
    return map;
}

Kemudian

const map = buildMap({foo: 'bar'});

Atau inilah versi yang lebih mirip l33t (apakah itu masih ada?):

function buildMap(obj) {
    return Object.keys(obj).reduce((map, key) => map.set(key, obj[key]), new Map());
}

(Ya, Map#setmengembalikan referensi peta. Beberapa berpendapat ini merupakan abusage dari reduce.)

Atau kita benar - benar bisa berlebihan dalam ketidakjelasan:

const buildMap = o => Object.keys(o).reduce((m, k) => m.set(k, o[k]), new Map());

Tidak, saya tidak akan pernah melakukan itu secara nyata. :-)

Apakah saya benar-benar harus mengonversinya terlebih dahulu menjadi array array pasangan kunci-nilai?

Tidak, iterator dari array pasangan nilai-kunci sudah cukup. Anda dapat menggunakan berikut ini untuk menghindari pembuatan array perantara:

function* entries(obj) {
    for (let key in obj)
        yield [key, obj[key]];
}

const map = new Map(entries({foo: 'bar'}));
map.get('foo'); // 'bar'

Jawaban oleh Nils menjelaskan bagaimana mengubah objek menjadi peta, yang menurut saya sangat berguna. Namun, OP juga bertanya-tanya di mana informasi ini ada di dokumen MDN. Meskipun mungkin tidak ada di sana ketika pertanyaan awalnya ditanyakan, sekarang ada di halaman MDN untuk Object.entries () di bawah judul Mengonversi Objek ke Peta yang menyatakan:

Mengonversi Objek ke Peta

The new Map()konstruktor menerima sebuah iterable dari entries. Dengan Object.entries, Anda dapat dengan mudah mengonversi dari Objectmenjadi Map:

const obj = { foo: 'bar', baz: 42 }; 
const map = new Map(Object.entries(obj));
console.log(map); // Map { foo: "bar", baz: 42 }

const myMap = new Map(
    Object
        .keys(myObj)
        .map(
            key => [key, myObj[key]]
        )
)

Alternatifnya Anda bisa menggunakan metode lodash toPairs :

const _ = require('lodash');
const map = new Map(_.toPairs({foo: 'bar'}));

ES6

konversi objek ke peta:

const objToMap = (o) => new Map(Object.entries(o));

konversikan peta menjadi objek:

const mapToObj = (m) => [...m].reduce( (o,v)=>{ o[v[0]] = v[1]; return o; },{} )

Catatan: fungsi mapToObj mengasumsikan kunci peta adalah string (akan gagal jika tidak)

Dengan bantuan beberapa JQuery,

const myMap = new Map();
$.each( obj, function( key, value ) {
myMap[key] = value;
});