createSignal

Creates a reactive signal that stores a value and notifies subscribers when it changes.

Signature

function createSignal<T>(initialValue: T): [Signal<T>, (val: T) => void];

Parameters

  • initialValue: T - The initial value for the signal

Returns

A tuple containing:

  • Signal<T> - A getter function that returns the current value

  • (val: T) => void - A setter function that updates the value

Type Definition

type Signal<T = unknown> = () => T;

Example

const [count, setCount] = createSignal(0);

// Read the signal
console.log(count()); // 0

// Update the signal
setCount(42);
console.log(count()); // 42

// Signals with different types
const [name, setName] = createSignal("John Doe");
const [users, setUsers] = createSignal<User[]>([]);
const [loading, setLoading] = createSignal(false);

Advanced Usage

// Working with objects
const [user, setUser] = createSignal({ name: "John Doe", age: 42 });

// Update object properties
setUser({ ...user(), age: 21 });

// Working with arrays
const [fruits, setFruits] = createSignal(["Apple", "Banana"]);

// Add item
setFruits([...fruits(), "Cherry"]);

// Remove item
setFruits(fruits().filter((fruit) => fruit !== "Banana"));

Behavior

  • Uses Object.is() for equality comparison

  • Only notifies subscribers when the value actually changes

  • Automatically tracks dependencies when accessed within effects or computed values

  • Synchronous updates - changes are immediately available

Last updated