ts必须编译成js语言才能被浏览器解析

1、第一个TS程序

需求:编写一个示例，通过一个函数传入显示人的姓名，并将显示信息输出到页面中。

//定义一个函数

function tip( name: string){”

      return name+" hello"

}

//调用函数

let  _name=" Tom";

//将函数返回的内容作为页面显示字符

document. body. innerText=tip(_name)

2、类型和定义

      //定义一个字符型变量

      let str=" Tom";

      let str2: string;

      str2= str+`，你好，${ str }`；

     

      //数组定义

      let arr: number[ ]=[2，4，6];

      let  arr: string[ ]=[" abcd"]

      //元组定义 既知道数量，又知道类型的数组

    let  arr:[ string, number]=["aaa",666];

       

    //任意类型值

    let arr:any [ ]=[ " asdfg",123，false];

    //空值类型

    function systemout(): void {

        console.log()

}

变量申明

//定义一个变量

let str: string=" abd"

//定义一个函数

function person( name: string, age: number, isStudent: boolean){

      console. log( name, age, is Student)

}

//调用函数

person(" Tom",18, true)

三、接口

1、定义与使用

定义 使用

2、继承

定义 调用

四、类

定义

1、定义和使用

定义 定义

2、继承和接口

//定义一个函数

function aa( name: string,age: number): void{

      console. log( name,age)

}

aa(" Tom",40);

1、定义一个匿名函数

let  abc= function(code: string){

console.log(code)

}

abc("sssss")

2、定义匿名函数

( function( code2: string){

    console. log( code2)

})("123456");

2、泛型

定义函数泛型/参数泛型

function output<T>(n: T[]):T[]{

    console. log( n.length)

      return n

}

//调用

output([6])

output(["aa"])

//类泛型

class Stu<T>{

      list:T[]=[];

    add(v:T){

        this.list.push(v)

    }

}

//实例化类

let s1= new Stu< string>();

s1.add("aa");

s1.add("bb");

3、枚举

//定义一个枚举类型的集合

enum Color{

    red,  // red=1

    blue,

  blank

}

//访问集合中的类型

console. log( Color. blue)

console. log( Color[1], Color[ Color. blue ])

//取日期中的星期

let w=(new Date()). getDay();  //0，1,2

//定义一个代表星期的枚举类集合

enum Week{

  星期天，

  星期六，

  星期五，

  星期四

}

//将获取的数字转成文字

switch(w){

  case  Week.星期天:

          console. log( Week[ Week.星期天])

          break;

    default:

          break;

}

五、模块

function a(){

  console. log("a")

}

模块创建与使用

export  function b(){

  console. log("b")

}

import { a } from  "xx";

//定义一个方法输出学生姓名

export function student( name: string){

    console. log("学生姓名是"+ name)

}

//定义一个方法输出老师姓名

export function teacher( name: string){

    console. log("老师姓名是"+ name)

}

//访问学生和老师模块

import { student } from  " student";

import { teacher } from  " teacher.";

function log( arrStu: string[ ], teaName: string){

  arrStu. forEach(item=>{

      student( item);

  })

      teacher( teaName)

}

// index.ts

import { log }  from " log"

let arrStu=[" Tom"," Larry"]

let tName =" Jason"

log(arrStu, tName)

六、命名空间

//构建一个命名空间

namespace  name{

      export  class  Person{

            _name: string=" Tom"

            constructor(n: string){

                this._name=n;

              }

              say(){

                  console. log( this._name)

              }

  }

}

//使用命名空间

///< reference path="aa.ts">

//使用空间中导出的类

let p1= new  name. Person(" Tom")

//实例化对象中方法

p1. say();