DOMQuad: Methode toJSON()
Baseline
Weitgehend verfügbar
Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit Januar 2020 browserübergreifend verfügbar.
Hinweis: Diese Funktion ist in Web Workers verfügbar.
Die Methode toJSON() der Schnittstelle DOMQuad gibt ein JSON-serialisierbares einfaches Objekt zurück, das das DOMQuad-Objekt darstellt.
Die Methode wird von JSON.stringify() automatisch aufgerufen, wenn bei der JSON-Serialisierung ein DOMQuad-Objekt vorkommt. Der serialisierte Wert kann anschließend mit der Funktion DOMQuad.fromQuad() innerhalb des Revivers von JSON.parse() deserialisiert werden.
Syntax
toJSON()
Parameter
Keine.
Rückgabewert
Ein JSON-serialisierbares einfaches Objekt mit den folgenden Eigenschaften:
Der Wert jeder Eigenschaft wird unverändert übernommen. Wenn das zurückgegebene Objekt an JSON.stringify() übergeben wird, werden die Eigenschaften p1, p2, p3 und p4 mit DOMPointReadOnly.toJSON() weiter serialisiert.
Beispiele
toJSON() direkt aufrufen
Dieses Beispiel erstellt ein DOMQuad-Objekt. Ein direkter Aufruf von toJSON() gibt ein einfaches Objekt zurück. Dessen Eigenschaften haben dieselben Werte wie die entsprechenden Eigenschaften des ursprünglichen Objekts.
const topLeft = new DOMPoint(window.screenX, window.screenY);
const topRight = new DOMPoint(
window.screenX + window.innerWidth,
window.screenY,
);
const bottomLeft = new DOMPoint(
window.screenX,
window.screenY + window.innerHeight,
);
const bottomRight = new DOMPoint(
window.screenX + window.innerWidth,
window.screenY + window.innerHeight,
);
const quad = new DOMQuad(topLeft, topRight, bottomRight, bottomLeft);
const json = quad.toJSON();
console.log(json); // A plain object
console.log(typeof json); // "object"
console.log(json.p1.x); // Same value as quad.p1.x
In einen JSON-String serialisieren
Das DOMQuad-Objekt aus dem vorherigen Beispiel wird mit JSON.stringify() serialisiert. Dabei wird die Methode toJSON() automatisch aufgerufen.
const quadJSON = JSON.stringify(quad);
console.log(quadJSON);
Für ein Fenster an den Bildschirmkoordinaten (0, 0) mit einer inneren Breite von 800 und einer inneren Höhe von 600 würde dabei ein JSON-String wie der folgende ausgegeben (zur besseren Lesbarkeit formatiert):
{
"p1": {
"x": 0,
"y": 0,
"z": 0,
"w": 1
},
"p2": {
"x": 800,
"y": 0,
"z": 0,
"w": 1
},
"p3": {
"x": 800,
"y": 600,
"z": 0,
"w": 1
},
"p4": {
"x": 0,
"y": 600,
"z": 0,
"w": 1
}
}
Spezifikationen
| Spezifikation |
|---|
| Geometry Interfaces Module Level 1 # dom-domquad-tojson |