EventEmitter Initial Version class EventEmitter{ constructor(){ this.events={} } on(type,listener){ if(!this.events[type]){ this.events[type]=[] } this.events[type].push(listener) } emit(type,...args){ this.events[type].forEach(listener=>{ listener.call(this,...args) }) } off(type,listener){ if(this.events[type]){ const index=this.events[type].indexOf(listener) if(index!==-1){ this.events[type].splice(index,1) } } } once(type,listener){ const onceListener=(...args)=>{ listener.call(this,...args) this.off(type,onceListener) } this.on(type,onceListener) } } Testing const eventEmitter=new EventEmitter() const listener=(args)=>{ console.log(args); } eventEmitter.once('test',listener) eventEmitter.off('test',listener) eventEmitter.emit('test',{a:1}) When executing the above code, you’ll find that the test event was triggered once, but it should not execute because it was turned off. The solution is as follows.
Mar 18, 2025
Click-to-component is a React component that enables one-click navigation to source code, significantly improving development efficiency. Here I attempt to read the source code and document key points. Source Code Structure The project uses pnpm as the package management tool, with pnpm workspace managing multiple packages.
Dec 31, 2024
This article introduces important details to note when using Antd, including advantages, implementation details, and related resources to improve efficiency.
Feb 20, 2020
This article provides a detailed comparison between JSX.Element and React.ReactNode types in React with TypeScript, including their differences, usage scenarios, and practical examples from antd source code.
Sep 28, 2019