typescript builder reducer pattern
reduce实现异步串行重复请求同一个接口
在项目中会遇到循环请求接口的情况，不管使用 for、forEach、map 进行循环都会出现并行请求接口出现高并发，使用reduce实现异步串行重复请求同接口，等待上一次请求结束后在进入下一次请求。 需要循环的对象数组： let loopList = [ { code:1, name:"名称1", ......
[React Typescript] Strongly typed React component `as`
The `as` Prop in React Option 1: import { Equal, Expect } from '../helpers/type-utils'; export const Wrapper = <TProps extends keyof JSX.IntrinsicElem ......
携程度假基于 RPC 和 TypeScript 的 BFF 设计与实践
携程度假基于 RPC 和 TypeScript 的 BFF 设计与实践 原创2023-08-11 10:38·携程技术 一、前言 随着多终端的发展，前后端的数据交互的复杂性和多样性都在急剧增加。不同的终端，其屏幕尺寸和页面 UI 设计不一，对接口的数据需求也不尽相同。构建一套接口满足所有场景的传统方 ......
java与es8实战之六：用JSON创建请求对象(比builder pattern更加直观简洁)
向ES发送请求时，如何创建请求对象呢？官方推荐的builder patter，在面对复杂的请求对象结构时还好用吗？有没有更加直观简洁的方法，尽在本文一网打尽 ......
Builder Pattern —— Structure Class
# Core 建造者模式又称为`生成器模式`，主要用于对复杂对象的构建、初始化，它可以将多个简单的组件对象按顺序一步步组装起来，最终构建成一个复杂的成品对象。 与工厂系列模式不同的是，建造者模式的主要目的在于把烦琐的**构建过程**从不同对象中抽离出来，使其脱离并独立于产品类与工厂类，最终实现**用 ......
Observer Patterns —— Behavorial Class
# Oberver Define Observer Patterns 定义对象间的**一种一对多**的依赖关系，当一个对象的状态发生改变时，所有依赖于它的对象都会得到通知并被自动更新。 # Key elements - 主题（Subject）interface - 主题（Subject） - 订阅者 ......
Composite Pattern —— Structure Class
> 说实话，我也没想到这个模式能在哪里运用上，暂时只是Demo理解阶段。 # What is Composite Pattern Composite Pattern（组合模式）也叫叉数、对象树、Object Tree、...。它的思想很类似自然界的树状结构。 ![](https://img2023. ......
[React Typescript] Strongly typed HOC component
import { Router, useRouter } from "fake-external-lib"; export const withRouter = <TProps extends { router: Router }>( Component: React.ComponentType<T ......
Prototype Pattern —— Creational Class
# Background knowledge 在Java中，Cloneable 接口是一个标记接口（Marker Interface），用于指示实现了该接口的类可以进行克隆操作。它并没有定义任何方法，只是起到一个标记的作用。 要实现克隆功能，需要满足以下两个条件： - 类实现了 Cloneable ......
Factory Pattern —— Creational Class
# core 工厂模式（Factory Pattern）是一种创建型设计模式，用于创建对象而不暴露对象创建的逻辑。它将对象的实例化过程封装在一个工厂类中，客户端通过调用工厂类的方法来创建对象，从而实现了解耦和灵活性。 工厂模式的核心思想是将对象的创建与使用分离。客户端不直接实例化对象，而是通过调用工 ......
Singleton pattern —— Creational Class
# Guide 1. 先知道为什么要用单例模式； 2. 单例模式两种创建模式的认识： - 启动程序时马上创建；（积极型） - 启动程序后也不创建，只在用到时才创建，不用就不创建； （懒惰型） 3. 懒惰型单例模式将遇到的多线程安全问题，所以就要学习升级版的懒惰型单例模式。 # What is sin ......
20230626 java.util.regex.Pattern
## 介绍 - java.util.regex.Pattern - public final class Pattern implements java.io.Serializable - 正则表达式的编译表示 ## API ### 常量 flag - UNIX_LINES - 启用 UNIX 行模 ......
typescript学习
1、unknown 和 any 区别 any 放弃了类型检查。 unknown 只是指明了类型还未确认，后续还需要你去断言 2、组合类型 联合： type MyBool = 'open' | 'closed' | 'minimized' 泛型 interface Backpack<T> { add: ......
[React Typescript] Fixing forwardRef's Type
Fix forwardRef globally To jump ahead to the solution, uncommenting the following code from Stefan Baumgartner will globally override the value of for ......
[React Typescript] Strongly type Shared props for multiple components (React.FC<propsType>)
import { Equal, Expect } from "../helpers/type-utils"; type InputProps = React.ComponentProps<"input">; const COMPONENTS = { text: (props) => { return ......
【数据结构与算法】TypeScript 实现图结构
```ts class Grapg { // 用于存储所有的顶点 verteces: T[] = []; // 用于存储所有的边 采用邻接表的形式 adjList: Map = new Map(); // 添加顶点 addVertex(v: T) { this.verteces.push(v); / ......
Swift - 高阶函数介绍（map、flatMap、filter、reduce）
Swift - 高阶函数介绍（map、flatMap、filter、reduce） https://blog.csdn.net/Alexander_Wei/article/details/78543410?spm=1001.2101.3001.6650.3&utm_medium=distribute ......
用js reduce 写一个reduce循环遍历数组对象，里面带有if判断
* 简单的reduce案例，实际场景中使用不多，这里给到一个常用的遍历数组对象！！ ``` var products = [ { name: "Apple", price: 2.5, quantity: 3 }, { name: "Banana", price: 1.5, quantity: 2 } ......
[React Typescript] Strongly type Render prop
1. React.ReactNode import { useState } from "react"; import { createPortal } from "react-dom"; import { Equal, Expect } from "../helpers/type-utils"; ......
[React Typescript] Strongly Typing Lazy Loaded Components with Generics
Navigating to the type definition for lazy by CMD + click in local VS Code, or in the DefinitelyTyped repo. We can see the following definition: funct ......
TypeScript – Decorator Metadata
前言 在 TypeScript – Decorator 装饰器 里，我有提到 TypeScript 只实现了 decorate 的特性，把 metadata 的特性独立了出来。 本来我以为还需要等待很长的时间他们才会实现，没想到 v5.2 既然推出了。哎哟，不错哦！ 声明: Decorator 不是 ......
TypeScript – Using Disposable
前言 TypeScript v5.2 多了一个新功能叫 Disposable。 Dispose 的作用是让 "对象" 离开 "作用域" 后做出一些 "释放资源" 的操作。 很多地方都可以看到 Dispose 概念。比如 Web Component 的 disconnectedCallback，Ang ......
搭建前端Vue框架的步骤，包括TypeScript、ESLint、Prettier和Vite的配置
搭建前端Vue框架需要以下步骤： 1. 安装Node.js和npm 2. 创建一个新的Vue项目 ``` vue create my-project ``` 3. 安装TypeScript ``` npm install --save-dev typescript ``` 4. 配置TypeScri ......
TypeScript 5.1
getter 和 setter 可以完全不同类型了 以前我们提过，getter 的类型至少要是其中一个 setter 的类型。这个限制被突破了。现在可以完全使用不同类型了。 v5.1 后，没有再报错了 ......
TypeScript – 冷知识
当 generic return 遇上 parameter 报错了。原因是 querySelector 默认返回类型是抽象的 Element。 而 method 参数要求的是具体的 InputElement 解决方法是传入具体的 InputElement 类型 const input = docum ......
typeScript学习-Record和Map对比
typeScript学习 Record 和 Map 对比 Record 是属于一个轻量级的 type 类型,Map 相对 Record 是重量级。 Map 不能像 Record 一样直接转换为普通的对象，来应对只有查询的实际问题，只是为了频繁的查询去 new 一个 Map 是一种不必要的浪费。 如果 ......
TypeScript（TS）JavaScript（JS）中的所有循环方法
for循环： for (let i = 0; i < array.length; i++) { // 循环体 } for…of循环： for (const element of array) { // 循环体 } forEach方法： array.forEach((element) => { // ......
[React Typescript] Updating the Global Namespace for an Additional Attribute
I want to add a common attribute to dom element globally: <> <div testId="123" /> <audio testId="123" /> <video testId="123" /> <a testId="123" /> <ab ......
typeScript学习-函数重载
typeScript学习 函数重载 定义：一组具有相同名字，不同参数列表的和返回值无关并且具有一个实现签名和一个或多个重载签名的函数。 type Messgae = { id: number, type: MessgaeType, sendmessage: string } enum Messgae ......
typescript 数组根据指定字段去重
this.listDataIn = data.Result.data; const uniqueItems: Item[] = Array.from( new Set(this.listDataIn.map(item => item.MyLandID)) ).map(id => { return o ......