lhuanyu
lhuanyu
常用到的设计模式,ts/js 中已经提供了 decorator 支持该设计模式的使用,并且提供了非常丰富的功能:参数/属性/方法装饰器等 ```typescript /** * The base Component interface defines operations that can be altered by * decorators. */ interface Component { operation(): string; } /** * Concrete...
组合模式是一个非常常见的设计模式,从下面的一个例子体会将复杂的繁琐的计算拆分成数结构进行递归计算:  可以用来优化 word-to-html 库中的代码,树结构很容易联想到虚拟 dom 树/fiber 树等等。
在原有的代码片段中,这样使用 Target 类的: ```typescript /** * The Target defines the domain-specific interface used by the client code. */ class Target { public request(): string { return 'Target: The default target\'s...
A:什么是单例模式? B:是一种创建型设计模式, 让你能够保证一个类只有一个实例, 并提供一个访问该实例的全局节点。 A:为什么需要单例模式? B:有的场景下我们可能需要在不同的模块中共享一些数据,但是又不想利用全局变量来实现,因为那样的方式会在其他开发者无感知的情况下修改了全局变量的值。 #### 单例模式的实现方式之一 > 单例的获取只能通过类的公共静态方法getInstance获取,而且通过将类的静态属性instance**私有化**来阻止修改以创建的单例 ```typescript /** * The Singleton class defines the `getInstance` method that lets clients access * the unique singleton instance. */...
```typescript /** * The Builder interface specifies methods for creating the different parts of * the Product objects. */ interface Builder { producePartA(): void; producePartB(): void; producePartC(): void; } /**...
```typescript /** * The Creator class declares the factory method that is supposed to return an * object of a Product class. The Creator's subclasses usually provide the * implementation...
设计模式体现了代码的抽象能力 1. 算法与设计模式的区别:算法总是明确定义达成特定目标所需的一系列步骤, 而模式则是对解决方案的更高层次描述。 2. 模式类别: - **创建型模式**提供创建对象的机制, 增加已有代码的灵活性和可复用性。 - **结构型模式**介绍如何将对象和类组装成较大的结构, 并同时保持结构的灵活和高效。 - **行为模式**负责对象间的高效沟通和职责委派。
https://medium.com/swlh/should-you-use-usememo-in-react-a-benchmarked-analysis-159faf6609b7
https://medium.com/nmc-techblog/why-you-should-stop-using-the-container-presentational-pattern-in-redux-29b112406128 > 容器组件订阅了 redux 中的一大块数据,分发给各个UI组件,导致了子组件的重新渲染,其实在类组件中也会有这样的问题,一般的解决办法是拆分以及使用 useMemo,或者 React.memo 来做。但是下一 issue(文章) 会说到 useMemo 的一些需要注意的地方。
1. https://www.chromestatus.com/feature/5516876633341952 2. https://kangax.github.io/compat-table/es6/