TypeScript基本介绍

2019-06-24  本文已影响0人  duans_

TypeScript

TypeScript介绍

背景介绍

什么是TypeScript?

运行环境

TypeScript编译器介绍

TypeScript编译器安装

  1. 安装:npm install typescript -g

因为TypeScript编译器为一个工具包,所以采用全局安装

  1. 编译:tsc hello.ts
    • 指定编译文件名: tsc hello.ts --outFile bundle.js

hello.ts为文件名,因为TypeSscript本身不能直接运行,所以必须编译成js代码,才能进行运

TypeScript中数据类型介绍

function print:void(params){
    console.log(params);
}
//声明一个void类型的变量没有什么大用,因为你只能为它赋予undefined和null:
let unusable: void = undefined;

函数

函数的定义

function sum(a:number,b:number):string{
    return '求和结果为:'+(a+b);
}

类(class)

类(class)的介绍

// 类(class)相当于ES5中的构造函数

class Person{
    // 声明静态属性
    static version:string='V1.0.0';
    //声明成员属性; 并进行数据类型的约束
    name:string;
    age:number;
    sex:string;
    //构造函数,做一些初始化的事,比如给成员属性赋值
    constructor(props){
        //成员属性赋值
        this.name=props.name;
        this.age=props.age;
        this.sex=props.sex;
    }
    //声明成员方法1
    sayName(){
        console.log('My name is '+this.name);
    }
    //声明成员方法2
    dance(){
        console.log('我会跳新疆舞');
    }
    // 静态成员方法
    static sayHi():string{
        console.log('hello world!!!');
        return 'hello world!!';
    }
}
//创建实例:和js中一样
let p1=new Person({name:'zs',age:10,sex:'男'})

类的继承(extends)


//通过extends语法结构继承Person类的属性和方法
class Student extends Person{
    //声明自己独有的成员属性; 并进行数据类型的约束
    addr:string;
    constructor(props){
        //必须在此处使用super()先调用父类的构造函数
        super(props);
        //属性赋值
        this.addr=props.addr
    }
    //添加自己独有的成员方法
    hobby(){
        console.log('爱生活,爱代码');
    }
    
}
//创建实例对象
let s1=new Student({name:'ls',age:10,sex:'女',addr:'中国西安'});

构建工具集成

webpack

vscode配置ts自动转换成js

参考文档

英文官网

ts中文网

tsconfig.json

在线运行ts

上一篇 下一篇

猜你喜欢

热点阅读