effect测试

//effect.spec.ts
 it('runner', () => {
        // runner 就是 effect(fn) 返回一个函数,执行该函数就相当于重新执行了一次传入 effect 的 fn
        // 同时执行 runner 也会将 fn 的返回值返回
        let foo = 1
        const runner = effect(() => {
            foo++
            return 'foo'
        })
        expect(foo).toBe(2)
        // 调用 runner
        const r = runner()
        expect(foo).toBe(3)
        // 获取 fn 返回的值
        expect(r).toBe('foo')
    })
//effect.ts
let activeEffect 
class ReactiveEffect{
    private _fn
    constructor(fn){
        this._fn = fn
    }
    run(){
        activeEffect = this
        let res =this._fn()
        //返回执行后的fn
        return res
    }
}
export function effect(fn){
    const _effect = new ReactiveEffect(fn)
    _effect.run()
    //通过bind改变this指向
    return _effect.run.bind(_effect)
 }

ohoherror
21 声望1 粉丝