企业官网建设流程全解析

网站建好了 如何推广,官方网站首页,有网络但是网页打不开,做视频网站要多大的带宽一、问题的引入 需求#xff1a;创建一个函数#xff0c;我想要传入啥参数#xff0c;就返回啥#xff0c;传入的参数和返回的值的类型相同#xff0c;那么针对这个需求#xff0c;我们应该如何去做#xff0c;大家很快就会想到下面的这种办法。 function hhh(value: …一、问题的引入需求创建一个函数我想要传入啥参数就返回啥传入的参数和返回的值的类型相同那么针对这个需求我们应该如何去做大家很快就会想到下面的这种办法。functionhhh(value:number):number{returnvalue}但是这样写只能接收数字们不能适合其他的类型这样就不能实现需求那如何写呢functionhhh(value:any):any{returnvalue}这样将参数的类型修改成any这个能实现但是意义在哪这不就失去了TS最本身的对类型的保护了吗这样写实在是不安全。那么我们该如何写functionhhhType(value:Type):Type{returnvalue}functionhhhT(value:T):T{returnvalue}二、什么是泛型泛型就是可以在保证类型安全的前提下让函数等多种类型一起工作从而去实现复用。常见使用的地方函数、接口、class中。定义泛型函数functionhhhType(value:Type):Type{returnvalue}functionhhhT(value:T):T{returnvalue}在函数名称的后面添加 尖括号)尖括号中添加类型变量比如此处的 Type 是一种特殊类型的变量它处理类型而不是值该类型变量相当于一个类型容器能够捕获用户提供的类型就是你写的是啥类型就会可以给你捕获出来可以实现任意合法变量传入和返回值需求的实现。泛型函数的调用constnumhhhnumber(10)conststrhhhstring(a)简化的写法// 省略 number 调用函数letnumhhh(10)letstrhhh(a)推荐使用这种简化的方式调用泛型函数使代码更短更易于阅读说明当编译器无法推断类型或者推断的类型不准确时就需要显式地传入类型参数三、泛型的约束默认情况下泛型函数的类型变量 Type 可以代表多个类型这导致无法访问任何属性比如length属性这个时候就要为泛型添加约束来收缩类型。有两个方式直接指定添加的具体的类型functionidType(value:Type[]):Type[]{console.log(value.length)returnvalue}这个时候就能访问这个length属性了。添加约束创建描述约束的接口 ILength该接口要求提供 length 属性通过 extends关键字使用该接口为泛型(类型变量)添加约束该约束表示传入的类型必须具有 length 属性// 创建一个接口interfaceILength{length:number}// Type extends ILength 添加泛型约束functionhhhTypeextendsILength(value:Type):Type{console.log(value.length)returnvalue}四、泛型可以有多个变量类型泛型的类型变量可以有多个并且类型变量之间还可以约束(比如第二个类型变量受第一个类型变量约束) 比如创建一个函数来获取对象中属性的值functionhhhType,KeyextendskeyofType(obj:Type,key:Key){returnobj[key]}letperson{name:jack,age:18}hhh(person,name)五、泛型接口和泛型的配合// 泛型接口作为函数返回值类型interfaceResultT{success:boolean;data:T;}// 函数返回泛型接口适配不同返回值类型functiongetResultT(data:T):ResultT{return{success:true,data};}// 使用传入字符串返回Resultstringconstres1getResult(Hello 泛型);// 传入对象返回Result{name: string}constres2getResult({name:张三});泛型接口核心interface 接口名 { … }用T占位类型使用时接口名具体类型比如Data、Result优势一套接口适配多种类型不用重复写多个相似接口。六、总结核心解决的问题泛型弥补了 “单一类型函数复用性差” 和 “any 类型丢失类型保护” 的缺陷既能实现函数 / 接口 / 类的通用化又能严格约束输入输出的类型一致性。核心语法与使用定义在函数 / 接口 / 类名称后通过TT 为类型变量可自定义命名声明泛型T 作为 “类型容器” 捕获用户传入的具体类型调用推荐省略显式类型如hhh(10)TS 会自动推断类型仅在推断失效时显式指定如hhhstring(a)。关键扩展能力泛型约束通过extends关键字收缩类型范围如Type extends ILength解决泛型无法访问属性的问题多泛型变量支持多个类型变量且可相互约束如Key extends keyof Type适配对象属性访问等复杂场景泛型接口接口定义时声明T使用时指定具体类型如Resultstring实现一套接口适配多类数据结构。核心优势兼顾 “复用性” 与 “类型安全”避免重复编写相似的类型定义同时保留 TS 的类型校验能力是实现通用化、可扩展 TS 代码的核心手段。