五.ts的类型注解.
类型注解是指我们在使用类型时可以放置在任何位置的注解。在TypeScript中，使用类型注解并非强制性要求。它有助于编译器检查变量的类型，并避免处理数据类型时出现错误。
1.列子
ts文件
(()=>{ // 规定str形参是一个string类型 function sayHi(str:string) { return str + '你好呀！'; }; // let text = "张杰小朋友"; let text =[10,20]; console.log(sayHi(text)); })()
编译时报错：Argument of type 'number[]' is not assignable to parameter of type 'string'.意思就是这个number[]不能作为函数的实参
js文件
(() => { // 规定str形参是一个string类型 function sayHi(str) { return str + '你好呀！'; } ; // let text = "张杰小朋友"; let text = [10, 20]; console.log(sayHi(text)); })();
为什么还能正常编译成js呢，因为js是弱类型语言，js=ts:any.
浏览器还能正常输出，但是在真正开发中它还是个bug , 这也形成了ts比js更严谨，开发过程中可以在控制在直接看到错误，一般ts类型错了直接会提示。
六.ts的接口
接口简单的可以理解为类型注解的集合，他可以同时定义几个变量的类型
代码演示
(() => { // 定义一个接口 interface Iperson{ firstname : String, lastname : String, age:Number } function show(person:Iperson){ return person.firstname+""+person.lastname+""+person.age; } // 定义一个对象 const person ={ firstname:"zhang", lastname:"jie", age:18 } console.log(show(person)); })();
七.ts的类
ts的类其实和js基本完全一样，看一下代码就懂了
ts文件
(() => { // 定义一个接口 interface IPerson{ firstname : String, lastname : String, } // 定义一个类型 class Person { // 定义公共的字段(属性) firstname: String lastname:String fullname:String // 定义一个构造器函数 constructor(firstname:String,lastname:String){ this.firstname = firstname; this.lastname = lastname; this.fullname = this.firstname + "" + this.lastname; } } // 定义一个函数 function show(person:IPerson){ return person.firstname + "" +person.lastname } // 实例化对象 const person = new Person('诸葛',"村妇"); console.log(show(person)); })();
编译后的js文件
(() => { // 定义一个类型 class Person { // 定义一个构造器函数 constructor(firstname, lastname) { this.firstname = firstname; this.lastname = lastname; this.fullname = this.firstname + "" + this.lastname; } } // 定义一个函数 function show(person) { return person.firstname + "" + person.lastname; } // 实例化对象 const person = new Person('诸葛', "村妇"); console.log(show(person)); })();
ts对类的定义只是一个语法糖，本质上还是js构造函数的实现。
