JavaScript 中 Map 和 WeakMap 的区别是什么?
Map 和 WeakMap 的区别
Map 和 WeakMap 的功能机制相同,但它们之间存在一些细微差别。
1) WeakMap 仅接受对象作为键,而Map 除了对象之外,还接受基本数据类型,例如字符串、数字等。
2) 如果没有对充当键的对象的引用,WeakMap 对象不会阻止垃圾回收。因此,在WeakMap 中没有方法可以检索键,而在Map 中则存在诸如 Map.prototype.keys() 之类的方法来获取键。
3) WeakMap 中不存在 size 属性。
Map
它用于将键与值关联起来,无论数据类型如何,例如字符串、数字、对象等。
示例
<html> <body> <script> // Creates a new Map object var map = new Map(); // Defines an object that will be used a key in the ma var objKey = {name: 'tutorialspoint'}; document.write("</br>"); // Adds a new element having a String as its key and a String as its value map.set('first', 'a'); document.write("</br>"); // Adds a new element having a Number as its key and an Array as its value map.set(3, ['c']); document.write("</br>"); // Adds a new element having an Object as its key and a Number as its value map.set(objKey, 3); // Adds a new element having an Array as its key and a String as its value map.set(['add', 'mapping'], 'd'); // Checks whether an element having a key of "2" exists in the map. document.write(map.has(2)); document.write("</br>"); // Checks whether an element having a key of "first" exists in the map. document.write(map.has('first')); document.write("</br>"); // Retrieves the element having key of "first". Prints "a" document.write(map.get('first')); document.write("</br>"); // Retrieves the element having as a key the value of objKey. document.write(map.get(objKey)); document.write("</br>"); // Retrieves the element having key of "empty". Prints "undefined" document.write(map.get('empty')); document.write("</br>"); // Retrieves the map size. Prints "4" document.write(map.size); document.write("</br>"); // deletes all the value map.clear(); document.write(map.size); </script> </body> </html>
输出
false true a 3 undefined 4 0
WeakMap
在下面的示例中,我们可以发现WeakMap 仅接受对象,而不接受任何基本值(字符串、数字)。
示例
<html> <body> <script> // Creates a new WeakMap object var weakMap = new WeakMap(); // Defines an object that will be used a key in the map var obj4 = {d: 4}; // Defines another object that will be used a key in the map var obj5 = {e: 5}; // Adds a new element having an Object as its key and a String as its value weakMap.set(obj4, 'fourth'); // Adds a new element having an Object as its key and a String as its value weakMap.set(obj5, 'fifth'); // Adds a new element having a Function as its key and a Number as its value weakMap.set(function(){}, 7); // Checks whether an element having as its key the value of objKey4 exists in the weak map. document.write(weakMap.has(obj4)); document.write("</br>"); // Retrieve the value of element associated with the key having the value of objKey4. Prints "first" document.write(weakMap.get(obj4)); document.write("</br>"); // Deletes the element having key of objKey4. Prints "true" document.write(weakMap.delete(obj4)); document.write("</br>"); // Deletes all the elements of the weak map weakMap.clear(); </script> </body> </html>
输出
true fourth true
广告