Teachnique
      CourseRoadmaps
      Login

      OverviewPlacementSyntaxHello WorldConsole.log()CommentsVariableslet StatementConstantsData TypesType ConversionsStrict ModeReserved Keywords

      OperatorsArithmetic OperatorsComparison OperatorsLogical OperatorsBitwise OperatorsAssignment OperatorsConditional Operatorstypeof OperatorNullish Coalescing OperatorDelete OperatorComma OperatorGrouping OperatorYield OperatorSpread OperatorExponentiation OperatorOperator Precedence

      If...ElseWhile LoopsFor LoopFor...in LoopFor...of LoopLoop ControlBreak StatementContinue StatementSwitch CaseUser Defined Iterators

      FunctionsFunction ExpressionsFunction ParametersDefault ParametersFunction() ConstructorFunction HoistingArrow FunctionsFunction InvocationFunction call() MethodFunction apply() MethodFunction bind() MethodClosuresVariable ScopeGlobal VariablesSmart Function Parameters

      NumberBooleanStringsArraysDateMathRegExpSymbolSetsWeakSetMapsWeakMapIterablesReflectTypedArrayTempate LiteralsTagged Templates

      Objects OverviewClassesObject PropertiesObject MethodsStatic MethodsDisplay ObjectsObject AccessorsObject ConstructorsNative PrototypesES5 Object MethodsEncapsulationInheritanceAbstractionPolymorphismDestructuring AssignmentObject DestructuringArray DestructuringNested DestructuringOptional ChainingGlobal ObjectMixinsProxies

      HistoryVersionsES5ES6ECMAScript 2016ECMAScript 2017ECMAScript 2018ECMAScript 2019ECMAScript 2020ECMAScript 2021ECMAScript 2022

      CookiesCookie AttributesDeleting Cookies

      Browser Object ModelWindow ObjectDocument ObjectScreen ObjectHistory ObjectNavigator ObjectLocation ObjectConsole Object

      Web APIHistory APIStorage APIForms APIWorker APIFetch APIGeolocation API

      EventsDOM Events

      Feedback

      Submit request if you have any questions.

      Course
      WeakMap

      JavaScript Tutorial

      This JavaScript tutorial is crafted for beginners to introduce them to the basics and advanced concepts of JavaScript. By the end of this guide, you'll reach a proficiency level that sets the stage for further growth. Aimed at empowering you to progress towards becoming a world-class software developer, this tutorial paves the way for a successful career in web development and beyond.

      WeakMap Object

      A WeakMap object in JavaScript is a collection of key-value pairs where the keys are weakly referenced. The WeakMap keys must be objects or non-registered symbols, and values are of any arbitrary JavaScript type.
      The WeakMap is similar to the JavaScript Map. The main difference between the WeakMap and Map data structure is that the WeakMap data structure uses the objects as a key only, but Map can use other data types also as a key.
      If you use the value of another data type as a key of a WeakMap except the object, it gives the Types error.

      Syntax

      You can follow the syntax below to use the WeakMap in JavaScript
      const weak_map = new WeakMap();
      In the above syntax, we used the 'new' keyword with a WeakMap() function to create a new instance of the WeakMap.
      The WeakMap provides methods to set, get, and delete the key-value pairs from the WeakMap. Here, we have listed the properties and methods of the WeakMap.

      WeakMap Properties

      Here is a list of the properties of WeakMap and their description
      Sr.No.
      Name & Description
      1
      AI
      To get a constructor function of a WeakMap.

      WeakMap Methods

      Here is a list of the methods associated with WeakMap object and their description
      Sr.No.
      Name & Description
      1
      AI
      To delete a single key-value pair from the WeakMap.
      2
      AI
      To get values related to the specific object.
      3
      AI
      Check whether a particular object exists as a key exists in the WeakMap.
      4
      AI
      To insert the key-value pair in the WeakMap.

      WeakMap Constructor()

      Following is the WeakMap constructor in JavaScript
      Sr.No.
      Name & Description
      1
      WeakMap()
      To create a WeakMap object.

      Examples

      Example: Inserting key-value pair to the WeakMap

      In the example below, we have defined the WeakMap using the constructor function. After that, we used the set() method to set the laptop object as a key and its price as a value.
      At last, we used the get() method to get the value related to the 'laptop' key.
      <html>
      <body>
         <p id = "output">The laptop price is: </p>
         <script>
            const wm = new WeakMap();
            const laptop = {
               brand: "HP",
               model: "Pavilion",
            }
            wm.set(laptop, 100000);
            document.getElementById("output").innerHTML += wm.get(laptop);
         </script>
      </body>
      </html>

      Output

      The laptop price is: 100000
      If we execute the program, it returns the value related to the "laptop" key, i.e. "10000".

      Example: Deleting key-value pair from the WeakMap

      In the example below, we have inserted the key-value pair in the WeakMap using the set() mehtod.
      After that, we used the delete() method to delete the key-value pair from the WeakMap. After deleting the key-value pair when you access it, the WeakMap returns undefined, as you can see in the output.
      Note − WeakMaps are not iterable in JavaScript.
      <html>
      <body>
         <div id = "output1">The laptop price is:  </div>
         <div id = "output2">The laptop price after deletion is:  </div>
         <script>
            const wm = new WeakMap();
            const laptop = {
               brand: "HP",
               model: "Pavilion",
            }
            wm.set(laptop, 100000);
            document.getElementById("output1").innerHTML += wm.get(laptop);
      
            wm.delete(laptop);
            document.getElementById("output2").innerHTML += wm.get(laptop);
         </script>
      </body>
      </html>

      Output

      The laptop price is: 100000
      The laptop price after deletion is: undefined
      It returns "undefined" as the key-value is deleted from the WeakMap.
      WeakMaps are not iterable in JavaScript