介绍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 @ 2021-06-28 17:06  小白咚  阅读(120)  评论(0)    收藏  举报