Array HelpersAPI reference for Array Helpers in Semantic UI's reactivity systemlistAPI Reference
Categories

Array Helpers

Mutate a signal holding an array and notify dependents in one call. These helpers change the stored array in place, so they work under the default safety: 'reference' without needing a fresh reference.

Unlike set, most of these helpers skip the equality check and notify dependents unconditionally. The exception is setIndex, which notifies only when the indexed value changes.

Adding

push

signal.push(...items);

Adds one or more elements to the end of the array.

Parameters

Name Type Description
…items any Elements to append

Usage

const fruits = signal(['apple']);
fruits.push('banana'); // ['apple', 'banana']
fruits.push('orange', 'grape'); // ['apple', 'banana', 'orange', 'grape']

Example

unshift

signal.unshift(...items);

Adds one or more elements to the beginning of the array.

Parameters

Name Type Description
…items any Elements to prepend

Usage

const numbers = signal([3]);
numbers.unshift(1, 2); // [1, 2, 3]

Example

splice

signal.splice(start, deleteCount, ...items);

Removes or replaces existing elements and inserts new ones, matching Array.prototype.splice.

Parameters

Name Type Description
start number Index at which to start changing the array
deleteCount number Number of elements to remove. Optional
…items any Elements to insert. Optional

Usage

const colors = signal(['red', 'green', 'blue']);
colors.splice(1, 1, 'yellow'); // ['red', 'yellow', 'blue']

Example

Indexing

setIndex

signal.setIndex(index, value);

Sets the value at a specific index. Notifies dependents only when the value differs from the current one by ===.

Parameters

Name Type Description
index number Index to write
value any Value to store at the index

Usage

const items = signal(['a', 'b', 'c']);
items.setIndex(1, 'x'); // ['a', 'x', 'c']

Example

removeIndex

signal.removeIndex(index);

Removes the element at a specific index.

Parameters

Name Type Description
index number Index of the element to remove

Usage

const letters = signal(['a', 'b', 'c']);
letters.removeIndex(1); // ['a', 'c']

Example

getIndex

signal.getIndex(index);

Reads the element at a specific index and subscribes the running reaction, like get.

Parameters

Name Type Description
index number Index of the element to read

Returns

The element at index.

Example

Transforming

map

signal.map(callback);

Replaces each element with the callback’s return value, in place. Unlike Array.prototype.map this writes back into the signal rather than returning a new array.

Parameters

Name Type Description
callback function Receives (value, index, array), returns the replacement element

Usage

const numbers = signal([1, 2, 3]);
numbers.map(n => n * 2); // [2, 4, 6]

Example

filter

signal.filter(predicate);

Keeps only the elements that pass the predicate, in place. Unlike Array.prototype.filter this narrows the stored array rather than returning a new one.

Parameters

Name Type Description
predicate function Receives (value, index, array), returns whether to keep the element

Usage

const numbers = signal([1, 2, 3, 4, 5]);
numbers.filter(n => n % 2 === 0); // [2, 4]

Example

Previous
Boolean Helpers
Next
Collection Helpers