Rumah >hujung hadapan web >tutorial js >'Peta' yang sedikit lebih baik boleh membawa anda ke sana dengan lebih mudah...

'Peta' yang sedikit lebih baik boleh membawa anda ke sana dengan lebih mudah...

Barbara Streisand
Barbara Streisandasal
2024-12-09 08:33:12370semak imbas

A slightly better

Dalam JavaScript Peta ialah binaan dalam kelas yang sangat berguna yang mencipta carian O(1) antara kunci dan nilai.

const myMap = new Map()

for(const file of files) {
    const [,extension] = file.name.split(".")
    if(!myMap.has(extension)) {
        myMap.set(extension, [])
    }
    myMap.get(extension).push(file)
}

Anda boleh menggunakan Peta untuk semua jenis perkara yang mungkin anda kerap lakukan:

  • Membuat senarai berkumpulan data, seperti contoh di atas mengumpulkan mengikut sambungan fail

  • Mengagregatkan data, seperti mengira atau menjumlahkan nilai merentas julat kunci

// 1) Counting occurrences
const items = ['apple','apple','orange','banana','apple'];
const counts = new Map();
for (const item of items) {
  counts.set(item, (counts.get(item) || 0) + 1);
}
  • Mencipta carian pantas untuk digunakan dalam langkah seterusnya
const users = [
  {id:1,name:'A',role:'admin'},
  {id:2,name:'B',role:'user'},
  {id:3,name:'C',role:'user'}
];
const userMap = new Map();
for (const u of users) {
  userMap.set(u.id, u);
}

Peta lebih disukai daripada menggunakan objek ringkas ({}) atas beberapa sebab, selagi anda tidak perlu menyimpan hasilnya menggunakan stringify:

  • Ia boleh mengambil kunci yang bukan rentetan
  • Ia lebih laju sedikit daripada Objek walaupun anda menggunakan kekunci rentetan

Mungkin terdapat banyak masalah dan kebimbangan bercampur-campur walaupun, jika objek yang anda simpan dalam peta memerlukan pembinaan, iaitu apa-apa sahaja daripada tatasusunan mudah kepada objek kompleks, ini perlu diselangi dengan kod yang menggunakannya .

const map = new Map()

for(const item of items) {
   if(!map.has(item.type)) {
       const newType = new Type(item.type, getInfoForType(item.type))
       map.set(item.type, newType)
   }
   map.get(item.type).doSomething(item)

}

Ini "boleh" ok, tetapi menjadi lebih sukar untuk mengekalkan KERING jika anda perlu mengemas kini atau memulakan nilai di berbilang tempat.

Atas sebab ini saya menggunakan kelas MapPlus, yang merupakan lanjutan kepada Map yang menyediakan fungsi pemula kunci yang hilang yang boleh dibekalkan kepada pembina atau sebagai parameter kedua untuk mendapatkan jika pemula memang memerlukan maklumat konteks di luar sekadar kuncinya.

class MapPlus extends Map {
    constructor(missingFunction) {
        super()
        this.missingFunction = missingFunction
    }

    get(key, createIfMissing = this.missingFunction) {
        let result = super.get(key)
        if (!result && createIfMissing) {
            result = createIfMissing(key)
            if (result && result.then) {
                const promise = result.then((value) => {
                    super.set(key, value)
                    return value
                })
                super.set(key, promise)
            } else {
                super.set(key, result)
            }
        }
        return result
    }
}

Dengan ini anda boleh melakukan perkara seperti:

const map = new MapPlus(()=>[])

for(const item of items) {
    map.get(item.type).push(item)
}

Seolah-olah kunci hilang ia hanya akan membuat tatasusunan kosong.

Saya selalunya memerlukan dua tahap ini supaya saya akan menetapkan peta seperti ini:

const map = new MapPlus(()=>new MapPlus(()=>[]))
for(const item of items) {
   map.get(item.type).get(item.subType).push(item)
}

Fungsi pembina mendapat kunci yang digunakan supaya kita juga boleh melakukan:

const map = new MapPlus((type)=>new Type(type, getInfoForType(type))

for(const item of items) {
    map.get(item.type).doSomething(item)
}

Atas ialah kandungan terperinci 'Peta' yang sedikit lebih baik boleh membawa anda ke sana dengan lebih mudah.... Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn