import { AnyCollection } from '@vitarx/utils'; import { AnyFunction } from '@vitarx/utils'; import { AnyObject } from '@vitarx/utils'; import { AnyRecord } from '@vitarx/utils'; import { DeepReadonly } from '@vitarx/utils'; import { VoidCallback } from '@vitarx/utils'; /** * 向当前作用域添加一个副作用函数 * @param effect - 要添加的副作用函数,类型为EffectLike */ export declare const addToActiveScope: (effect: DisposableEffect) => void; /** * 绑定调试钩子的函数 * @param effect - 响应式效果的句柄 * @param debuggerOptions - 调试器的钩子对象,包含onTrack和onTrigger方法 */ export declare function bindDebuggerOptions(effect: EffectRunner, debuggerOptions: DebuggerOptions): void; /** * 清空所有队列和状态 * * 警告:此方法会清除所有待执行任务,仅在特定场景(如测试或重置)中使用 */ export declare function clearAllJobs(): void; /** * 清除 Effect 依赖链 */ export declare function clearEffectLinks(effect: EffectRunner): void; /** * 清除 Signal 依赖链 */ export declare function clearSignalLinks(signal: Signal): void; /** * 比较函数类型 * * 用于自定义值比较逻辑的函数类型。 * * @param value1 - 第一个值 * @param value2 - 第二个值 * @returns {boolean} 如果两个值相等返回 true,否则返回 false */ export declare type CompareFunction = (value1: any, value2: any) => boolean; /** * # 计算属性 * * 计算属性是一种特殊的响应式数据,它的值由一个getter函数计算得出。 * 当依赖的响应式数据发生变化时,计算属性会自动重新计算并更新其值。 * * @template T - 计算结果的类型 * @implements {Ref} - 实现RefSignal接口,使其可以像普通的响应式引用一样使用 * * @example * ```ts * const count = ref(0) * const double = new Computed(() => count.value * 2) * console.log(double.value) // 0 * count.value = 2 * console.log(double.value) // 4 * ``` */ export declare class Computed implements RefSignal, DisposableEffect { readonly [IS_REF]: true; readonly [IS_SIGNAL]: true; /** * 计算结果缓存 * @private */ private _value; /** * 脏标记,标识是否需要重新计算 * true表示依赖已变化,需要重新计算 */ private _dirty; /** * 计算属性的getter函数 * @private */ private readonly _getter; /** * 计算属性的setter函数 * @private */ private readonly _setter; /** * 副作用句柄,用于管理计算属性的副作用 */ private readonly _effect; constructor(getter: ComputedGetter, debuggerOptions?: DebuggerOptions); constructor(options: { get: ComputedGetter; set: ComputedSetter; }, debuggerOptions?: DebuggerOptions); constructor(getter: ComputedGetter | { get: ComputedGetter; set: ComputedSetter; }, debuggerOptions?: DebuggerOptions); /** * 获取计算结果 * * 采用懒计算策略: * 1. 首次访问时设置副作用并计算 * 2. 后续访问时,仅当dirty为true时才重新计算 * 3. 追踪对value的访问,建立依赖关系 * * @returns {T} 计算结果 */ get value(): T; /** * 修改计算结果 * * 如果提供了setter函数,则调用setter函数处理新值; * 否则,输出警告信息,提示计算属性不应该被直接修改。 * * @param {T} newValue - 要设置的新值 */ set value(newValue: T); /** * 获取计算属性是否脏 */ get dirty(): boolean; /** * 销毁计算属性 * * 调用此方法会使计算属性失效,不再追踪依赖和更新值。 * 通常无需手动调用此方法(作用域会自动处理),除非需要显式地销毁计算属性。 */ dispose(): void; /** * 将计算属性转换为字符串 * * @returns {string} 字符串表示 */ toString(): string; /** * 定义当对象需要转换成原始值时的行为 * * 根据不同的转换提示返回适当的值: * - 'number': 返回计算结果,尝试进行数值转换 * - 'string': 调用toString方法获取字符串表示 * - 'default': 返回计算结果 * * @param {string} hint - 转换提示类型 * @returns {any} 根据提示类型转换后的原始值 */ [Symbol.toPrimitive](hint: string): any; /** * 强制重新计算 * * 该方法会触发重新计算并返回当前实例,支持链式调用 * * @returns {this} 返回当前实例,以便支持链式调用 */ private recompute; /** * 通知计算属性已脏 * * 该方法会对计算属性进行标记,表示其值已过时,需要重新计算, * 使下一次访问 value 时会触发重新计算。 * * 通常无需手动调用此方法,除非需要显式地通知计算属性已脏。 * * @returns {this} 返回当前实例,以便支持链式调用 */ notify(): this; } /** * 创建一个计算属性 * * 计算属性是一种特殊的响应式数据,它的值由一个getter函数计算得出。 * 当依赖的响应式数据发生变化时,计算属性会自动重新计算并更新其值。 * * @template T - 计算结果的类型 * @param {ComputedGetter} getterOrOptions - 计算属性的getter函数,接收上一次的计算结果作为参数 * @param [debuggerOptions] - 调试选项 * @param {DebuggerOptions} [debuggerOptions.onTrack] - 调试选项,用于设置track回调函数 * @param {DebuggerOptions} [debuggerOptions.onTrigger] - 调试选项,用于设置trigger回调函数 * @returns {Computed} 创建的计算属性对象 * @example * ```ts * // 基本用法 * const count = ref(0) * const double = computed(() => count.value * 2) * console.log(double.value) // 0 * count.value = 2 * console.log(double.value) // 4 * * // 使用setter * const count = ref(0) * const double = computed( * { * get: () => count.value * 2, * set: (newValue) => { * count.value = newValue / 2 * } * } * ) * double.value = 10 * console.log(count.value) // 5 * ``` */ export declare function computed(getterOrOptions: ComputedGetter | { get: ComputedGetter; set: ComputedSetter; }, debuggerOptions?: DebuggerOptions): Computed; /** * 计算属性的值获取函数 * * @template T - 计算结果值的类型 * @param {T} oldValue - 上一次的计算结果,第一次计算时为 undefined * @returns {T} - 计算结果 */ export declare type ComputedGetter = (oldValue: T | undefined) => T; /** * 计算属性的setter处理函数 * * @template T - 同计算结果的类型 */ export declare type ComputedSetter = (newValue: T) => void; /** * 创建 signal <-> effect 双向链表关联 * * @description * 该函数用于创建一个双向链表节点,将 effect 和 signal 进行双向关联。 * 主要包含两个维度的链表维护: * 1. effect 维度:维护 effect 所依赖的所有 signal * 2. signal 维度:维护所有依赖该 signal 的 effect * * @param effect - 需要关联的 effect 对象 * @param signal - 需要关联的 signal 对象 * * @returns 返回新创建的 DepLink 链表节点 * * @example * ```typescript * const sig = signal(0) * const effect = { * run(){ * console.log('effect run',sig()) * } * } * const link = createDepLink(effect, sig) * sig(1) * ``` * * @remarks * - 函数会自动处理链表的头尾节点更新 * - 使用 EFFECT_DEP_HEAD/EFFECT_DEP_TAIL 和 SIGNAL_DEP_HEAD/SIGNAL_DEP_TAIL 作为链表头尾的标记 * - 维护了双向链表的前驱(ePrev/sigPrev)和后继(eNext/sigNext)指针 */ export declare function createDepLink(effect: EffectRunner, signal: Signal): DepLink; /** * 创建一个作用域实例 * * @param options - 作用域的配置选项 * @returns {EffectScope} - 返回创建的EffectScope实例 */ export declare function createScope(options?: EffectScopeOptions): EffectScope; export declare interface DebuggerEvent extends ExtraDebugData { /** * 信号来源 */ signal: Signal; /** * 副作用执行者 */ effect: EffectRunner; /** * 触发类型 * * - get: 获取信号值 * - set: 设置信号值 * - 其他类型:如 add, delete, has, ownKeys 等 */ type: SignalOpType; } export declare type DebuggerHandler = (event: DebuggerEvent) => void; export declare interface DebuggerOptions { /** * trigger调试钩子 - 触发信号 * * 当信号值发生变化并触发依赖更新时调用此钩子函数。 * 可用于调试和监控依赖系统的运行状态。 * * @param event - 调试事件对象,包含触发相关的调试信息 */ onTrigger?: DebuggerHandler; /** * track调试钩子 - 跟踪信号 * * 当响应式系统跟踪到新的依赖关系时调用此钩子函数。 * 可用于调试和监控依赖收集的过程。 * * @param event - 调试事件对象,包含跟踪相关的调试信息 */ onTrack?: DebuggerHandler; } /** * 深度递归解包对象中的所有 Ref 类型 * * @template T - 要解包的对象类型 * @returns 如果 T 是 NonWrapped 类型,则直接返回 T;否则返回一个新类型,其中所有属性都被深度解包 */ export declare type DeepUnwrapRefs = T extends NonWrapped ? T : { [K in keyof T]: T[K] extends Ref ? V : DeepUnwrapRefs; }; declare const DEP_INDEX_MAP: unique symbol; declare const DEP_VERSION: unique symbol; /** * DepLink 类用于表示依赖关系中的双向链表节点 * * 它在两个维度上维护链表结构:signal维度和effect维度 * * 这种结构允许在signal和effect之间建立高效的依赖关系 */ export declare class DepLink { signal: Signal; effect: EffectRunner; sigPrev?: DepLink; sigNext?: DepLink; ePrev?: DepLink; eNext?: DepLink; [DEP_VERSION]?: number; /** * 构造函数 * @param signal - 关联的Signal对象 * @param effect - 关联的DepEffectLike对象 */ constructor(signal: Signal, effect: EffectRunner); } /** * 销毁 signal <-> effect 链表关联 */ export declare function destroyDepLink(link: DepLink): void; /** * 副作用效果接口定义 * * 定义了副作用效果应该具备的基本方法,这些方法用于管理副作用的生命周期。 * 所有方法都是可选的,允许实现部分或全部功能。 */ export declare interface DisposableEffect { /* Excluded from this release type: [PREV_EFFECT] */ /* Excluded from this release type: [NEXT_EFFECT] */ /* Excluded from this release type: [OWNER_SCOPE] */ /** * 释放资源的方法 * * 当副作用不再需要时调用此方法来清理相关资源,如取消订阅、清除定时器等。 * 实现此方法可以确保不会发生内存泄漏。 */ dispose: () => void; /** * 暂停副作用的方法 * * 用于临时暂停副作用的执行,但不释放其资源。 * 这在某些场景下很有用,比如组件暂时不可见时暂停更新。 */ pause?: () => void; /** * 恢复副作用的方法 * * 用于恢复之前被暂停的副作用执行。 * 应当与 pause 方法配对使用。 */ resume?: () => void; } /** * 通用型副作用基类 * * 设计原则: * - 保持非常轻量,仅管理状态与生命周期钩子; * - 提供受保护的 beforeX / afterX 钩子供子类实现自定义清理/暂停/恢复逻辑; * * 约定: * - 副作用发生非预期异常应该主动捕获并交由 reportError 方法进行向上报告。 */ export declare abstract class Effect implements DisposableEffect { /** 当前状态 */ private _state; constructor(scope?: EffectScope | boolean); /** * 获取当前状态 */ get state(): EffectState; /** * 判断当前状态是否为活跃状态 */ get isActive(): boolean; /** * 判断当前状态是否为暂停状态 */ get isPaused(): boolean; /** * 判断当前状态是否为弃用状态 */ get isDisposed(): boolean; /** * 弃用当前副作用实例 */ dispose(): void; /** * 暂停当前副作用实例 */ pause(): void; /** * 恢复当前副作用实例 */ resume(): void; /** * 报告非预期异常 * * @param e - 捕获的非预期异常/通常是Error对象 * @param source - 异常源/字符串类型,帮助定位异常发生地:watcher.callback */ protected reportError(e: unknown, source: string): void; protected beforeDispose?(): void; protected beforePause?(): void; protected beforeResume?(): void; protected afterDispose?(): void; protected afterPause?(): void; protected afterResume?(): void; } declare const EFFECT_DEP_HEAD: unique symbol; declare const EFFECT_DEP_TAIL: unique symbol; /** * EffectRunner 协议接口(内部使用) * * Effect 执行器,用于依赖系统触发执行。 */ export declare interface EffectRunner extends DebuggerOptions { /** * 依赖版本号 */ [DEP_VERSION]?: number; /** * signal <-> effect 索引映射 * * 用于快速查找某个信号的依赖关系。 * 这是依赖系统的核心数据结构,用于高效地管理依赖关系。 * * ⚠️ 注意:依赖系统核心数据,请勿修改。 */ [DEP_INDEX_MAP]?: WeakMap; /** * signal <-> effect 链表头 * * 用于维护信号到观察者的双向链表结构的起始节点。 * 这是依赖系统的核心数据结构,用于高效地管理依赖关系。 * * ⚠️ 注意:依赖系统核心数据,请勿修改。 */ [EFFECT_DEP_HEAD]?: DepLink; /** * signal <-> effect 链表尾 * * 用于维护信号到观察者的双向链表结构的末尾节点。 * 这是依赖系统的核心数据结构,用于高效地管理依赖关系。 * * ⚠️ 注意:依赖系统核心数据,请勿修改。 */ [EFFECT_DEP_TAIL]?: DepLink; (): void; } /** * EffectScope 作用域 * * 用于管理一组相关的副作用效果,提供统一的生命周期管理。 * 它维护了一个效果链表,支持添加、移除、暂停、恢复和销毁操作。 */ export declare class EffectScope { /** * 作用域名称 */ readonly name: string | symbol; /** * 可选的错误处理器,用于处理作用域内的错误 */ errorHandler?: EffectScopeErrorHandler; /** * 私有属性,用于存储不同类型的回调函数集合。 * 使用 Map 数据结构,键为回调类型('dispose' | 'pause' | 'resume'),值为对应的回调函数集合。 */ private _callbacks?; /** 链表头部 */ private _head?; /** 链表尾部 */ private _tail?; /** 当前状态 */ private _state; /** * 获取当前状态 */ get state(): EffectState; /** * 构造函数,创建一个新的 EffectScope 实例。 * @param options - 可选配置对象,包含名称和错误处理器 */ constructor(options?: EffectScopeOptions); /** * 获取当前作用域中的效果数量 * * 获取数量需要遍历链表,因此时间复杂度为O(n),一般仅用于测试作用域大小 * * @returns {number} 当前作用域中的效果数量 */ get count(): number; /** * 获取所有副作用的访问器属性 * * 返回一个包含所有副作用的数组,按照添加顺序排列 * * 获取数量需要遍历链表,因此时间复杂度为O(n),一般仅用于测试阶段 * * @warning 仅测试环境有用,开发环境返回固定的空数组 * @returns {Effect[]} 包含所有效果的数组 */ get effects(): DisposableEffect[]; /** * 添加一个在效果被释放时执行的回调函数。 * @param cb - 要添加的回调函数 * @returns 返回当前实例,支持链式调用 */ onDispose(cb: VoidCallback): this; /** * 添加一个在效果被暂停时执行的回调函数。 * @param cb - 要添加的回调函数 * @returns 返回当前实例,支持链式调用 */ onPause(cb: VoidCallback): this; /** * 添加一个在效果恢复时执行的回调函数。 * @param cb - 要添加的回调函数 * @returns 返回当前实例,支持链式调用 */ onResume(cb: VoidCallback): this; /** * 向效果链表中添加一个新的效果 * @param effect - 要添加的效果对象 */ add(effect: DisposableEffect): void; /** * 从效果链表中移除指定的效果节点 * @param effect - 需要被移除的效果节点 */ remove(effect: DisposableEffect): void; /** * 在当前作用域上下文中执行一个函数 * * @template T - 函数返回值的类型 * @param {() => T} fn - 要执行的函数 * @returns {T} 函数执行的结果 */ run(fn: () => T): T; /** * 处理副作用错误 * * @param error - 错误对象 * @param source - 错误源 */ handleError(error: unknown, source: string): void; /** * 释放链表的所有资源,包括每个节点的资源以及链表本身的资源 * 这是链表的销毁方法,执行后链表将不再可用 */ dispose(): void; /** * 暂停链表中的所有节点 * 该方法会遍历链表中的每个节点,并尝试调用其pause方法(如果存在) * 调用完成后,会触发 'pause' 回调 */ pause(): void; /** * 恢复链表中所有节点的执行状态 * 此方法会遍历链表中的每个节点,并尝试调用其resume方法 * 如果在恢复过程中发生错误,会通过handleError方法处理 * 最后会触发 'resume' 类型的回调函数 */ resume(): void; /** * 遍历链表中的每个节点 * * 调用对应的方法 * * @param type - 要调用的方法类型('pause' | 'resume') */ private traverseEffects; /** * 添加回调函数的私有方法。 * @param cb - 要添加的回调函数 * @param type - 回调类型('dispose' | 'pause' | 'resume') * @returns 返回当前实例,支持链式调用 * @private - 表示此方法仅在类内部可见 */ private addCallback; /** * 触发指定类型的所有回调函数。 * @param type - 要触发的回调类型('dispose' | 'pause' | 'resume') * @protected - 表示此方法仅可在类及其子类中访问 */ private triggerCallback; } /** * 作用域错误处理函数 * * @param error - 错误对象 * @param source - 错误源,例如 'dispose' | 'pause' | 'resume' | 副作用自定义错误源 */ export declare type EffectScopeErrorHandler = (error: unknown, source: string) => void; /** * 作用域可选配置选项 */ export declare interface EffectScopeOptions { /** * 作用域名称,用于在调试时更直观地识别作用域 * 可以是字符串或Symbol类型 * * @default "anonymous" */ name?: string | symbol; /** * 错误处理器,用于处理作用域内的错误。 * 当一个错误被抛出时,会调用此处理器,并传入错误对象和错误源。 * * @default undefined */ errorHandler?: EffectScopeErrorHandler; } /** * 副作用状态枚举 * * - active: 活跃状态,表示当前效果正在运行。 * - paused: 暂停状态,表示当前效果已暂停。 * - disposed: 弃用状态,表示当前效果已被弃用。 */ export declare type EffectState = 'active' | 'paused' | 'disposed'; /** * 副作用观察器 * * 这是一个观察者类,继承自 Watcher 抽象基类,用于管理响应式依赖收集和副作用执行。 * 该类实现监听副作用函数的依赖关系,依赖变化时自动执行副作用。 * * @template T - getter返回值类型 * @extends Watcher * * @example * ```typescript * new EffectWatcher(() => { * const count = signal(1) * console.log(count()) * }) * ``` */ declare class EffectWatcher extends Watcher { private readonly effect; constructor(effect: (onCleanup: WatcherOnCleanup) => T, options?: WatcherOptions); /** * 核心:执行 + 依赖收集 * * @protected */ protected runEffect(): void; } export declare interface ExtraDebugData { /** 变更前的值,仅在触发阶段可选 */ oldValue?: any; /** 变更后的值,仅在触发阶段可选 */ newValue?: any; /** * 其他信号自定义发出的信息 */ [key: string]: any; } /** * 刷新模式 * * 控制观察者回调函数的执行时机: * - 'pre': 前置队列执行(默认) * - 'main': 主队列执行 (业务侧逻辑请勿使用此模式!) * - 'post': 后置队列执行 * - 'sync': 同步执行,接收到触发信号后立即执行 */ export declare type FlushMode = 'pre' | 'main' | 'post' | 'sync'; /** * 立即同步执行所有队列中的任务 * * 注意: * - 此方法会绕过微任务队列,立即同步执行所有任务 * - 适用于需要立即看到效果的场景,但可能阻塞主线程 * - 如果正在刷新中,则跳过执行以避免并发问题 */ export declare function flushSync(): void; /** * 获取当前活动的副作用函数 * 该函数用于获取当前正在执行的副作用函数,通常用于响应式系统中的依赖收集 * * @returns 返回当前活动的副作用函数(DepEffectLike类型),如果没有则返回null */ export declare function getActiveEffect(): EffectRunner | null; /** * 获取当前活跃的作用域(EffectScope) * 该函数用于从上下文中获取当前的作用域对象 * * @returns {EffectScope | undefined} 返回当前的作用域(EffectScope)对象,如果不存在则返回undefined */ export declare const getActiveScope: () => EffectScope | undefined; /** * 获取给定effect的作用域 * @param effect - 需要获取作用域的effect对象 * @returns - 返回effect对应的作用域对象,如果不存在则返回undefined */ export declare const getOwnerScope: (effect: DisposableEffect) => EffectScope | undefined; /** * GetterRef 类,用于创建一个只读的引用包装器 * @template T - 引用值的类型 */ export declare class GetterRef implements Ref { private readonly getter; readonly [IS_REF]: true; readonly [IS_READONLY]: true; /** * 构造函数 * @param getter - 一个获取值的函数,用于初始化引用 */ constructor(getter: () => T); /** * 获取引用的值 * 这是一个 getter 属性,用于获取被包装的值 * @returns - 通过 getter 函数获取的值 */ get value(): T; /** * 尝试设置引用的值 * 这是一个 setter 属性,用于尝试设置被包装的值 * 对于 ReadonlyRef 来说,设置操作是不允许的 * @param _newVal - 新值 * @throws - 总是抛出错误,因为这是只读引用 */ set value(_newVal: T); toString(): string; [Symbol.toPrimitive](hint: string): any; } /** * 判断一个信号对象是否具有副作用依赖 * * @param signal - 待检查的信号对象 * @returns {boolean} 如果信号对象具有副作用依赖返回true,否则返回false */ export declare function hasLinkedEffect(signal: Signal): boolean; /** * 判断一个副作用对象是否具有信号依赖 * * @param effect - 待检查的副作用对象 * @returns {boolean} 如果副作用对象具有信号依赖返回true,否则返回false */ export declare function hasLinkedSignal(effect: EffectRunner): boolean; /** * 检查对象的属性是否为响应式信号 * * @example * ```typescript * const count = ref(0) * const result = hasPropTrack(count, 'value') * console.log(result.isTrack) // 输出:true * console.log(result.value) // 输出:0 * * const result2 = hasPropTrack({value:0}, 'value') * console.log(result2.isTrack) // 输出:false * console.log(result2.value) // 输出:0 * ``` * * @template T - 对象的类型 * @template K - 属性的键类型 * @param obj - 要检查的对象 * @param key - 要检查的属性键 * @returns { { isTrack: boolean; value: T[K] } } */ export declare function hasPropTrack(obj: T, key: K): { isTrack: boolean; value: T[K]; }; /** * 检测给定的函数中是否触发了追踪信号 * * hasTrack 会执行 fn 并检测其内部是否访问了响应式信号(触发 trackSignal)。 * fn 内访问的值会按响应式契约正常建立依赖——值被访问了就应该被跟踪。 * 如需"检测但不建立依赖",应使用 `untracked` 包裹: * * @example * ```typescript * const count = ref(0) * * // 检测 + 建立依赖(值被访问 → 正常跟踪) * const result = hasTrack(() => count.value) * console.log(result.isTrack) // 输出:true * console.log(result.value) // 输出:0 * * // 检测但不建立依赖(用 untracked 显式暂停跟踪) * const result2 = untracked(() => hasTrack(() => count.value)) * console.log(result2.isTrack) // 输出:true * ``` * * @template V - 函数返回值的类型 * @param fn - 一个无参数函数,用于检测是否包含信号 * @returns { { isTrack: boolean; value: V } } */ export declare function hasTrack(fn: () => V): { isTrack: boolean; value: V; }; /** * 忽略响应性自动包装(用于 isMarkRaw 判断) */ export declare const IS_RAW: unique symbol; /** * reactive 独有标识 */ export declare const IS_REACTIVE: unique symbol; /** * 只读代理标识 */ export declare const IS_READONLY: unique symbol; /** * 引用信号(用于 isRef )判断 */ export declare const IS_REF: unique symbol; /** * signal 标记 */ export declare const IS_SIGNAL: unique symbol; /** * 判断是否为计算属性对象 * * 此函数用于检查一个值是否是通过`computed`或`computedWithSetter`创建的计算属性实例。 * 计算属性是一种特殊的响应式数据,其值由getter函数计算得出,并在依赖变化时自动更新。 * * @template T - 任意类型 * @param {unknown} val - 要检查的值 * @returns {boolean} 如果值是计算属性实例则返回`true`,否则返回`false` * @example * ```ts * const count = ref(0) * const double = computed(() => count.value * 2) * * isComputed(double) // true * isComputed(count) // false * isComputed(123) // false * * // 等同于 val instanceof Computed * ``` */ export declare function isComputed(val: unknown): val is Computed; /** * 检查对象是否被标记为非信号类型 * * @param obj - 需要检查的对象 * @returns {boolean} 如果对象存在且具有NON_SIGNAL属性则返回true,否则返回false */ export declare function isMakeRaw(obj: any): boolean; /** * 检查一个值是否为响应式对象 * * @param val - 需要检查的值 * @returns {boolean} 如果是响应式对象则返回true,否则返回false */ export declare function isReactive(val: any): val is Reactive | ShallowReactive; /** * 判断是否为只读对象 * * 检查一个值是否是通过 `readonly()` 或 `shallowReadonly()` 或 `toRef(()=>value)` 创建的只读对象。 * 注意:此函数仅检查对象是否为具有只读标记,不能用于判断对象是否为响应式对象。 * * @template T - 要检查的对象类型 * @param {T} obj - 要检查的对象 * @returns {boolean} 如果对象是只读代理则返回true,否则返回false * @example * ```ts * const original = { count: 0 } * const readonlyObj = readonly(original) * const shallowReadonlyObj = shallowReadonly(original) * const toRefObj = toRef(() => original.count) * * isReadonly(readonlyObj) // true * isReadonly(shallowReadonlyObj) // true * isReadonly(toRefObj) // true * isReadonly(original) // false * isReadonly(null) // false * ``` */ export declare function isReadonly(obj: any): boolean; /** * 判断值是否实现Ref接口 * * @param val - 任意值 * @example * ```js * isRef(ref(0)) // true * isRef(computed(()=>0)) // true * isRef(toRef(0)) // true * isRef(toRef({k:0},'k')) // true * * isRef(0) // false * ``` */ export declare function isRef(val: any): val is Ref; /** * 检测值是否为RefSignal * * @param val - 待检测的值 * @returns {boolean} 如果是RefSignal则返回true,否则返回false */ export declare function isRefSignal(val: any): val is RefSignal; /** * 迭代一个 signal 关联的所有 effect * * @warning ⚠️ 注意:O(n),主要用于测试 / 调试 */ export declare function iterateLinkedEffects(signal: Signal): IterableIterator; /** * 迭代一个 effect 依赖的所有 signal * * @warning ⚠️ 注意:O(n),主要用于测试 / 调试 */ export declare function iterateLinkedSignals(effect: EffectRunner): IterableIterator; /** * 任务调度器 - 基于优先级和参数合并的任务执行系统(函数式实现) * * 核心功能: * - 三阶段任务队列:preFlush(准备阶段)→ main(执行阶段)→ postFlush(清理阶段) * - 微任务调度:基于 Promise 微任务的异步执行 * - 同步执行支持:提供 flushSync 立即同步执行所有任务的能力 * * 设计原理: * - 执行阶段捕获异常并记录,单任务异常不中断整体刷新流程 */ /** * 任务函数类型定义 * 接受任意参数并返回 void 的函数 */ declare type Job = () => void; /** * 移除任务的模式 * - 'pre': 仅从准备阶段队列移除 * - 'main': 仅从主任务队列移除 * - 'post': 仅从清理阶段队列移除 * - 'all': 从所有队列移除 */ export declare type JobRemovalMode = 'pre' | 'main' | 'post' | 'all'; /** * 将一个对象标记为永远不会被转换为响应式信号。 * * 这在某些情况下很有用,比如当对象包含原型方法或不应该是响应式的时候。 * * 标记过后它在支持深度响应的信号中不会被转换成信号。 * * @template T - 待标记的对象类型 * @param obj - 待标记的对象,必须是一个非null的对象 * @returns { RawObject } - 返回被标记为非信号的对象 * @throws { TypeError } - 如果传入的参数不是对象类型(比如null、undefined、数字等),则抛出类型错误 * @example * ```ts * const obj = { value: 1 }; * const rawObj = markNonSignal(obj); * const signal = reactive(rawObj); // rawObj不会被转换为响应式 * console.log(isSignal(signal)); // false * ``` */ export declare function markRaw(obj: T): RawObject; declare const NEXT_EFFECT: unique symbol; /** * 将回调推迟到下一个微任务执行 * @param fn 可选的回调函数 * @returns Promise 在微任务阶段解析的 Promise */ export declare function nextTick(fn?: () => void): Promise; /** * 不应被包装的类型,包括集合、函数和原始对象 */ declare type NonWrapped = AnyCollection | AnyFunction | RawObject; /** * 在作用域销毁时注册回调函数 * * @param fn - 作用域销毁时要执行的回调函数 * @param failSilently - 是否静默失败(不输出警告),默认为 false */ export declare function onScopeDispose(fn: () => void, failSilently?: boolean): void; /** * 在作用域暂停时注册回调函数 * * @param fn - 作用域暂停时要执行的回调函数 * @param failSilently - 是否静默失败(不输出警告),默认为 false */ export declare function onScopePause(fn: () => void, failSilently?: boolean): void; /** * 在作用域恢复时注册回调函数 * * @param fn - 作用域恢复时要执行的回调函数 * @param failSilently - 是否静默失败(不输出警告),默认为 false */ export declare function onScopeResume(fn: () => void, failSilently?: boolean): void; declare const OWNER_SCOPE: unique symbol; declare const PREV_EFFECT: unique symbol; /** * PropertyRef 是一个泛型类,用于对象属性的引用。 * * 核心功能: * - 提供对象属性访问 * - 支持默认值设置 * - 实现了标准的 getter/setter 接口 * * @example * ```typescript * const obj = reactive({ name: 'John' }); * const nameRef = new PropertyRef(obj, 'name', 'Default'); * * // 获取值 * console.log(nameRef.value); // 'John' * * // 设置值 * nameRef.value = 'Jane'; * console.log(obj.name); // 'Jane' * ``` * * @param target - 要引用属性的目标对象 * @param key - 要引用的属性键名 * @param defaultValue - 可选的默认值,当属性未定义时使用 * * @remarks * - 该类使用 TypeScript 的泛型确保类型安全 * - 目标对象必须是引用类型(object) * - 属性键必须是目标对象的有效键 * - 当属性值为 undefined 时,将返回默认值(如果提供) */ export declare class PropertyRef implements Ref { private readonly target; private readonly key; private readonly defaultValue?; readonly [IS_REF]: true; constructor(target: T, key: K, defaultValue?: T[K] | undefined); get value(): T[K]; set value(newVal: T[K]); toString(): string; [Symbol.toPrimitive](hint: string): any; } /** * 创建一个属性引用对象 * * @param target - 目标对象,其属性将被观察 * @param key - 目标对象上要观察的属性键 * @param defaultValue - 可选参数,属性的默认值 * @returns {PropertyRef} 返回一个新的 PropertyRef 实例 * @template T - 目标对象的类型 * @template K - 目标对象属性键的类型,必须是 T 的键之一 * @example * ```js * const obj = reactive({ name: 'John' }); * const nameRef = propertyRef(obj, 'name', 'Default'); * console.log(nameRef.value); // 'John' * nameRef.value = 'Jane'; * console.log(obj.name); // 'Jane' * ``` */ export declare function propertyRef(target: T, // 目标对象,需要被观察属性变化的对象 key: K, // 目标对象的属性键,将被观察和响应变化 defaultValue?: T[K]): PropertyRef; /** * 将任务添加到主任务队列 * @param job 要执行的任务函数 */ export declare function queueJob(job: Job): void; /** * 将任务添加到清理阶段队列 * * @param job 要执行的任务函数 */ export declare function queuePostFlushJob(job: Job): void; /** * 将任务添加到准备阶段队列 * * @param job 要执行的任务函数 */ export declare function queuePreFlushJob(job: Job): void; /** * 获取包装的原始值 */ export declare const RAW_VALUE: unique symbol; /** * 表示原始对象类型,用于标识不应被包装的对象 * * @template T - 原始对象的类型,默认为任意对象 */ export declare type RawObject = T & { readonly [IS_RAW]: true; }; /** * 表示包含原始值的接口 * * @template T - 原始值的类型 */ export declare interface RawValue { readonly [RAW_VALUE]: T; } /** * 响应式类型定义 * * @template T 目标对象类型 */ export declare type Reactive = DeepUnwrapRefs & { readonly [RAW_VALUE]: T; readonly [IS_REACTIVE]: ReactiveSource; }; /** * 将一个对象代理为响应式对象 * * @template T - 任意对象类型 * @param target - 需要转换为响应式的目标对象,不要传入集合对象,集合 * @returns {T} 返回一个响应式代理对象 */ export declare function reactive(target: T): Reactive; /** * ReactiveSource 是一个抽象类,用于创建响应式对象代理。 * * 它实现了 Signal 接口,非集合类型对象,仅会发出结构变化信号。 */ declare abstract class ReactiveSource implements ProxyHandler { readonly target: T; readonly deep: boolean; readonly proxy: T; /** * 构造函数 * @param target - 要代理的目标对象 * @param deep - 是否进行深度代理 */ constructor(target: T, deep?: boolean); get(target: T, p: string | symbol, receiver: any): any; /** * 触发信号的方法 * 根据当前环境是否为开发环境决定是否传递 devInfo 参数 * @param type - 信号操作类型 * @param devInfo - 调试器事件选项(可选参数,仅在开发环境使用) */ protected triggerSignal(type: SignalOpType, devInfo?: ExtraDebugData): void; /** * 跟踪信号的方法 * @param type - 信号操作类型,指定要跟踪的信号操作类型 * @param devInfo - 可选参数,设备信息对象,包含设备的额外信息 * 该方法用于跟踪与代理对象相关的信号操作,将相关信息传递给trackSignal函数 */ protected trackSignal(type: SignalOpType, devInfo?: ExtraDebugData): void; /** * 抽象方法,由子类实现,处理 get 操作 * @param target * @param p * @param receiver * @protected */ protected abstract doGet(target: T, p: string | symbol, receiver: any): any; } /** * 只读对象 * * 创建一个只读的代理对象,使对象的属性变为只读。 * * 主要用于以下场景: * 1. 需要向外部提供数据访问但防止修改 * 2. 在组件间传递不可变的状态 * 3. 作为配置对象使用时确保不被意外修改 * * @template T - 目标对象类型 * @template IsDeep - 是否深度只读 * @param target - 要代理的目标对象 * @param [deep=true] - 是否进行深度代理 * @returns {ReadonlyObject} 深度只读的代理对象 * @example * ```ts * // 基本用法 * const state = { user: { name: 'Alice', settings: { theme: 'dark' } } }; * const readonlyState = readonly(state); * * // 以下操作都会失败 * readonlyState.user.name = 'Bob'; // 打印警告 * readonlyState.user.settings.theme = 'light'; // 打印警告,因为是深度只读的 * * // 与响应式对象结合使用 * const reactiveState = reactive({ count: 0 }); * const readonlyReactive = readonly(reactiveState); * * // 仍然可以读取值 * console.log(readonlyReactive.count); // 0 * * // 但无法修改 * readonlyReactive.count = 1; // 打印警告 * ``` */ export declare function readonly(target: T, deep?: IsDeep): ReadonlyObject; /** * 只读代理类型工具 * * 根据 IsDeep 参数决定使用浅层还是深层只读代理: * - 当 IsDeep 为 true 时,使用 DeepReadonly 进行深度只读处理 * - 当 IsDeep 为 false 时,使用 Readonly 进行浅层只读处理 * * @template T - 对象类型 * @template IsDeep - 是否进行深度处理 * * @example * ```typescript * type User = { name: RefWrapper; profile: { age: RefWrapper } } * * // 深层只读 * type DeepReadOnlyUser = ReadonlyProxy * // 等价于 DeepReadonly<{ name: string; profile: { age: number } }> * * // 浅层只读 * type ShallowReadOnlyUser = ReadonlyProxy * // 等价于 Readonly<{ name: string; profile: { age: RefWrapper } }> * ``` */ export declare type ReadonlyObject = (IsDeep extends true ? DeepReadonly> : Readonly>) & RawValue; /** * Ref 接口,用于创建响应式引用 * * @template T - 读取值的类型 * @template S - 设置值的类型,默认与 T 相同 */ export declare interface Ref { readonly [IS_REF]: true; get value(): T; set value(value: S); } /** * 创建响应式引用(无参数重载) * * 创建一个未初始化的响应式引用,值为 undefined。 * * @returns {ValueRef} 返回一个未初始化的响应式引用 * * @example * ```js * const count = ref() // ValueRef * console.log(count.value) // undefined * count.value = 1 * console.log(count.value) // 1 * ``` */ export declare function ref(): ValueRef; /** * 创建响应式引用(泛型重载) * * 创建一个指定类型的响应式引用,初始值为 undefined。 * * @template Value - 引用值的类型 * @returns {ValueRef} 返回指定类型的响应式引用 * * @example * ```js * const count = ref() // ValueRef * console.log(count.value) // undefined * count.value = 1 * console.log(count.value) // 1 * ``` */ export declare function ref(): ValueRef; /** * 创建响应式引用(带初始值重载) * * 创建一个带有初始值的响应式引用。 * * @template Value - 引用值的类型 * @param value - 初始值 * @returns {ValueRef} 返回带有初始值的响应式引用 * * @example * ```js * const count = ref(0) // ValueRef * const user = ref({ name: 'Zhang' }) // ValueRef<{ name: string }> * console.log(count.value) // 0 * count.value = 1 * console.log(count.value) // 1 * ``` */ export declare function ref(value: Value): ValueRef; /** * RefSignal 接口,扩展自 Ref,增加了可追踪标识 * * @template T - 读取值的类型 * @template S - 设置值的类型,默认与 T 相同 */ export declare interface RefSignal extends Ref { readonly [IS_SIGNAL]: true; } /** * 从当前作用域中移除指定的副作用函数 * @param effect - 需要移除的副作用函数对象,必须符合EffectLike接口 */ export declare const removeFromOwnerScope: (effect: DisposableEffect) => void; /** * 从指定队列中移除任务 * * @param job 要移除的任务函数 * @param mode 移除模式 * @returns {boolean} 如果任务在指定队列中存在并被移除则返回 true,否则返回 false */ export declare function removeJob(job: Job, mode?: JobRemovalMode): boolean; /** * 处理effect错误的函数 * * @param effect - 需要处理的effect对象 * @param e - 发生的未知错误 * @param source - 错误来源的字符串描述 */ export declare const reportEffectError: (effect: DisposableEffect, e: unknown, source: string) => void; /** * 任务调度器类型定义 * 接受一个任务函数并返回一个任务执行函数 */ declare type Scheduler_2 = (job: () => void) => void; export { Scheduler_2 as Scheduler } /** * 浅层响应式类型定义 * * @template T 目标对象类型 */ export declare type ShallowReactive = UnwrapRefs & { readonly [RAW_VALUE]: T; readonly [IS_REACTIVE]: ReactiveSource; }; /** * 创建浅层响应式对象 * * @template T - 目标对象类型 * @param { T } target - 目标对象 * @returns {Reactive} 浅层响应式对象 */ export declare function shallowReactive(target: T): ShallowReactive; /** * 浅层只读对象 * * 创建一个浅层只读的代理对象,只有对象的直接属性是只读的,嵌套对象仍然可以修改。 * 适用场景: * 1. 只需保护对象的直接属性不被修改 * 2. 允许修改嵌套对象的属性 * 3. 性能敏感场景,避免深度代理带来的性能开销 * * @template T - 目标对象类型 * @param target - 要代理的目标对象 * @returns {Readonly} 浅层只读的代理对象 * @example * ```ts * // 基本用法 * const state = { user: { name: 'Alice', settings: { theme: 'dark' } } }; * const shallowReadonlyState = shallowReadonly(state); * * // 直接属性不能修改,但嵌套对象可以修改 * shallowReadonlyState.user = { name: 'Bob' }; // 打印警告 * shallowReadonlyState.user.name = 'Bob'; // 成功修改 * * // 与深度只读对比 * const deepReadonly = readonly(state); * deepReadonly.user.name = 'Charlie'; // 打印警告,深度只读不允许修改 * * const shallowRO = shallowReadonly(state); * shallowRO.user.name = 'Charlie'; // 成功,浅层只读允许修改嵌套属性 * * // 性能优势示例 * const largeConfig = { * ui: { theme: 'dark', lang: 'en' }, * api: { baseURL: 'https://api.example.com', timeout: 5000 }, * features: { enabled: ['feature1', 'feature2'], disabled: [] } * }; * * // 使用浅层只读避免对大量嵌套数据进行深度代理 * const config = shallowReadonly(largeConfig); * * // 仍可修改内部配置 * config.ui.theme = 'light'; // 允许修改 * * // 但不能替换顶层对象 * config.ui = { theme: 'blue' }; // 打印警告 * ``` */ export declare function shallowReadonly(target: T): ReadonlyObject; /** * ShallowRef 类是一个浅层引用类,实现了 RefSignal 接口 * * @template T - 泛型参数,表示引用值的类型 */ export declare class ShallowRef implements RefSignal { readonly [IS_REF]: true; readonly [IS_SIGNAL]: true; /** * 构造函数,创建一个新的 ShallowRef 实例 * @param initialValue - 初始值 */ constructor(initialValue: T); private _value; /** * 获取值的访问器 * @returns - 返回存储的值 */ get value(): T; /** * 设置值的访问器 * @param newValue - 要设置的新值 */ set value(newValue: T); /** 读取原始值 - 不触发跟踪!(等同于raw)*/ get peek(): T; /** 读取原始值 - 不触发跟踪!(等同于peek)*/ get raw(): T; toString(): string; [Symbol.toPrimitive](hint: string): any; } /** * 创建浅层响应式引用(无参数重载) * * 创建一个未初始化的浅层响应式引用,值为 undefined。 * * @returns {ShallowRef} 返回一个未初始化的浅层响应式引用 * * @example * ```js * const count = shallowRef() // ShallowRef * console.log(count.value) // undefined * count.value = 1 * console.log(count.value) // 1 * ``` */ export declare function shallowRef(): ShallowRef; /** * 创建浅层响应式引用(泛型重载) * * 创建一个指定类型的浅层响应式引用,初始值为 undefined。 * * @template T - 引用值的类型 * @returns {ShallowRef} 返回指定类型的浅层响应式引用 * * @example * ```js * const count = shallowRef() // ShallowRef * console.log(count.value) // undefined * count.value = 1 * console.log(count.value) // 1 * ``` */ export declare function shallowRef(): ShallowRef; /** * 创建浅层响应式引用(带初始值重载) * * 创建一个带有初始值的浅层响应式引用。 * * @template T - 引用值的类型 * @param value - 初始值 * @returns {ShallowRef} 返回带有初始值的浅层响应式引用 * * @example * ```js * const count = shallowRef(0) // ShallowRef * const user = shallowRef({ name: 'Zhang' }) // ShallowRef<{ name: string }> * console.log(count.value) // 0 * count.value = 1 * console.log(count.value) // 1 * ``` */ export declare function shallowRef(value: T): ShallowRef; /** * Signal 协议接口(内部使用) * * Signal 并不是值容器,也不是用户可操作的对象, * 它仅作为依赖系统中的协议类型,用于描述对象 * 可以被 track/trigger,维护依赖链表。 * * 所有信号发出的通知都由值容器(Ref / Reactive / Computed 等)决定, * 开发者通常不直接操作 Signal,除非你理解依赖系统机制。 */ export declare interface Signal { /* Excluded from this release type: [SIGNAL_DEP_HEAD] */ /* Excluded from this release type: [SIGNAL_DEP_TAIL] */ /** * 兼容任意对象 */ [P: keyof any]: any; } declare const SIGNAL_DEP_HEAD: unique symbol; declare const SIGNAL_DEP_TAIL: unique symbol; export declare type SignalOpType = keyof ProxyHandler | string; /** * 获取原始值 * * @template T - 待获取原始值的对象类型 * @param wrap - 包装原始值的对象 * @returns - 如果传入的对象其属性存在RAW_VALUE,则返回其值,否则返回对象本身 */ export declare function toRaw(wrap: T | RawValue): T; /** * ToRef 类型工具,它根据输入类型 T 转换类型 * * 如果 T 已经是 Ref,则返回 T 本身;否则返回 Ref。 * * @template T - 任意类型 * * @example * ```typescript * type A = ToRef // Ref * type B = ToRef> // Ref * ``` */ export declare type ToRef = T extends Ref ? T : Ref; /** * 转换为 GetterRef * * @overload@overload * 当传入函数时,返回一个只读 GetterRef,.value 访问 getter 返回值。 * @template T - 值的类型 * @param {() => T} source - 一个返回值的函数 * @returns {GetterRef} GetterRef 对象 * @example * ```js * const data = reactive({ count: 0 }) * const countRef = toRef(() => data.count) * console.log(countRef.value) // 0 * ``` */ export declare function toRef(source: () => T): GetterRef; /** * 无意义的任何转换 * * @overload@overload * 传入符合 RefWrap 接口的对象原样返回 * * @template T - 值的类型 * @param {T} value - 普通值 * @returns {ValueRef} 包装后的 Ref 对象 * @example * ```js * const count = ref(42) * const countRef = toRef(count) * console.log(count === countRef) // true * ``` */ export declare function toRef>(value: T): T; /** * 常规转换为 Ref * * @overload@overload * 当传入任意普通值时,包装为可写的 Ref * @template T - 值的类型 * @param {T} value - 普通值 * @returns {ValueRef} 包装后的 Ref 对象 * @example * ```js * const countRef = toRef(42) * console.log(countRef.value) // 42 * countRef.value = 43 * console.log(countRef.value) // 43 * ``` */ export declare function toRef(value: T): ValueRef; /** * 对象属性双向绑定 - PropertyRef * * @overload@overload * 当传入对象与键时,返回一个与该属性双向绑定的 Ref。 * 如果属性不存在且传入 defaultValue,则在访问时使用默认值。 * @template T - 对象类型 * @template K - 键的类型 * @param {T} object - 源对象 * @param {K} key - 对象的键 * @param {T[K]} [defaultValue] - 默认值(可选) * @returns {ToRef} 与对象属性绑定的 Ref 对象 * @example * ```js * const state = reactive({ count: 0 }) * const countRef = toRef(state, 'count') * console.log(countRef.value) // 0 * countRef.value++ * console.log(state.count) // 1 * * // 使用默认值 * const nameRef = toRef(state, 'name', 'default') * console.log(nameRef.value) // 'default' * ``` */ export declare function toRef(object: T, key: K, defaultValue?: T[K]): PropertyRef; /** * 响应式代理对象结构 - 保持响应式特性 * * 该函数主要用于解构实现了 `Reactive` 接口的对象,同时保持响应式特性。 * 如果传入的是普通对象,会给出警告但仍然创建代理,但不具备双向关联性。 * * @template T - 对象类型 * @param {T} obj - 键值对对象 * @param [skipWarn=false] - 跳过非响应式对象警告 * @returns {{ [K in keyof T]: ToRef }} - 属性到 Ref 的映射 * @example * ```js * const state = reactive({ count: 0, user: { name: 'Li' } }) * const { count, user } = toRefs(state) * count.value++ // state.count === 1 * state.user.name = 'Zhang' // user.value.name === 'Zhang' * ``` */ export declare function toRefs(obj: T, skipWarn?: boolean): { [K in keyof T]: ToRef; }; /** * 定义 Ref 值的类型转换规则,用于决定 `.value` 访问时的返回类型: * * 1. 如果 T 是函数,保持为 T(函数通常不转为深层响应式) * 2. 如果 T 是对象,转换为 Reactive(使其具备响应式能力) * 3. 其他基本类型保持为 T */ export declare type ToRefValue = T extends AnyFunction ? T : T extends AnyObject ? Reactive : T; /** * 将传入的源转换为普通值 * * @template T - 值类型 * @param source 可以是普通值、响应式引用或返回值的函数 * @returns {T} 返回转换后的普通值 */ export declare function toValue(source: T | Ref | (() => T)): T; /** * 跟踪副作用依赖,用于追踪和建立信号依赖关系 * * 此 API 偏向于底层实现,开发者应使用上层API,如 watchEffect、watch 等。 * * @example * ```typescript * const count = ref(1) * trackEffect(() => { * console.log(count.value) // 输出:1 * }) * count.value++ // 输出:2 * * // 自定义处理器/回调函数 * const handler = ()=>{console.log('依赖变化了')} * trackEffect(() => count.value,handler) * count.value++ // 输出:3 依赖变化了 * * // 获取依赖链 * const effectDeps = iterateLinkedSignals(handle) // 可迭代的信号依赖链 * const signalDeps = iterateLinkedEffects(count) // 可迭代的副作用依赖链 * * // 清除依赖关系,下面仅是示例,实际关联和清除都是双向的,仅需要一侧调用即可 * clearEffectLinks(handle) // 清除副作用链接的所有信号 * clearSignalLinks(count) // 清除信号链接的所有副作用 * ``` * * @template T - 函数返回值的类型 * @param collector - 收集函数,仅在初始化时执行一次,用于收集依赖 * @param [reactor] - 响应函数,信号变化后重新执行,默认为 collector * @returns {T} 返回执行 collector 函数的结果 */ export declare function trackEffect(collector: () => T, reactor?: EffectRunner): T; /** * 跟踪信号变化的函数 * * `trackSignal` 主要用途是跟踪一个“信号”,使其被活跃的副作用捕获, * 通常开发者无需调用它,访问响应式数据时内部会自动调用此 api。 * * @param signal - 需要跟踪的信号对象 * @param type - 信号操作类型,默认为`get` * @param debugData - 可选的调试数据,用于开发环境 */ export declare function trackSignal(signal: Signal, type?: SignalOpType, debugData?: ExtraDebugData): void; /** * 触发信号的处理函数 * * @param signal - 要触发的信号对象 * @param type - 信号操作类型,默认为`set` * @param debugData - 额外的调试数据,可选参数 */ export declare function triggerSignal(signal: Signal, type?: SignalOpType, debugData?: ExtraDebugData): void; /** * 解包 ref 包装,返回其 `.value` 值;普通值原样返回。 * * @param ref - 包装对象或普通值 * @example * ```js * unref(ref(0)) // 0 * unref(100) // 100 * ``` */ export declare function unref(ref: Ref | T): T; /** * 执行一个函数,使其内部访问的信号不会被关联到当前的副作用 * * @deprecated api名称已于 4.0.5 版本废弃,请使用 `untracked` 代替,将于 5.0.0 版本移除 */ export declare const untrack: typeof untracked; /** * 执行一个函数,使其内部访问的信号不会被关联到当前的副作用 * * @example * ```typescript * const data = reactive({ name: 'vitarx', age: 18 }) * watchEffect(() => { * console.log(data.name) // 输出:vitarx * console.log(untracked(() => data.age)) // 输出:18,但不会被关联 * }) * * data.age++ // 不会触发副作用 * ``` * * @param fn - 需要执行的函数,其内部的依赖关系不会被跟踪 * @returns - 函数执行的结果 */ export declare function untracked(fn: () => T): T; /** * 观察源数组类型 * * 观察源数组类型,用于批量观察多个数据源。 * * @template T - 观察源的数据类型 */ export declare type UnwarpSources = { [K in keyof T]: T[K] extends Ref ? V : T[K] extends AnyFunction ? ReturnType : T[K]; }; /** * 解包 Ref 类型,获取其内部值 * * @template T - 要解包的类型 * @returns 如果 T 是 Ref 类型,则返回其内部值类型;否则返回 T */ export declare type UnwrapRef = T extends Ref ? V : T; /** * 递归解包对象中的所有 Ref 类型 * * @template T - 要解包的对象类型 * @returns 如果 T 是 NonWrapped 类型,则直接返回 T;否则返回一个新类型,其中所有属性都被解包 */ export declare type UnwrapRefs = T extends NonWrapped ? T : { [K in keyof T]: UnwrapRef; }; /** * ValueRef 类是一个通用的引用类,实现了 Signal 和 Ref 接口 * 它可以存储和响应式地管理任意类型的值 * * @template T - 存储值的类型,默认为 any */ export declare class ValueRef implements RefSignal, T> { /** 标识这是一个信号对象 */ readonly [IS_SIGNAL]: true; /** 标识这是一个 Ref 对象 */ readonly [IS_REF]: true; /** 存储原始值 */ private _rawValue; /** * 创建一个新的 Ref 实例 * * @param initialValue - 初始值 * @throws {Error} 当尝试将一个信号转换为 ref 时抛出错误 */ constructor(initialValue: T); /** 存储处理后的值(可能被代理) */ private _value; /** * 获取当前值 * * 访问时会追踪依赖关系,并返回处理后的值 */ get value(): ToRefValue; /** * 设置新值 * * 如果新值与旧值相同则不执行任何操作。 * 否则更新值并触发依赖更新。 * * @param newValue - 新的值 */ set value(newValue: T); /** 偷偷读取value - 不触发跟踪!*/ get peek(): ToRefValue; /** 读取原始值 - 不触发跟踪!*/ get raw(): T; toString(): string; [Symbol.toPrimitive](hint: string): any; } /** * 监听 Ref 对象的变化 * * @template T - Ref 对象的类型 * @param {T} ref - 要监听的 Ref 对象 * @param {WatchCallback} cb - 变化回调函数 * @param {WatchOptions} [options] - 监听配置项 * @returns {Watcher} Watcher 实例,可调用 dispose() 停止监听 * @example * const count = ref(0) * watch(count, (newVal, oldVal) => { * console.log(`count changed from ${oldVal} to ${newVal}`) * }) * count.value++ // 触发回调 */ export declare function watch(ref: T, cb: WatchCallback, options?: WatchOptions): Watcher; /** * 监听响应式对象的变化 * * @template T - 响应式对象的类型 * @param {T} target - 要监听的响应式对象 * @param {WatchCallback} cb - 变化回调函数 * @param {WatchOptions} [options] - 监听配置项 * @param {boolean} [options.deep=false] - 是否深度监听嵌套属性 * @returns {Watcher} Watcher 实例,可调用 dispose() 停止监听 * @example * const state = reactive({ count: 0 }) * watch(state, (newVal, oldVal) => { * console.log('state changed', newVal, oldVal) * }, { deep: true }) * state.count++ // 触发回调 */ export declare function watch(target: T, cb: WatchCallback, options?: WatchOptions): Watcher; /** * 监听多个数据源的变化 * * @template T - 数据源数组的类型 * @param {T} sources - 数据源数组(可包含 Ref、响应式对象、getter 函数) * @param {WatchCallback>} cb - 变化回调函数,参数为新值数组和旧值数组 * @param {WatchOptions} [options] - 监听配置项 * @returns {Watcher} Watcher 实例,可调用 dispose() 停止监听 * @example * const firstName = ref('John') * const lastName = ref('Doe') * watch([firstName, lastName], ([newFirst, newLast], [oldFirst, oldLast]) => { * console.log(`${oldFirst} ${oldLast} -> ${newFirst} ${newLast}`) * }) * firstName.value = 'Jane' // 触发回调 */ export declare function watch(sources: T, cb: WatchCallback>, options?: WatchOptions): Watcher; /** * 监听 getter 函数返回值的变化 * * @template T - getter 函数返回值的类型 * @param {() => T} getter - 返回监听值的函数,函数内部会追踪响应式依赖 * @param {WatchCallback} cb - 变化回调函数 * @param {WatchOptions} [options] - 监听配置项 * @returns {Watcher} Watcher 实例,可调用 dispose() 停止监听 * @example * const state = reactive({ count: 1 }) * watch(() => state.count, (newVal, oldVal) => { * console.log(`count changed: ${oldVal} -> ${newVal}`) * }, { immediate: true }) */ export declare function watch(getter: () => T, cb: WatchCallback, options?: WatchOptions): Watcher; /** * WatchCallback 监听回调函数的类型。 * * @template T - 监听的源数据类型 */ export declare type WatchCallback = (newValue: T, oldValue: T, onCleanup: WatcherOnCleanup) => void; /** * 创建一个副作用效果观察器 * * 当依赖的响应式数据变化时自动执行副作用 * * @param effect - 一个回调函数,接收一个 onCleanup 函数作为参数,用于清理副作用 * @param [options] - 可选配置项,用于控制观察器的行为 * @param [options.flush = 'pre'] - 调度模式 * @param [options.onTrigger] - 调试钩子,在依赖发生变化时触发 * @param [options.onTrack] - 调试钩子,在跟踪依赖时触发 * * @returns {EffectWatcher} 返回一个 EffectWatcher 实例,可以用于手动停止观察 * * @example * ```ts * // 基本用法 * const count = ref(0); * * watchEffect(() => { * console.log('count changed:', count.value); * }); * * // Vue类比:类似于Vue 3中的watchEffect * // Vue 3: watchEffect(() => { console.log('count changed:', count.value); }) * * count.value++; // 输出: count changed: 1 * * // 使用清理函数 * watchEffect((onCleanup) => { * const timer = setTimeout(() => { * console.log('timeout executed'); * }, 1000); * * onCleanup(() => { * clearTimeout(timer); // 在下次执行前清理之前的定时器 * console.log('cleanup executed'); * }); * }); * * // 与watch的区别示例 * const state = reactive({ * firstName: 'John', * lastName: 'Doe' * }); * * // watchEffect - 立即执行并自动追踪依赖 * watchEffect(() => { * console.log(`Full name: ${state.firstName} ${state.lastName}`); * }); * * // watch - 需要显式指定监听源 * watch( * () => state.firstName, * (newVal, oldVal) => { * console.log(`First name changed: ${oldVal} -> ${newVal}`); * } * ); * * // 传递选项 * watchEffect( * () => { * console.log('executed'); * }, * { * flush: 'post', // DOM更新后执行 * onTrigger: (event) => console.log('triggered', event), * onTrack: (event) => console.log('tracked', event) * } * ); * ``` */ export declare function watchEffect(effect: (onCleanup: WatcherOnCleanup) => void, options?: WatcherOptions): EffectWatcher; /** * Watcher 抽象基类 * - 初始化调度器 * - 实现调度逻辑 * - 抽象 runEffect 方法由子类实现 * - 实现 beforeDispose 和 afterDispose,清理资源 * * 注意事项: * - 子类如重写了 beforeDispose / afterDispose,必须调用 super.beforeDispose / afterDispose 来清理资源。 * - 子类必须实现 runEffect 方法,用于执行副作用,不需要重复添加 try-catch。 * - 子类不应该调用 runEffect 方法,如需主动执行可调用 execute 方法。(无异步调度) * - run 方法是提供给信号系统使用的,非必要不要主动调用此方法。(有异步调度) * - 子类应该需要使用 collectSignal / linkSignalWatcher 助手函数来绑定依赖关系。(销毁时会自动解绑) * * @abstract * @implements EffectRunner */ export declare abstract class Watcher extends Effect { private dirty; /** * 静态缓存 scheduler 对象,用于存储不同 flush 模式对应的调度器实例。 * * @private */ private static readonly schedulerMap; /** * 调度器 * * 可以修改,但不建议运行时动态修改。 * * @default `queuePreFlushJob` */ scheduler: Scheduler_2; /** cleanup 回调 */ private readonly cleanups; /** 副作用句柄 */ protected readonly effectHandle: EffectRunner; /** * 构造函数 * @param options 调试钩子选项 */ constructor(options?: WatcherOptions); /** * 添加清理函数 * * @param cleanupFn - 清理函数 * @throws {TypeError} 如果清理函数不是函数类型,则抛出一个类型错误 */ readonly onCleanup: (cleanupFn: VoidCallback) => void; /** * 重写恢复后的处理方法 * 当组件或实例恢复后,此方法会被调用 * 主要用于检查是否有未执行的任务,并在需要时重新调度执行 */ protected afterResume(): void; /** * 在对象被销毁前执行清理操作 * 这是一个重写的方法,用于在组件或实例被销毁前执行必要的清理工作 * * @protected */ protected beforeDispose(): void; /** * 执行副作用逻辑 * * 抽象方法,由子类实现具体的副作用逻辑。 * * @warning 子类不应直接调用此方法,而应使用: * - execute() - 同步执行副作用 * - schedule() - 通过调度器执行副作用(可能异步) * * @abstract * @protected */ protected abstract runEffect(): void; /** * 报告观察器相关的错误 * * 重写父类的错误报告方法,在错误来源前添加 'watcher.' 前缀, * 以便更好地追踪错误发生在观察器的哪个环节。 * * @param e - 发生的错误对象 * @param source - 错误来源标识,如 'trigger'、'getter'、'callback' 等 * @override 重写父类的 reportError 方法 * * @example * ```typescript * // 在 getter 中发生错误时 * this.reportError(error, 'getter') // 输出: watcher.getter * * // 在回调执行中发生错误时 * this.reportError(error, 'callback') // 输出: watcher.callback * ``` */ protected reportError(e: unknown, source: string): void; /* Excluded from this release type: runCleanup */ } /** * 观察者清理回调函数类型 * * 用于注册清理函数,在观察者下一次执行前或被停止时调用。 * * @param cleanupFn - 需要执行的清理函数 * * @example * ```typescript * watch(count, (newVal, oldVal, onCleanup) => { * const timer = setTimeout(() => { * console.log('delayed execution') * }, 1000) * * // 注册清理函数 * onCleanup(() => { * clearTimeout(timer) * }) * }) * ``` */ export declare type WatcherOnCleanup = (cleanupFn: VoidCallback) => void; /** * 观察器配置选项接口 * * 该接口扩展了 DebuggerOptions,提供了专门用于观察器的额外配置选项。 * 此接口定义在 types.ts 以消除 watcher.ts ↔ types.ts 的循环依赖 * (types.ts 不再反向依赖 watcher.ts)。 * * @property {DebuggerHandler} [onTrigger] - trigger 调试钩子 * @property {DebuggerHandler} [onTrack] - track 调试钩子 * @property {FlushMode} [flush='pre'] - 指定副作用执行时机 * @property {boolean|EffectScope} [scope=true] - 作用域 */ export declare interface WatcherOptions extends DebuggerOptions { /** * 作用域 * * - true 表示当前效果将自动加入当前作用域。 * - false 表示当前效果将不会加入任何作用域。 * - EffectScope 对象:表示当前效果将加入指定的作用域。 * * @default true */ scope?: EffectScope | boolean; /** * 指定副作用执行时机 * * - 'pre':在主任务之前执行副作用 * - 'main':主任务(视图更新是主任务,业务侧不应该使用此模式) * - 'post':在主任务之后执行副作用 * - 'sync':同步执行副作用 * * @default 'pre' */ flush?: FlushMode; } /** * 观察选项接口 * * 扩展自 WatcherOptions,提供了额外的观察配置选项。 */ export declare interface WatchOptions extends WatcherOptions { /** * 是否立即执行回调函数 * * @default false */ immediate?: boolean; /** * 是否深度监听对象 * * @default false */ deep?: boolean | number; /** * 是否只监听一次 * * @default false */ once?: boolean; } /** * 创建一个在下一次 DOM 更新后执行副作用效果观察器 * * @param effect - 一个回调函数,接收一个 onCleanup 函数作为参数,用于清理副作用 * @param [options] - 可选配置项,用于控制观察器的行为 * @returns {EffectWatcher} 返回一个 EffectWatcher 实例,可以用于手动停止观察 */ export declare function watchPostEffect(effect: (onCleanup: WatcherOnCleanup) => void, options?: Omit): EffectWatcher; /** * 观察源类型 * * 定义可以被观察的数据源类型,包括: * - 信号对象 (AnySignal) * - 引用对象 (RefWrapper) * - getter 函数 (() => T) * - 对象类型 (T extends object ? T : never) * * @template T - 观察源的数据类型 */ export declare type WatchSource = Ref | (() => T) | (T extends object ? T : never); /** * 创建一个在同步操作后执行副作用效果观察器 * * @param effect - 一个回调函数,接收一个 onCleanup 函数作为参数,用于清理副作用 * @param [options] - 可选配置项,用于控制观察器的行为 * @returns {EffectWatcher} 返回一个 EffectWatcher 实例,可以用于手动停止观察 */ export declare function watchSyncEffect(effect: (onCleanup: WatcherOnCleanup) => void, options?: Omit): EffectWatcher; export { }