javascript / beginner
Snippet
Finden eines bestimmten Objekts in einem Array mit der Find-Methode
Die Methode Array.prototype.find durchsucht ein Array und gibt das erste Element zurück, das die angegebene Testfunktion erfüllt. In Svelte stellt die Kombination von find mit einer reaktiven Deklaration ($:) sicher, dass das ausgewählte Element automatisch neu berechnet wird, sobald sich die Ziel-ID oder die Liste ändert.
snippet.js
javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<script>let items = [{ id: 1, name: 'Apple', inStock: false },{ id: 2, name: 'Banana', inStock: true },{ id: 3, name: 'Cherry', inStock: true }];let selectedId = 2;$: selectedItem = items.find(item => item.id === selectedId);</script><div>{#if selectedItem}<p>Selected: {selectedItem.name} ({selectedItem.inStock ? 'Available' : 'Out of Stock'})</p>{:else}<p>No item found.</p>{/if}</div>
svelte
Erklärung
1
let items = [
Deklariert ein Array von Produktobjekten mit Identifikatoren, Namen und Verfügbarkeitsstatus.
2
$: selectedItem = items.find(item => item.id === selectedId);
Verwendet find, um das passende Objekt anhand von selectedId zu finden, und aktualisiert dies reaktiv.
3
{#if selectedItem}
Prüft, ob ein passendes Objekt gefunden wurde, bevor auf dessen Eigenschaften zugegriffen wird.