Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimanakah saya Boleh Mensiri dan Menyahseri Peta ES6 dengan JSON.stringify dan JSON.parse?

Bagaimanakah saya Boleh Mensiri dan Menyahseri Peta ES6 dengan JSON.stringify dan JSON.parse?

DDD
DDDasal
2024-11-23 15:28:17516semak imbas

How Can I Serialize and Deserialize ES6 Maps with JSON.stringify and JSON.parse?

JSON.stringify untuk Peta ES6

Apabila berhijrah daripada objek JavaScript ke Peta ES6, sokongan JSON.stringify menjadi penting. Artikel ini menangani cabaran mensiri Peta untuk penghantaran JSON.

Menggunakan JSON.stringify Replacer

JSON.stringify menawarkan hujah kedua, pengganti, yang boleh meningkatkan fungsinya . Tentukan fungsi pengganti yang mengendalikan objek Peta:

function replacer(key, value) {
  if(value instanceof Map) {
    return {
      dataType: 'Map',
      value: Array.from(value.entries()),
    };
  } else {
    return value;
  }
}

Deserialisasi dengan JSON.parse Reviver

Begitu juga, JSON.parse juga mempunyai argumen reviver untuk menyesuaikan penciptaan objek semasa penyahserikatan:

function reviver(key, value) {
  if(typeof value === 'object' && value !== null) {
    if (value.dataType === 'Map') {
      return new Map(value.value);
    }
  }
  return value;
}

Penggunaan

Untuk mensiri dan menyahsiri Peta ES6 menggunakan fungsi ini:

const originalValue = new Map([['a', 1]]);
const str = JSON.stringify(originalValue, replacer);
const newValue = JSON.parse(str, reviver);

console.log(originalValue, newValue);

Deep Nesting

Pengganti dan penyegar boleh mengendalikan bersarang dalam struktur data yang mengandungi tatasusunan, objek dan peta:

const originalValue = [
  new Map([['a', {
    b: {
      c: new Map([['d', 'text']])
    }
  }]])
];
const str = JSON.stringify(originalValue, replacer);
const newValue = JSON.parse(str, reviver);

console.log(originalValue, newValue);

Atas ialah kandungan terperinci Bagaimanakah saya Boleh Mensiri dan Menyahseri Peta ES6 dengan JSON.stringify dan JSON.parse?. 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