TypeScript进阶篇 --- 类型别名&&字符串字面量类型

最新推荐文章于 2024-10-22 09:35:32 发布

原创最新推荐文章于 2024-10-22 09:35:32 发布 · 761 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #typescript

个人学习同时被 2 个专栏收录

50 篇文章

订阅专栏

TypeScript

19 篇文章

订阅专栏

本文探讨了JavaScript中的类型别名和字符串字面量类型，如何通过type定义新的类型名称，以及它们在联合类型和约束参数值的应用实例，帮助开发者理解和使用这些高级特性。

类型别名

类型别名用来给一个类型起个新名称。

简单的例子

    type Name = string ;
    type NameResolver = () => string;
    type NameOrNameResolver = Name | NameResolver ;
    function getName(n:NameOrNameResolver):Name{
        if(typeof n == 'string'){
            return n
        }
        return n()
    }

上例中，我们使用type创建类型别名。
类型别名常用于联合类型。

字符串字面量类型

字符串字面量类型用来约束取值只能是某几个字符串中的一个。

简单的例子

    type EventNames = 'click' | 'scroll' | 'mousemove';
    function handleEvent(ele: Element, event: EventNames) { }
    handleEvent(document.getElementById('hello'), 'scroll');  // 没问题
    handleEvent(document.getElementById('world'), 'dblclick'); // 报错，类型“"dblclick"”的参数不能赋给类型“EventNames”的参数。

上例中，我们使用type定义了一个字符串字面量类型EventNames，它只能取三种字符串中的一种。
注意,类型别名与字符串字面量类型都是type进行定义的。