Lesson: 13 | Maps

HTML

<template>
</template>

Java Script

import { LightningElement } from 'lwc';

export default class MapExample extends LightningElement {
  // Define a map with some key-value pairs
  myMap = new Map([
    ['apple', 'red'],
    ['banana', 'yellow'],
    ['grape', 'purple'],
  ]);

  // Add a new key-value pair to the map
  handleAdd() {
    this.myMap.set('orange', 'orange');
  }

  // Remove a key-value pair from the map
  handleRemove() {
    this.myMap.delete('banana');
  }

  // Get the value associated with a specific key
  handleGetValue() {
    const key = 'grape';
    const value = this.myMap.get(key);
    console.log(`The color of ${key} is ${value}`);
  }

  // Get all keys in the map
  handleGetKeys() {
    const keys = this.myMap.keys();
    console.log('Keys:', Array.from(keys));
  }

  // Get all values in the map
  handleGetValues() {
    const values = this.myMap.values();
    console.log('Values:', Array.from(values));
  }

  connectedCallback(){
    this.handleGetValues()
  }
}

Prev You need to login to have access to the quizzes. Next

Mastered by 10 users.

Lightning Web Components

A. Component Reference (27 lessons)

B. Lightning Web Components | Utilities (11 lessons)

C. Lightning Web Component Guide (41 lessons)

D. Java Script Methods for LWC (23 lessons)

E. HTML (18 lessons)

F. JavaScript (19 lessons)

Go to top

Login to your account

Lesson: 13 | Maps

HTML

Lightning Web Components