首页 > 其他分享 >TypeScript 泛型

TypeScript 泛型

时间:2024-10-01 10:12:38浏览次数:6  
标签:TypeScript console log val getId 类型 泛型

泛型是可以在保证类型安全的前提下,让函数等与多重类型一起工作,从而实现复用。常用于:函数、接口、class中。

泛型在定义的时候并不知道具体是什么类型,只有在调用的时候才知道是什么类型。 

如下:

   /*
        需求:定义一个getId方法,传入一个值,返回这个值
    */
    function getId<T>(val: T) {
        return val;
    }
    console.log(getId<number>(3));//在调用的时候才知道是什么意思
      console.log(getId<boolean>(true));       console.log(getId<string>('abcdef')); 上述代码中<T>是声明泛型,而val:T是使用泛型。调用泛型的时候才指定数据类型。 同时上述调用时候getId后面的<number>是可以忽略的,因为调用的时候就会判断是什么类型了,可以简化一些。 给泛型添加接口约束。
/*
        泛型中的接口约束
    */
    interface Ilength {
        length: number
    }

    function getId<T extends Ilength>(val:T) {
        console.log(val.length);
        return val;
    }
    
    getId('hello');

此时要传入字符类型,不能传入数字类型,因为字符类型有length,但是数字类型没有。

需求:定义一个函数,参数分别为对象和属性名,根据属性名返回属性值
   function getProp<O, K extends keyof O>(obj: O, key: K) {
        return obj[key]
    }
    const p1 = {
        name:'yansunda',
        age:18
    }
    console.log(getProp(p1, 'name'));

这个keyof表示取的K来自于O的属性。这样子才不会报错。

 

     

标签:TypeScript,console,log,val,getId,类型,泛型
From: https://www.cnblogs.com/yansunda/p/18441606

相关文章

  • Collection实现类、迭代器、泛型
    1.Collection实现类1.1.集合的由来        先说说集合的由来,假如现在有一个需求:存储80个学生的一门成绩。那么我们有以下存储方式:        1.变量:如果存取内容比较多,需要一个一个声明,声明80个变量,每个变量存储一个学生成绩             ......
  • c++泛型编程
    一、模板template1.1概念C++重模板可以让类或函数声明一种通用类型,使得函数或类中的某些成员变量或成员变量的参数、返回值在实际上的使用中可以是任何类型。模板可以让程序员写出与类型无关的代码,是泛型编程的基础。模板主要分为两种实现方式:函数模板类模板1.2函数......
  • TypeScript 接口、继承
    接口类型作用:给对象约束属性和方法基础语法:interface接口名{属性名:类型}接口名称推荐以I开头接口声明后,直接使用接口名称作为变量类型interfaceperson{name:stringage:numbergender:stringsayHi:()=>void......
  • TypeScript:模块
    一、前言关于术语的一点说明:请务必注意一点,TypeScript1.5里术语名已经发生了变化。“内部模块”现在称做“命名空间”。“外部模块”现在则简称为“模块”,这是为了与ECMAScript2015里的术语保持一致,(也就是说moduleX{相当于现在推荐的写法namespaceX{)。......
  • 【TypeScript】函数详解:参数和返回值的类型注解
    文章目录一、函数基础概述1.参数类型注解2.参数个数检查3.可选参数和默认值二、返回值类型注解1.基本的返回值类型注解2.自动类型推断三、异步函数与Promise返回值类型四、匿名函数与上下文类型推断五、高阶函数与回调六、总结TypeScript是JavaScript的......
  • TypeScript入门指南
    文章目录TypeScript入门指南引言什么是TypeScript?为什么选择TypeScript?安装TypeScriptTypeScript基础1.定义变量类型2.接口3.类常见面试题Q:TypeScript和JavaScript有什么区别?Q:我需要在哪里运行TypeScript代码?结语进一步阅读TypeScript入门指南引言如果你......
  • TypeScript入门指南2
    文章目录TypeScript入门指南2作用方法使用场景缺陷总结TypeScript入门指南2作用TypeScript是JavaScript的一个超集,它为JavaScript添加了静态类型系统。这意味着你可以在编码时获得类型检查的额外好处,同时仍然能够编写能够在任何浏览器上运行的代码。TypeScrip......
  • 章15——泛型generic
    泛型的引入泛型引入前后代码的比较publicstaticvoidmain(String[]args){ArrayListarrayList=newArrayList();arrayList.add(newDog("wang",10));arrayList.add(newDog("xin",1));arrayList.add(newDog("ran&quo......
  • 【JAVA-数据结构】包装类&简单认识泛型(1)
        这篇包含包装类和泛型相关知识,会用两篇文章进行讲解。1包装类        在Java中,由于基本类型不是继承自Object,为了在泛型代码中可以支持基本类型,Java给每个基本类型都对应了一个包装类型。1.1基本数据类型和对应的包装类除了Integer和Character......
  • 掌握 React 中的 useImperativeHandle(使用 TypeScript)
    使用typescript构建react应用程序时,开发人员经常遇到需要创建具有高级功能的自定义、可重用组件的场景。本文将探讨两个强大的概念:用于对引用管理进行细粒度控制的useimperativehandle挂钩,以及创建表单验证和模态组件等自定义组件。我们将深入探讨:useimperativehandle钩子:......