介绍typescript

复制代码
       // 一、类型推断
            let age : number = 20;
            // age = '123'; // 报错
            /* 
            TypeScript 允许我们给变量设置一个类型,不过上面的写法太啰唆了。TypeScript 有一个类型
            推断机制,也就是说 TypeScript 会根据为变量赋的值自动给该变量设置一个类型。我们用更简洁
            的语法改写上面的代码。
            */
            let existsFlag = true;
            // existsFlag = 1; // 报错
            /* 
            TypeScript 允许我们给变量设置一个类型,不过上面的写法太啰唆了。TypeScript 有一个类型
            推断机制,也就是说 TypeScript 会根据为变量赋的值自动给该变量设置一个类型。我们用更简洁
            的语法改写上面的代码。
            */
            /* 
            如果没有为变量设置类型,它的类型会被自动设置为 any,意思是可以接收任何值,就像在
            普通 JavaScript 中一样。
            */

        // 二、接口
            /* 
            在 TypeScript 中,有两种接口的概念。第一种就像给变量设置一个类型,如下所示。
            */
            interface Person {
            name: string;
            age: number;
            }
            function printName(person: Person){
            console.log(person.name);
            
            }

            /* 
            第一种 TypeScript 接口的概念是把接口看作一个实际的东西。它是对一个对象必须包含的属
            性和方法的描述。
            这使得 VSCode 这样的编辑器能通过 IntelliSense 实现自动补全
            */

            const join = {name: '大胡子',age: 12};
            const mary = {name: '小白',age: 123, phone: '123456'}

            printName(join);
            printName(mary)

            // 再次运行 tsc 命令之后,我们会在 hello-world.js 文件中得到下面的结果
            function printName(person) {
                console.log(person.name);
            }
            var join = { name: '大胡子', age: 12 };
            var mary = { name: '小白', age: 123, phone: '123456' };
            printName(join);
            printName(mary);

            // 第二种 TypeScript 接口的概念和面向对象编程相关
            interface Comparable {
                compareTo(b) : number;
            }

            class MyObject implements Comparable {
                age : number;
                compareTo(b):number {
                    if(this.age === b.age) {
                        return 0
                    }
                    return this.age > b.age ? 1 : -1;
                }
            }
            /* 
            Comparable 接口告诉 MyObject 类,它需要实现一个叫作 compareTo 的方法,并且该方
            法接收一个参数。在该方法内部,我们可以实现需要的逻辑。
            */
        // 三、泛型
            // 用尖括号向 Comparable 接口动态地传入 T 类型,可以指定 compareTo 函数的参数类型。
            interface Comparable<T> {
                compareTo(b: T) : number;
            }   
            class MyObject implements ComparableL<MyObject> {
                age:number;
                compareTo(b:MyObject): number {
                    if(this.age === b.age) {
                        return 0
                    }
                    return this.age > b.age ? 1 : -1;
                }
            } 
            /* 
            这是个很有用的功能,可以确保我们在比较相同类型的对象。利用这个功能,我们还可以使
            用编辑器的代码补全。
            */

    </script>
复制代码

 

posted @   小白咚  阅读(102)  评论(0编辑  收藏  举报
编辑推荐:
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
阅读排行:
· DeepSeek 开源周回顾「GitHub 热点速览」
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布:重大改进与新特性概览!
· AI与.NET技术实操系列(二):开始使用ML.NET
· 单线程的Redis速度为什么快?
点击右上角即可分享
微信分享提示