深圳网站开发服务,百度百姓网,wordpress不能更新,app设计界面本节介绍TypeScript中的基础类型及变量声明方式的说明。TypeScript支持与JavaScript几乎相同的数据类型#xff0c;此外还提供了实用的枚举类型方便我们使用。基础类型包括#xff1a;数字#xff0c;字符串#xff0c;结构体#xff0c;布尔值等。 学习视频 TS学习笔记二… 本节介绍TypeScript中的基础类型及变量声明方式的说明。TypeScript支持与JavaScript几乎相同的数据类型此外还提供了实用的枚举类型方便我们使用。基础类型包括数字字符串结构体布尔值等。 学习视频 TS学习笔记二基础类型与变量定义 B站视频 TS学习笔记二基础类型与变量定义 西瓜视频 https://www.ixigua.com/7320418431852642857 一、基础类型 TypeScript基础类型中包括数字字符串结构体布尔值等。变量指定类型时使用“:”加类型名指定变量类型。 1. 布尔值 布尔类型使用boolean什么定义方式let isOk:boolean false;
2. 数字 数字类型包括整数、浮点数等都是用number进行定义 除了支持十进制和十六进制字面量Typescript还支持ECMAScript 2015中引入的二进制和八进制字面量。定义方式如下
let a :number 1;
let a :number 0xf00e;
let a :number 0b1010;
let a :number 0o711;3. 字符串 使用标识符string定义字符串可使用“””或“’”标识字符串定义方式
let str:string ‘222’
let str:string “34234”;也可使用模板字符串定义多行文本和内嵌表达式使用进行定义使用${}嵌入表达式定义方式如下
let a:string ‘2’;
let b:number22;
let str:string This is ${a} and ${b1};也可以使用如下定义结果一致
let str:string ‘This is ’ a ‘ and ’ (b1);4. 数组 TypeScript中有两种方式可以定义数组。 第一种可以在元素类型后面接上[]表示由此类型元素组成的一个数组let list: number[] [1, 2, 3]; 第二种方式是使用数组泛型Array元素类型
let list: Arraynumber [1, 2, 3];5. 元组 元组是TypeScript中特有的可以定义一个已知数量和类型的数组且各个元素的类型不必相同定义方式和数组类型具体如下
let x :[number,string,boolean] [1,’2’,false];当使用索引进行访问时可以得到索引所对应的元素的具体类型如x[0]可获取到第0个元素的数据类型并可以使用该类型对应的方法。 当访问越界的元素时元素的类型使用联合类型代替即指定的所有类型中任何一种如给x[4] 3,此时下标4已经越界且定义的时候没有指定具体的类型 这个时候使用number或string或boolean中的任何一个类型来进行标识设置值的时候只要是这三个类型中的任何一个都可以超出这三个的范围则不行。获取元素时对应的类型也是联合类型可访问这三个属性都具有的共工属性或方法如x[4].toString()可正常执行因为number、string和boolean都具有toString方法。 此处的联合类型是一个高级类型将在后续的章节中介绍到。
6. 枚举 枚举是TypeScript补充的类型使用enum进行定义像其它高级语言一样使用枚举类型可以为一组数组赋予更加友好的名字定义方式如下
enum Color{Blank,Blue,Red};
let color:Color Color.Blank;默认情况下枚举的下标是从0开始即上述例子中的Blank的值是0Blue的值是1下一个是上一个的值1。也可以通过手动指定的方式设置开始值设置方式如下
enum Color{Blank 1,Blue,Red};
let color:Color Color.Blank;也可以给全部值都使用手动赋值具体定义方式如下
enum Color{Blank 1,Blue 2,Red 3};
let color:Color Color.Blank;枚举类型也可以使用枚举的值得到对应的名字获取方式如下
enum Color{Blank 1,Blue 2,Red 3};
let colorName:string Color[2];7. 任意值 编程阶段不清楚类型的变量为了烧开类型检查器可以使用任意值进行标识关键字为any定义方式let a:any 121a ‘2’可以设置任意类型。 可以对现有代码进行改写的时候能够允许在编译时包含或移除类型检查和Object有类似作用但Object类型的变量只允许给它赋任意值但是不能在它上面调用任意的方法即使方法存在。 也可以在定义数组时只知道一部分数据类型的时候进行使用如let arr:any[] [1,’2’,’4’];
8. 空值 关键字为void与any类型相反标识没有任何类型通常用于函数的返回值的类型设置定义如下
function a():void{}声明void类型的变量没有意义只能赋予undefined和null。
9. Null和Undefined 对应js中的原生类型null和undefined和空值void类似本身的类型用处不大定义方式如下
let a:undefined undefined;
let b:null null;默认情况下null和undefined是所有类型的子类型可以把null和undefined赋予number等类型的变量。然而当指定了--strictNullChecks标记null和undefined只能赋值给void和它们各自。
10. Never Never类型标识永不存在的值的类型可用于哪些总是会抛出异常或者根本不会有返回值的函数表达式或箭头函数表达式的返回值类型。 Never是任何类型的子类型也可以赋值给任何类型没有类型是naver的子类型或可以赋值给never类型除了never类型本身之外即使any也不可以赋值给never。使用示例如下
function error(msg:string):never{//函数不可能有返回值throw new Error(‘error’);
}
function fail(){//推断类型为neverreturn error(‘ss’);
}
function loop():never{//函数无法结束while(true){}
}
11. 类型断言 当能明确知道比现有类型更具体的类型的时候可以使用类型断言进行设置类型断言好比其它语言中的类型转换只是不进行特殊的数据检查和解构没有运行时的影响只是在编译阶段起作用。有两种使用方式 一是尖括号的语法
let a:any ‘fsfds’;
(stringa).indexOf();二是as语法
let a:any “fsdfds”;
(a as string).indexOf();两种方式是等价的ts中使用jsx时只允许使用as语法。
二、变量声明 变量的声明包括var、let和const等方式不同的定义方式具有不同的效果及注意事项有自己的作用域及规则。 1. var声明 var是早期的变量定义关键字如var a 10;可以定义任意类型的变量也可以函数内部定义变量
function a(){var b 10;
}也可以因为作用域的延伸在函数内部使用外部的参数定义方式如下
function a(){let b 1;function c(){let d b1;}
}var声明的变量存在变量提升的情况可以在包含它的函数、模块、命名空间或全局作用域内部任何位置被访问代码块也没有影响因此多次声明同一个变量并不会报错而且在定义之前进行变量访问也不会报错也可以进行多次定义只是定义的变量只有一个实例。
a 1;
var a;2. Let声明 let声明和var类型如let a 20;但具体的作用域规则和var是有区别的当用let声明一个变量它使用的是词法作用域或块作用域。不同于var声明的变量可以在包含它们的函数外访问块作用域变量在包含他们的块或for循环之外是不能访问的示例如下
function a (){let a 100;if(a){let b 1; }return b;//此处会报错无法访问变量b但是如果b变量是使用var声明的则可以访问。
}catch中的变量也是具有同样的作用域规则块级作用域的变量不能在声明之前访问var声明的变量就可以如
a 1;//此处会报错变量未定义
let a ;可以在一个拥有块作用域变量被声明前获取它。 只是我们不能在变量声明前去调用那个函数。
function foo() {return a;
}// 不能在’a’被声明前调用’foo’ 运行时应该抛出错误
foo();
let a;let声明的变量不能重复定义即同一个各作用域内同样名称的变量只能有一个重复定义会报错示例如下
let a 1;
let a 1;//此处会报错变量重复定义使用var时就不会3. Const 声明 const声明的变量和let类似但其值在定义时赋值后就不能再次更改其作用域规则和let类型不可重复定义只是块级作用域不能在声明之前访问唯一的区别就是不可重复赋值。
const a 1;
a b;//此处会报错。修改const定义的对象内部的属性是允许的具体如下
const obj {a:1,b:2
}
obj {};//此处会报错。
obj.a 2;//修改属性可以所用变量除了需要有修改的过程都建议使用const。
4. 解构数组 数据解构使用方式如下
let a [1,2,3];
let {c,d,e} a;
//此时c 1;d 2,e 3;类似于使用了let c a[0]这样的定义方式。也可以使用解构进行变量的值交换如[a,b] [b,a]也可用于函数的参数如下
function ([a,b]:[number,number]){
}若只取一部分数据则使用…剩余参数的方式进行定义使用方式如下
let [a ,...other] [1,2,3,4,5]; //此时a为1other为[2,3,4,5]也可以直接忽略其余的参数如
let [a] [1,2,3,4]; //此时a为1其余的将会丢弃。也可以忽略指定元素如
let [a,,b,c] [1,2,3,4]//此时a为1b为3c为42将被忽略。5. 对象解构 对象解构如下
let obj {a:1,b:2,c:3
}
let {a,b} obj;//此时a 1b2不需要的属性可以直接忽略相当于let a obj.a ,let b obj.b定义并赋值。也可以使用没有声明的赋值如
({a,b} {a:’2’,b:12})可以给属性不同的名字如let {a:a1,b:b1} obj此处的不是用于指定其类型的而是指定其新名称的。 也可以设置默认值设置后在属性为undefined时使用缺省值如下
function aa (obj:{a:string,b?:number}){let {a,b111} obj;
}示例如果参数中的b为undefined参数obj的属性a和b都有值。
6. 函数声明 解构也可用于函数声示例如下
type C {a:string,b?:string}
function f({a,b}:C):void{
}也可以指定参数的默认值
function f({a,b} {a:””,b:0}):void{
}此实例中调用f时参数会有默认值。
