TypeScript学习(上)

一.基础类型
1.布尔型

let isDone: boolean = false;

2.Number型

let a: number = 5;   支持十进制/十六进制/二进制/八进制

3.String型

let name: string = “bob”;    name = “Mary”;
Let  sentence: string = `hello, my name is ${ name }`;
  1. 数组
let list: number[] = [1, 2, 3];
Let list: Array<number> = [1,2,3];

5.元组:允许表示一个已知元素数量和类型的数组,各元素的类型不必相同

Let  x  : [ string, number];
X = [‘hello’, 10];    // ok
X=[10,  ’hello’];    //error
X[6] = true;  //error 布尔不是(string|number)类型
  1. 枚举:enum是对js标准数据类型的一个补充,使用枚举类型可以为一组数值赋予友好的名字
Enum Color {Red, Green, Blue}
Let c: Color = Color.Green;

默认情况下从0开始编号,在这里将上面的例子改成从1开始编号,全部手动赋值:

Enum Color {Red = 1, Green = 2, Blue = 4}
Let c: Color = Color.Green;

枚举类型提供的一个便利就是由枚举的值得到他的名字:

Enum Color {Red = 1, Green, Blue}
Let ColorName : string  = Color[2];
Console.log(ColorName);      // Green
  1. Any: 为那些在编程阶段还不清楚类型的的变量指定一个类型
Let notSure: any  = 4;
notSure = “maybe a string instead”;
notSure = false;
notSure.toFixed();  //可以对any类型调用任意的方法。
  1. Void: 像是与any类型相反,它表示没有任何类型,当一个函数没有返回值时,其返回值类型是
void
Function user(): void{
Console.log(this is my warning message”);
}

声明一个void类型的变量没有什么用,因为你只能为它赋予undefined和null;

Let  unusable: void = undefined;
  1. Null和Undefined:
Let u: undefined = undefined;
Let n: null = null;

默认情况下,null和undefined是所有类型的子类型,即可以把null和
undefined赋值给number类型的变量
10. Never: 表示那些永不存在的值的类型
never类型是那些总是会抛出异常或根本就不会有返回值的函数表达式或箭头函数表达式的返回值类型; 变量也可能是 never类型,当它们被永不为真的类型保护所约束时。never类型是任何类型的子类型,也可以赋值给任何类型;然而,没有类型是never的子类型或可以赋值给never类型(除了never本身之外)。 即使 any也不可以赋值给never。

Function error(mesage: string): never{
Throw new Error(message);
}
Function fail(){
Return error(“something failed”);
}
Function infiniteLoop(): never{
While(true){
}
}

11.Object:表示非原始类型,也就是除number,string,boolean,symbol,null,
undefined之外的类型

Declare function create(o: object | null): void;
Create({ prop: 0 });   //ok
Create(null);        //ok
Create(42);         //error
Create(“string”);     //error
Create(false);       //error
Create(undefined);   //error

12.类型断言
类型断言有两种形式。 其一是“尖括号”语法:

Let someValue: any =this is a string”;
Let stringLength: number = (<string>someValue).length

另一个为as语法:

let someValue: any = "this is a string"; 
let strLength: number = (someValue as string).length;

二.变量声明
1.var声明变量会变量提升,且可以在多个函数内部访问相同的变量,多次声明同一个变量不会报错,var可以同时声明多个相同的变量,但只会得到一个。
2.let声明变量很好的解决了var存在的一些问题,它使用的是块级作用域,块作用域变量在包含他们的块或for循环之外是不能访问的。在catch语句里声明的变量也具有同样的作用域规则,let具有暂时性死区的特性,即let声明的变量不能在被声明之前读或写。Let不能再一个作用域中多次声明同一个变量。
3.const声明变量与let相似,但const声明的变量被赋值后不能再改变,也就是说,他们拥有与let相同的作用域规则,但是不能对他们重新赋值。使用const声明的对象,不能对对象重新赋值,但是可以使用对象名.属性名的方式给对象赋值。
三.接口

Interface LabelledValue{  //它代表了有一个 label属性且类型为string的对象。
	Label: string;
}
Function printLabel(labelledObj:  labelledValue){
	Console.log(labelledObj.label);
}
Let myObj = {size: 10, label: “size 10 Object”};
printLabel(myObj);

1.可选属性:接口里的属性不全都是必需的。 有些是只在某些条件下存在,或者根本不存在。 可选属性在应用“option bags”模式时很常用,即给函数传入的参数对象中只有部分属性赋值了。带有可选属性的接口与普通的接口定义差不多,只是在可选属性名字定义的后面加一个?符号。

interface SquareConfig {  color?:  string;   width?:  number;   }

可选属性的好处之一是可以对可能存在的属性进行预定义,好处之二是可以捕获引用了不存在的属性时的错误。

if (config.clor) {   
// Error: Property 'clor' does not exist on type 'SquareConfig'  
}

2.只读属性:一些对象属性只能在对象刚刚创建的时候修改其值。 你可以在属性名前用 readonly来指定只读属性:

Interface Point{
Readonly  x:  number;
Readonly  y:  number;
}

通过赋值一个对象字面量来构造一个Point。 赋值后, x和y再也不能被改变了。

let p1: Point = { x: 10, y: 20 }; 
p1.x = 5;     // error!

3.readonly和const
最简单判断该用readonly还是const的方法是看要把它做为变量使用还是做为一个属性。 做为变量使用的话用 const,若做为属性则使用readonly。
4.函数类型: 除了描述带有属性的普通对象外,接口也可以描述函数类型

interface SearchFunc { 
	( source:  string,  subString:  string ):  boolean; 
}
let mySearch: SearchFunc;
mySearch = function(source: string,subString: string) {
    return source.search(subString) !== -1;
};
console.log(mySearch('路飞', '路')); // true
console.log(mySearch('路飞', '龙')); // false

5.可索引的类型: 与使用接口描述函数类型差不多,我们也可以描述那些能够“通过索引得到”的类型,比如a[10]或ageMap[“daniel”]。 可索引类型具有一个 索引签名,它描述了对象索引的类型,还有相应的索引返回值类型。

interface StringArray {  [index: number]:  string;  }
let myArray:  StringArray; 
myArray = ["Bob", "Fred"]; 
let myStr: string = myArray[0];   //BOb

6.继承接口: 和类一样,接口也可以相互继承。 这让我们能够从一个接口里复制成员到另一个接口里,可以更灵活地将接口分割到可重用的模块里。一个接口可以继承多个接口,创建出多个接口的合成接口。

interface Shape {
    color: string;
}
interface PenStroke {
    penWidth: number;
}
interface Square extends Shape, PenStroke {
    sideLength: number;
}
let s = <Square>{};
s.color = 'blue';
s.penWidth = 100;
s.sideLength = 10;
console.log(s); // {color: "blue", penWidth: 100, sideLength: 10}
  1. 接口继承类:当接口继承了一个类类型时,它会继承类的成员但不包括其实现。 就好像接口声明了所有类中存在的成员,但并没有提供具体实现一样。 接口同样会继承到类的private和protected成员。 这意味着当你创建了一个接口继承了一个拥有私有或受保护的成员的类时,这个接口类型只能被这个类或其子类所实现(implement)。
class Control { 
	private state:  any;  
}
interface  SelectableControl  extends  Control {  
	select():  void;  
} 
class Button  extends  Control  implements  SelectableControl { 
	select() { } 
}
class TextBox extends Control { 
	select() { } 
} 
// 错误:“Image”类型缺少“state”属性。 
class Image implements SelectableControl { 
	select() { } 
} 
class Location { }
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

the_lower

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值