客服电话
APP下载
迪恩网络APP
随时随地掌握行业动态
官方微信
扫描二维码
关注迪恩网络微信公众号
|
简单来说typescript就是新增一下方法，以及增加类型判断 一、普通的类型判断 1、布尔类型（boolean） let isDone: boolean = false let createdByBoolean: boolean = Boolean(1) 2、数字类型（number） let decLiteral: number = 6 let hexLiteral: number = 0xf00d // ES6 中的二进制表示法 let binaryLiteral: number = 0b1010 // ES6 中的八进制表示法 let octalLiteral: number = 0o744 let notANumber: number = NaN let infinityNumber: number = Infinity 3、字符串类型（string） let myName: string = 'Tom' // 模板字符串 let sentence: string = `Hello typescript` 4、空值类型（void、null、undefined） // 返回空值的函数
function alertName(): void {
alert('My name is Tom')
}
// 默认空值
let unusable: void = undefined
// Null 和 Undefined
let u: undefined = undefined
let n: null = null
5、任意值（any） let myFavoriteNumberAny: any = 'seven' myFavoriteNumberAny = 7 6、联合类型 let myFavoriteNumber: string | number myFavoriteNumber = 'seven' myFavoriteNumber = 7 7、类型断言（根据类型来做判断） function getLength(something: string | number): number {
// 当只有something为字符串时才会找到
if ((<string>something).length) {
return (<string>something).length;
} else {
return something.toString().length;
}
}
二、数组类型 let fibonacciNum: number[] = [1, 1, 2, 3, 5]
let fibonacciStr: string[] = ['1','2','3','4','5']
let fibonacciBool: boolean[] = [true,false]
let fibonacciVoid: void[] = [undefined,null]
// any在数组里的应用
let list: any[] = ['xcatliu', 25, { website: 'http://xcatliu.com' }]
三、对象(接口)类型 1、指定对象的类型（interface） interface Object {
name: string
age: number
}
const object: Object = {
name: '我',
age: 18
}
2、可选属性（指定类型少了一些属性或者多一些属性都是不允许的，除了可选属性） interface Object1 {
name?: string
age: number
}
const object1: Object1 = {
age: 18
}
3、任意属性（任意名称的属性） interface Person {
name: string;
age?: number;
[propName: string]: any;
}
// 一旦定义了任意属性，确定属性和可选属性的类型都必须是它的类型的子集（也就是可选属性和任意属性同时存在时，可选属性的类型必须和任意属性相同）
interface Person1 {
name: string;
age?: string;
[propName: string]: string;
}
let tom: Person1 = {
name: 'Tom',
age: '25',
gender: 'male'
}
4、只读属性（除了第一次赋值，其余时候都无法修改的属性） interface Person2 {
readonly id: number;
name: string;
age?: number;
[propName: string]: any;
}
// id除了第一次赋值外，其余时候都没办法修改
let tom2: Person2 = {
id: 89757,
name: 'Tom',
gender: 'male'
}
四、函数类型 1、简单的函数表达式 // 参数类型与返回类型
function sum(num1: number, num2: number): number {
return num1 + num2
}
2、完整的参数式函数表达式 // 通过赋值来定义函数
let mySum1 = function (x: number, y: number): number {
return x + y
}
// 其实这样的话是通过类型推断来决定mySum是函数而已，是不标准的，标准如下：
let mySum2: (x: number, y: number) => number = function (x: number, y: number): number {
return x + y
}
// 首先要输入mySum2的类型，类型是函数类型，而函数类型包括输入的内容(x: number, y: number)，与输出的结果number，中间用=>表示是定义函数定义特有的符号
// 接口的方式定义函数，更为清晰
interface SearchFunc {
(source: string, subString: string): boolean
}
let mySearch: SearchFunc
mySearch = function (source: string, subString: string) {
return source.search(subString) !== -1
}
3、配合可选参数 // 需要注意可选参数不能放在必须参数的前面
function buildName(firstName: string, lastName?: string) {
if (lastName) {
return firstName + ' ' + lastName
} else {
return firstName
}
}
let tomcat = buildName('Tom', 'Cat')
let tom1 = buildName('Tom')
4、默认参数 function buildName1(firstName: string, lastName: string = 'Cat') {
return firstName + ' ' + lastName
}
let tomcat1 = buildName('Tom', 'Cat')
let tom3 = buildName('Tom')
5、多余参数 // 剩余参数(和es6的方式类型，表示剩余的所有参数)
function push(array: any[], ...items: any[]) {
items.forEach(function (item) {
array.push(item)
});
}
|
请发表评论