Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Maplike and Setlike objects in Map and Set #27160

Merged
merged 14 commits into from
Jun 16, 2023
Merged
Show file tree
Hide file tree
Changes from 5 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 7 additions & 3 deletions files/en-us/web/api/audioparammap/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,11 +7,11 @@ browser-compat: api.AudioParamMap

{{APIRef("Web Audio API")}}

The Web Audio API interface **`AudioParamMap`** represents a set of multiple audio parameters, each described as a mapping of a string identifying the parameter to the {{domxref("AudioParam")}} object representing its value.
The **`AudioParamMap`** interface of the [Web Audio API](/en-US/docs/Web/API/Web_Audio_API) represents an iterable and read-only set of multiple audio parameters.

## Instance properties
`AudioParamMap` is a read-only [`Map`-like object](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map#map-like_objects), in which each key is the name string for a parameter, and the corresponding value is an {{domxref("AudioParam")}} containing the value of that parameter.
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved

The `AudioParamMap` object is accessed as a {{jsxref("Map")}} in which each parameter is identified by a name string which is mapped to an `AudioParam` containing the value of that parameter. In addition, there are the following properties available:
## Instance properties

- {{domxref("AudioParamMap.size", "size")}}
- : ?
Expand All @@ -29,6 +29,10 @@ The `AudioParamMap` object is accessed as a {{jsxref("Map")}} in which each para
- {{domxref("AudioParamMap.values", "values()")}}
- : ?

## Specifications

{{Specifications}}

## Browser compatibility

{{Compat}}
3 changes: 2 additions & 1 deletion files/en-us/web/api/customstateset/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,8 +15,9 @@ The **`CustomStateSet`** interface of the [Document Object Model](/en-US/docs/We

An HTML form element, such as a checkbox has different _states_, "checked" and "unchecked". Likewise, developers creating custom elements need to assign possible states to these elements. The `CustomStateList` allows these states to be stored, and accessed from the custom element.

An instance of `CustomStateList` is returned by {{domxref("ElementInternals.states")}}. The `CustomStateList` object is described as _setlike_, and therefore the methods behave in a similar manner to those on a {{jsxref("Set")}}.
An instance of `CustomStateList` is returned by {{domxref("ElementInternals.states")}}.

**`CustomStateList`** is a [`Set`-like object](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set#set-like_objects) that can hold an ordered set of state values.
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved
Each value stored in a `CustomStateList` is a `<dashed-ident>`, in the format `--mystate`.

### Interaction with CSS
Expand Down
4 changes: 2 additions & 2 deletions files/en-us/web/api/eventcounts/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,9 @@ browser-compat: api.EventCounts

{{APIRef("Performance API")}}

The **`EventCounts`** interface is a read-only map where the keys are event types and the values are the number of events that have been dispatched for that event type.
The **`EventCounts`** interface of the [Performance API](/en-US/docs/Web/API/Performance_API) provides the number of events that have been dispatched for each event type.

As a read-only map, `EventCounts` is similar to a {{jsxref("Map")}}, however, it doesn't implement the `clear()`, `delete()`, and `set()` methods.
`EventCounts` is a read-only [`Map`-like object](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map#map-like_objects), in which each key is the name string for an event type, and the corresponding value is an integer indicating the number of events that have been dispatched for that event type.
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved

## Constructor

Expand Down
2 changes: 2 additions & 0 deletions files/en-us/web/api/fontfaceset/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,8 @@ browser-compat: api.FontFaceSet

The **`FontFaceSet`** interface of the [CSS Font Loading API](/en-US/docs/Web/API/CSS_Font_Loading_API) manages the loading of font-faces and querying of their download status.

A **`FontFaceSet`** is a [`Set`-like object](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set#set-like_objects) that can hold an ordered set of {{domxref("FontFace")}} objects.
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved

This property is available as {{domxref("Document.fonts")}}, or `self.fonts` in [web workers](/en-US/docs/Web/API/Web_Workers_API).

{{InheritanceDiagram}}
Expand Down
6 changes: 3 additions & 3 deletions files/en-us/web/api/gpusupportedfeatures/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ browser-compat: api.GPUSupportedFeatures

{{APIRef("WebGPU API")}}{{SeeCompatTable}}

The **`GPUSupportedFeatures`** interface of the {{domxref("WebGPU API", "WebGPU API", "", "nocode")}} is a [setlike](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set) object that describes additional functionality supported by a {{domxref("GPUAdapter")}}.
The **`GPUSupportedFeatures`** interface of the {{domxref("WebGPU API", "WebGPU API", "", "nocode")}} is a [`Set`-like object](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set#set-like_objects) that describes additional functionality supported by a {{domxref("GPUAdapter")}}.

The `GPUSupportedFeatures` object for the current adapter is accessed via the {{domxref("GPUAdapter.features")}} property.

Expand All @@ -28,14 +28,14 @@ We have not listed the exact set of additional features available to be used in

## Instance properties

The following properties are available to all read-only [setlike](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set) objects (the below links are to the {{jsxref("Set")}} global object reference pages).
The following properties are available to all read-only [`Set`-like](/en-US/docs/Glossary/Setlike_object) objects (the below links are to the {{jsxref("Set")}} global object reference pages).
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved

- {{jsxref("Set.prototype.size", "size")}} {{Experimental_Inline}}
- : Returns the number of values in the set.

## Instance methods

The following methods are available to all read-only [setlike](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set) objects (the below links are to the {{jsxref("Set")}} global object reference pages).
The following methods are available to all read-only [`Set`-like](/en-US/docs/Glossary/Setlike_object) objects (the below links are to the {{jsxref("Set")}} global object reference pages).
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved

- {{jsxref("Set.prototype.has()", "has()")}} {{Experimental_Inline}}
- : Returns a boolean asserting whether an element is present with the given value in the set or not.
Expand Down
4 changes: 2 additions & 2 deletions files/en-us/web/api/highlight/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,11 +9,11 @@ browser-compat: api.Highlight

{{APIRef("CSS Custom Highlight API")}}{{SeeCompatTable}}

The **`Highlight`** interface is used to represent a collection of {{domxref("Range")}} instances to be styled using the {{domxref("css_custom_highlight_api", "CSS Custom Highlight API", "", "nocode")}}.
The **`Highlight`** interface of the [CSS Custom Highlight API](/en-US/docs/Web/API/CSS_Custom_Highlight_API) is used to represent a collection of {{domxref("Range")}} instances to be styled using the API.

To style arbitrary ranges in a page, instantiate a new `Highlight` object, add one or more `Range` objects to it, and register it using the {{domxref("HighlightRegistry")}}.

A single `Highlight` object can hold one or more `Range` objects and behaves like a {{jsxref("Set")}}.
A single `Highlight` object is [`Set`-like object](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set#set-like_objects) that can hold one or more `Range` objects.
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved

{{InheritanceDiagram}}

Expand Down
5 changes: 4 additions & 1 deletion files/en-us/web/api/highlightregistry/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,10 @@ browser-compat: api.HighlightRegistry

{{APIRef("CSS Custom Highlight API")}}{{SeeCompatTable}}

The **`HighlightRegistry`** interface, accessed via {{domxref("CSS.highlights")}}, is a {{jsxref("Map")}}-like object used to register {{domxref("Highlight")}} objects to be styled using the {{domxref("css_custom_highlight_api", "CSS Custom Highlight API", "", "nocode")}}.
The **`HighlightRegistry`** interface of the [CSS Custom Highlight API](/en-US/docs/Web/API/CSS_Custom_Highlight_API) is used to register {{domxref("Highlight")}} objects to be styled using the API.
It is accessed via {{domxref("CSS.highlights")}}.

`HighlightRegistry` is a [`Map`-like (or "maplike")](/en-US/docs/Glossary/Maplike_object) object, in which each key is the name string for a custom highlight, and the corresponding value is the associated {{domxref("Highlight")}} object.
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved

{{InheritanceDiagram}}

Expand Down
4 changes: 3 additions & 1 deletion files/en-us/web/api/keyboardlayoutmap/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,9 @@ browser-compat: api.KeyboardLayoutMap

{{SeeCompatTable}}{{APIRef("Keyboard API")}}

The **`KeyboardLayoutMap`** interface of the [Keyboard API](/en-US/docs/Web/API/Keyboard_API) is a map-like object with functions for retrieving the string associated with specific physical keys.
The **`KeyboardLayoutMap`** interface of the [Keyboard API](/en-US/docs/Web/API/Keyboard_API) is a read-only object with functions for retrieving the string associated with specific physical keys.

`KeyboardLayoutMap` is a read-only [`Map`-like object](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map#map-like_objects), in which each key is a string identifying the unique physical key on the keyboard (a "key code"), and the corresponding value is the associated key attribute value (which may be affected by the keyboard layout, and so on).
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved

A list of valid keys is found in the [UI Events KeyboardEvent code Values](https://www.w3.org/TR/uievents-code/#key-alphanumeric-writing-system) specification.

Expand Down
4 changes: 3 additions & 1 deletion files/en-us/web/api/midiinputmap/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,9 @@ browser-compat: api.MIDIInputMap

{{APIRef("Web MIDI API")}}

The **`MIDIInputMap`** read-only interface of the [Web MIDI API](/en-US/docs/Web/API/Web_MIDI_API) provides a {{jsxref('Map')}}-like interface to the currently available MIDI input ports. Though it works generally like a map, because it is read-only it does **not** contain `clear()`, `delete()`, or `set()` functions.
The **`MIDIInputMap`** read-only interface of the [Web MIDI API](/en-US/docs/Web/API/Web_MIDI_API) provides the set of MIDI input ports that are currently available.

`MIDIInputMap` is a read-only [`Map`-like object](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map#map-like_objects), in which each key is the ID string for MIDI input, and the associated value is the corresponding {{domxref("MIDIInput")}} object.
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved

## Specifications

Expand Down
4 changes: 3 additions & 1 deletion files/en-us/web/api/midioutputmap/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,9 @@ browser-compat: api.MIDIOutputMap

{{APIRef("Web MIDI API")}}

The **`MIDIOutputMap`** read-only interface of the [Web MIDI API](/en-US/docs/Web/API/Web_MIDI_API) provides a {{jsxref('Map')}}-like interface to the currently available MIDI output ports. Although it works like a map, because it is read-only, it does **not** contain `clear()`, `delete()`, or `set()` functions.
The **`MIDIOutputMap`** read-only interface of the [Web MIDI API](/en-US/docs/Web/API/Web_MIDI_API) provides the set of MIDI output ports that are currently available.

`MIDIOutputMap` is a read-only [`Map`-like object](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map#map-like_objects), in which each key is the ID string for MIDI output, and the associated value is the corresponding {{domxref("MIDIOutput")}} object.
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved

## Specifications

Expand Down
2 changes: 1 addition & 1 deletion files/en-us/web/api/rtcstatsreport/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ browser-compat: api.RTCStatsReport

The **`RTCStatsReport`** interface of the [WebRTC API](/en-US/docs/Web/API/WebRTC_API) provides a statistics report for a {{domxref("RTCPeerConnection")}}, {{domxref("RTCRtpSender")}}, or {{domxref("RTCRtpReceiver")}}.

The report is a read-only [`Map`-like](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map) object, in which each key is an identifier for an object for which statistics are being reported, and the corresponding value is a dictionary object providing the statistics.
The report is a read-only [`Map`-like object](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map#map-like_objects), in which each key is an identifier for an object for which statistics are being reported, and the corresponding value is a dictionary object providing the statistics.
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved

## Instance properties

Expand Down
2 changes: 1 addition & 1 deletion files/en-us/web/api/xranchorset/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ browser-compat: api.XRAnchorSet

{{APIRef("WebXR Device API")}}{{SeeCompatTable}}

The **`XRAnchorSet`** interface exposes a collection of anchors. It is returned by {{domxref("XRFrame.trackedAnchors")}} and is a {{jsxref("Set")}}-like object.
The **`XRAnchorSet`** interface exposes a collection of anchors. It is returned by {{domxref("XRFrame.trackedAnchors")}} and is a [`Set`-like object](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set#set-like_objects) object.
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved

## Instance properties

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -269,6 +269,40 @@ contacts.delete("Jessie"); // true
console.log(contacts.size); // 1
```

### Map-like objects

**`Map`-like objects** (or "maplike objects") are browser-specific objects that behave in many ways like a `Map`.
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved

Just like `Map` they are ordered, and entries are iterated in the same sequence that they were added to the object, using all of the same looping constructs.
`Map`-like objects also share some of the same properties and methods.
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved
However unlike `Map` they only allow specific predefined types for the keys and values of each entry.

The allowed types are set in the specification IDL definition.
For example, {{domxref("RTCStatsReport")}} is a `Map`-like object that must use strings for keys and any object as the value.
Josh-Cena marked this conversation as resolved.
Show resolved Hide resolved
This is defined in the specification IDL below:

```webidl
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved
interface RTCStatsReport {
readonly maplike<DOMString, object>;
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved
};
```

`Map`-like objects are either read-only or read-writable (see the `readonly` keyword in the IDL above).

- Read-only `Map`-like objects have the property [`size`](#map.prototype.size), and the methods: [`entries()`](#map.prototype.entries), [`forEach()`](#map.prototype.foreach), [`get()`](#map.prototype.get), [`has()`](#map.prototype.has), [`keys()`](#map.prototype.keys), [`values()`](#map.prototype.values), and [`@@iterator`](#map.prototypeiterator).
- Writeable `Map`-like objects additionally have the methods: [`clear()`](#map.prototype.clear), [`delete()`](#map.prototype.delete), and [`set()`](#map.prototype.set).

The methods and properties have the same behaviour as the equivalent entities in `Map`, except for the restriction on the types of the keys and values.
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved

The following items are examples of read-only `Map`-like objects:
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved

- {{domxref("AudioParamMap")}}
- {{domxref("RTCStatsReport")}}
- {{domxref("EventCounts")}}
- {{domxref("KeyboardLayoutMap")}}
- {{domxref("MIDIInputMap")}}
- {{domxref("MIDIOutputMap")}}

## Constructor

- {{jsxref("Map/Map", "Map()")}}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,42 @@ Value equality is based on the [SameValueZero](/en-US/docs/Web/JavaScript/Equali

The [`has`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/has) method checks if a value is in the set, using an approach that is, on average, quicker than testing most of the elements that have previously been added to the set. In particular, it is, on average, faster than the [`Array.prototype.includes`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes) method when an array has a `length` equal to a set's `size`.

### Set-like objects
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved

**`Set`-like objects** (or "setlike objects") are browser-specific objects that behave in many ways like a [`Set`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set).

Just like `Set` they are ordered, and entries are iterated in the same sequence that they were added to the object, using all of the same looping constructs.
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved
`Set`-like objects also share some of the same properties and methods.
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved
However unlike `Set` they only allow a specific predefined type for each entry.

The allowed types are set in the specification IDL definition.
For example, {{domxref("GPUSupportedFeatures")}} is a `Set`-like object that must use strings as the key/value.
This is defined in the specification IDL below:

```webidl
interface GPUSupportedFeatures {
readonly setlike<DOMString>;
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved
};
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved
```

`Set`-like objects are either read-only or read-writable (see the `readonly` keyword in the IDL above).

- Read-only `Set`-like objects have the property [`size`](#map.prototype.size), and the methods: [`entries()`](#map.prototype.entries), [`forEach()`](#map.prototype.foreach), [`has()`](#map.prototype.has), [`keys()`](#map.prototype.keys), [`values()`](#map.prototype.values), and [`@@iterator`](#map.prototypeiterator).
- Writeable `Map`-like objects additionally have the methods: [`clear()`](#map.prototype.clear), [`delete()`](#map.prototype.delete), and [`add()`](#map.prototype.add).
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved

The methods and properties have the same behaviour as the equivalent entities in `Set`, except for the restriction on the types of the entry.
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved

The following interfaces are read-only `Set`-like objects:
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved

- {{domxref("GPUSupportedFeatures")}}
- {{domxref("XRAnchorSet")}}

The following interfaces are writable `Set`-like objects:
hamishwillee marked this conversation as resolved.
Show resolved Hide resolved

- {{domxref("CustomStateSet")}}
- {{domxref("FontFaceSet")}}
- {{domxref("Highlight")}}

## Constructor

- {{jsxref("Set/Set", "Set()")}}
Expand Down