Bagaimana cara mengubah kunci Peta ke array?

237

Katakanlah saya memiliki peta berikut:

let myMap = new Map().set('a', 1).set('b', 2);

Dan saya ingin mendapatkan ['a', 'b'] berdasarkan hal di atas. Solusi saya saat ini sepertinya sangat panjang dan mengerikan.

let myMap = new Map().set('a', 1).set('b', 2);
let keys = [];
for (let key of myMap)
  keys.push(key);
console.log(keys);

Pasti ada cara yang lebih baik, bukan?

javascript dictionary ecmascript-6 Lilleman
sumber
17
Mungkin Array.from(Map.keys()).
Dan D.
stackoverflow.com/questions/8763125/get-array-of-objects-keys
hamnix
5
@gK. Ini tidak berfungsi Map.
pawel
@ Maaf Oh maaf kalau begitu!
hamnix
Array.from(Map.values())- jika dalam kasus, Anda memerlukan nilai, bukan kunci.
Manohar Reddy Poreddy

Jawaban:

436

Map.keys()mengembalikan MapIteratorobjek yang dapat dikonversi Arraymenggunakan Array.from:

let keys = Array.from( myMap.keys() );
// ["a", "b"]

EDIT: Anda juga bisa mengonversi objek iterable ke array menggunakan sintaks spread

let keys =[ ...myMap.keys() ];
// ["a", "b"]
pawel
sumber
6
Saya suka menggunakan Operator Penyebaran, meskipun, transpiler TypeScript saya melempar this.map.values().slice is not a function. Mungkin saya harus memperbarui.
Cody
4
@Cody itu karena slice()permintaan Anda dieksekusi sebelum operator spread. Coba[ ... Array.from(map.values()).slice(0) ]
mgthomas99
5
TypeScript 2.7.2 mengatakan untuk ini: const fooMap = new Map<number, string>(); const fooArray = [...fooMap.keys()];berikut ini: TS2461: Ketik 'IterableIterator <number>' bukan tipe array. Jadi ini tidak diperbolehkan dalam TypeScript. Array.dari berfungsi seperti yang diharapkan.
Stefan Rein
@StefanRein operator spreadsheet Script terlihat dia sama, tetapi tidak setara dengan penyebaran ES6, karena hanya bekerja dengan jenis Array dan Objek, sedangkan ES6 bekerja dengan iterable apa pun. Misalnya Anda dapat melakukannya ..."abc"untuk mendapatkan ["a","b","c"]ES6, yang tidak mungkin dilakukan di TS.
pawel
@ Pawel ..."abc"juga ...("abc")tidak bekerja di konsol chrome, yang mendukung ES6?
Stefan Rein
15

Anda dapat menggunakan operator spread untuk mengonversi iterator Map.keys () di dalam Array.

let myMap = new Map().set('a', 1).set('b', 2).set(983, true)
let keys = [...myMap.keys()]
console.log(keys)
Luaskan cuplikan

Fernando Carvajal
sumber
6

Array.from(myMap.keys()) tidak berfungsi dalam skrip aplikasi google.

Mencoba menggunakannya menghasilkan kesalahan TypeError: Cannot find function from in object function Array() { [native code for Array.Array, arity=1] }.

Untuk mendapatkan daftar kunci di GAS, lakukan ini:

var keysList = Object.keys(myMap);
Joman68
sumber
Yang ini berfungsi untuk saya, dan jawaban pertama tidak. Saya tidak menggunakan Google ... tetapi terus menerima pesan kesalahan yang mengatakan bahwa map.keys()nilai pengembalian tidak dapat diubah.
Azurespot
5

Saya membutuhkan sesuatu yang mirip dengan bentuk reaktif sudut:

let myMap = new Map().set(0, {status: 'VALID'}).set(1, {status: 'INVALID'});
let mapToArray = Array.from(myMap.values());
let isValid = mapToArray.every(x => x.status === 'VALID');
linfluX
sumber
2

Bukan jawaban terbaik untuk pertanyaan tetapi trik ini new Array(...someMap)menyelamatkan saya beberapa kali ketika saya membutuhkan kunci dan nilai untuk menghasilkan array yang diperlukan. Misalnya ketika ada kebutuhan untuk membuat komponen reaksi dari objek Peta berdasarkan nilai kunci dan nilai.

  let map = new Map();
  map.set("1", 1);
  map.set("2", 2);
  console.log(new Array(...map).map(pairs => pairs[0])); -> ["1", "2"]
Tkoma
sumber
1

OK, mari kita sedikit lebih komprehensif dan mulai dengan apa Peta untuk mereka yang tidak tahu fitur ini dalam JavaScript ... MDN mengatakan:

Objek Peta menyimpan pasangan nilai kunci dan mengingat urutan penyisipan kunci.
Nilai apa pun (baik objek maupun nilai primitif) dapat digunakan sebagai kunci atau nilai.

Seperti yang Anda sebutkan, Anda dapat dengan mudah membuat turunan Peta menggunakan kata kunci baru ... Dalam kasus Anda:

let myMap = new Map().set('a', 1).set('b', 2);

Jadi mari kita lihat ...

Cara yang Anda sebutkan adalah cara yang OK untuk melakukannya, tetapi ya, ada cara yang lebih ringkas untuk melakukan itu ...

Peta memiliki banyak metode yang dapat Anda gunakan, seperti set()yang telah Anda gunakan untuk menetapkan nilai kunci ...

Salah satunya adalah keys()yang mengembalikan semua kunci ...

Dalam kasus Anda, itu akan kembali:

MapIterator {"a", "b"}

dan Anda dengan mudah mengubahnya menjadi Array menggunakan cara ES6 , seperti operator spread ...

const b = [...myMap.keys()];
Alireza
sumber