JavaScript 中原型对象怎么支持泛型化传参封装-js教程-PHP中文网

javascript原生不支持泛型语法，所谓“原型对象支持泛型化传参封装”实为通过工厂函数+typescript泛型或运行时校验实现类型约束与复用，核心是将泛型逻辑置于工厂函数或class声明中，而非直接作用于prototype。

javascript 中原型对象怎么支持泛型化传参封装

JavaScript 原生不支持泛型语法（如 <t></t>），所谓“原型对象支持泛型化传参封装”，实质是**用函数+类型提示（TypeScript）或运行时校验+灵活参数设计，在原型链上实现可复用、可约束、可推断的构造逻辑**。核心不是让 prototype 本身泛型化，而是让基于原型的对象创建过程具备类型参数的表达能力。

用工厂函数封装原型逻辑，配合 TypeScript 泛型

这是最实用、最主流的做法：把泛型逻辑放在工厂函数里，再将实例方法挂载到原型上，既复用原型方法，又保留类型参数控制权。

定义一个泛型工厂函数，接收类型参数 T，返回带该类型约束的构造器
构造器的 prototype 方法使用 this 类型或泛型参数，确保调用时类型正确
避免直接在 prototype 上写 <t></t> —— 那会报错，因为原型对象本身不是函数作用域

示例：

// ✅ 正确：泛型在工厂函数层面，原型方法通过 this 推导
function createTypedContainer<t>(initial: T) {
  function Container(value: T) {
    this.value = value;
  }
  Container.prototype.map = function<u>(fn: (v: T) => U): Container<u> {
    return new Container(fn(this.value));
  };
  Container.prototype.get = function(): T {
    return this.value;
  };
  return new Container(initial);
}

// 使用时类型自动推导
const numContainer = createTypedContainer(42);        // Container<number>
const strContainer = numContainer.map(String);       // Container<string></string></number></u></u></t>

用 class + 泛型声明替代手动 prototype 操作

ES6 class 本质仍是原型链，但更适配泛型——TypeScript 允许在类名后直接声明泛型参数，所有实例方法自然继承该类型上下文。

Alibabacloud Sdk Client Initialization For Java

在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。

下载

class Box<t></t> 的所有实例共享同一份原型，但每个实例的 this 和方法返回值都受 T 约束
无需手动操作 prototype，也避免了泛型丢失或类型擦除问题
编译后 JS 仍为原型结构，不影响运行时行为

示例：

class Box<t> {
  constructor(public value: T) {}

  transform<u>(fn: (t: T) => U): Box<u> {
    return new Box(fn(this.value));
  }

  inspect(): string {
    return `Box(${this.value})`;
  }
}

const b1 = new Box<number>(100);
const b2 = b1.transform((n) => n.toString()); // 自动推导为 Box<string></string></number></u></u></t>

运行时泛型模拟：靠参数结构和校验支撑“伪泛型”行为

纯 JavaScript 环境下，可通过配置对象、Symbol 标记或构造器元数据模拟泛型语义，让原型方法根据传入参数动态适配行为。

例如：原型上的 create() 方法接受一个 schema 描述，决定返回对象的结构和校验规则
搭配 Object.setPrototypeOf() 可切换行为原型，但注意这不等于类型泛型，只是运行时多态
适合配置驱动、低耦合场景，比如表单字段生成器、API 响应解析器

示例：

function createSchemaBasedFactory(schema) {
  function Factory(data) {
    Object.assign(this, data);
  }
  Factory.prototype.validate = function() {
    return Object.keys(schema).every(key => 
      schema[key].test?.(this[key]) ?? true
    );
  };
  Factory.prototype.toJSON = function() {
    return JSON.stringify(this);
  };
  return Factory;
}

const UserFactory = createSchemaBasedFactory({
  id: { test: Number.isInteger },
  name: { test: (v) => typeof v === 'string' && v.length > 0 }
});
const user = new UserFactory({ id: 123, name: 'Alice' });
console.log(user.validate()); // true