ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

typescript

2019-12-21 19:57:04  阅读:263  来源: 互联网

标签:typescript string never number ts let 类型


一、介绍

1.typescript是由微软开发的一款开源的编程语言

2.ts是js的超级,拓展了js语法,更像java/c#这样面向对象语言,更适合开发大型项目。

3.谷歌也在大力支持ts,谷歌的angular2x+ 就是基于ts语法的。

4.最新的Vue ,React 也可以集成ts。

二、安装和编译

1.安装:npm install -g typescript

2.生成配置文件:tsc --init  创建tsconfig.json 文件(eg:可修改输出地址“outDir”:“./js”,等配置)

3.编译:tsc hello.ts  (hello.ts 是自己建的ts名)

4.点击菜单栏 任务-运行任务  点击tsc 监视-tsconfig.json ,然后就可以自动生成代码了。

三、ts的数据类型

1.布尔类型(boolean)

2.数字类型(number)

3.字符串类型(string)

4.数组类型(array)

5.元祖类型(tuple)

6.枚举类型(enum)

7.任意类型(any)

8.null 和 undfined

9.void 类型

10.never类型

四、各类型的用法

1.布尔类型(boolean)

let flag:boolean = true;
flag =false;

2.数字类型(number)

let num:number; num =3;

3.字符串类型(string)

let str:string = '';
str = 'I am string';

4.数组类型(array)

let arr:string[]=[];
arr = ['1','2','3','4'];
or
let arr:Array<number> =[1,2,3,4];

5.元祖类型(tuple)

//已知数组元素的个数,并且知道每个元素的类型
let tupleArr :[string,number] =['lalala',2];

6.枚举类型(enum)

enum Color{
    red = 1,
    blue,
    orange = 5,
    green = 7
}
let redNum:Color = Color.red   //1
let blueNum:Color = Color.blue    //2
let orangeNum:Color = Color.orange    //5

let red:string = Color[1]   //red
let blue:string = Color[2]    //blue
let orange:string = Color[5]    //orange

7.任意类型(any)

let notSure:any = 4; 
notSure = 'maybe a string instead';
notSure = false; //okay

8.null 和 undfined

    //strictNullChecks标记的启用是在tsconfig.json文件里进行配置。
// {
//     "compilerOptions": { //编译选项,可以被忽略,这时编译器会使用默认值
//         "strictNullChecks": false, //在严格的null检查模式下,null和undefined值不包含在任何类型里,只允许赋值给void和本身对应的类型。
//     }
// }
//"strictNullChecks": false,
//默认情况下,null 和 undefined 是其它类型的子类型,可以赋值给其它类型,如number类型,此时,赋值后的类型会变成 null 或 undefined。
let hh: number;
hh = null; //ok的
hh = undefined;  //ok的

//"strictNullChecks": true,
let ss: number;
ss = null; //提示不可以
ss = undefined;  //提示不可以

//定义没有赋值就是undifined;
let aa :string | undifined;
console.log(aa) //undefined

//一个元素可能是number,null,undifined
let num: number | null | undefined
num=123;

9.void 类型

//表示方法没有返回任何类型
function run(): void {
    console.log(111);

}
run()
//表示传参是number类型,函数返回值也是number类型
function sum(num:number): number {
    console.log(111);
    return num + 123
}
sum(12);

10.never类型

//never类型是任何类型的子类型,也可以赋值给任何类型;然而,没有类型是never的子类型或可以赋值给never类型(除了never本身之外)。
// 即使 any也不可以赋值给never。通常表现为抛出异常或无法执行到终止点(例如无线循环)。比如: let x: never; let y: number; // 运行错误,数字类型不能转为 never 类型 x = 123; // 运行正确,never 类型可以赋值给 never类型 x = (() => { throw new Error('exception') })(); // 运行正确,never 类型可以赋值给 数字类型 y = (() => { throw new Error('exception') })(); // 返回值为 never 的函数可以是抛出异常的情况 function error(message: string): never { throw new Error(message); } // 返回值为 never 的函数可以是无限循环这种无法被执行到的终止点的情况 function loop(): never { while (true) { } }

五、类

1.类的写法

2.类的继承

3.属性修饰符(public、protected、private)

4.必传参数和可选参数

//类里面的修饰符:ts里定义属性的时候提供了三种修饰符:
/*
public:共有   在类里面、子类、类外面都可以访问
protected:保护类型   在类里面,子类里面可以访问,在类外部没法访问
private:私有     在类里面可以访问 ,类外面和子类都不访问
属性如果不加修饰符,默认是public
*/
class Person {
    name: string; //必传,属性修饰符这里没写就默认是public,同public name:string;
    private sex: string;
    protected age?: number; //age:可有可没有

    //namepro:必传,agepro:可传可不传,可选参数必须配置到 参数的最后面 //‘lisi’是namepro的默认值
    constructor(namepro: string = 'lisi', sexpro: string = '男', agepro?: number) {
        this.name = namepro;
        this.age = agepro;
        this.sex = sexpro;
    }
    run(): void {
        console.log(this.name);
    }
}
let zhangsan = new Person('zhangsan', '女');
zhangsan.run();
zhangsan.age;  //提示出错。age是保护类型

class Web extends Person {
    constructor(name: string) {
        super(name) //继承父级的参数需要同过super函数传值
    }
    work() {
        console.log(this.sex); //sex是父类的私有属性,所以子类是访问不到的,这里会提示错误

    }
}

5.参数中的三点运算符

//三点运算符,接受新参传过来的值
function sumFn(...result: number[]): number {
    let sum: number = 0;
    for (let i = 0; i < result.length; i++) {
        sum += result[i];
    }
    return sum;
}
sumFn(1, 2, 3, 4);
sumFn(1, 2, 3, 4, 5, 6)
//如果有默认的参数,那传参前面就是默认的参数,剩下的就在。。。的result中
function sumFn(a:number,b:number,...result: number[]): number {
    let sum: number = a+b;
    for (let i = 0; i < result.length; i++) {
        sum += result[i];
    }
    return sum;
}
sumFn(1, 2, 3, 4);
sumFn(1, 2, 3, 4, 5, 6)

六、ts函数重载

1.ts中的重载:通过为同一个函数提供多个函数类型定义来试下多种功能的目的

function getInfo(name: string): string;
function getInfo(age: number): string;
function getInfo(str: any): any {
    if (typeof str === 'string') {
        return '我叫' + str;
    } else {
        return '我的年龄' + str;
    }
}
getInfo('张三')  //我叫张三
getInfo(20)  //我的年龄20

标签:typescript,string,never,number,ts,let,类型
来源: https://www.cnblogs.com/zhengyulu/p/12077981.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有