1.变量声明
TypeScript在JavaScript的基础上加入了静态类型检查功能,因此每一个变量都有固定的数
据类型。 在这些类型中,any不做类型检查。
let:声明变量的关键字。
const:常量。
// string: 字符串,可以用单引号或双引号
let msg: string = 'hello world!'
console.log('msg:'+msg)
console.log('___________________')
// number: 数值,整数、浮点数都可以
let age: number = 21
console.log('age:'+age)
console.log('___________________')
// boolean:布尔
let finished: boolean = true
console.log('finished:'+finished)
console.log('___________________')
// any: 不确定类型,可以是任意类型
let b:any = 'jack!'
let a:any = 221
console.log('a:'+a)
console.log('b:'+b)
console.log('___________________')
// union: 联合类型,可以是多个指定类型中的一种
let u: string|number|boolean = 'rose'
u = 'asdasdsadasdasd'
console.log('u:'+u)
console.log('___________________')
// Object: 对象
let p = {name: 'Jack', age:21}
console.log(p.age)
console.log(p['name'])
console.log('___________________')
// Array: 数组,元素可以是任意其它类型
let names: Array<string> = ['Jack',' Rose']
let ages: number[] = [21, 18]
//数组名+角标
console.log(names[1])
console.log(ages[1])
2.条件控制
支持if-else和switch的条件控制
if-else
//定义数宇
let num:number = 51
//判断是否是偶数
if(num % 2 === 0){
console.log(num +'是偶数')
}else{
console.log(num +'是奇数')
}
//判断是否是正数
if(num > 0) {
console.log(num+' 是正数')
}else if(num < 0){
console.log(num+' 是负数')
}
else {
console.log(num+' 为0')
}
注意
在TypeScript中,空字符串、数字0、null、undefined都被认为是false,其它值则为true
let num1:number|string|boolean = 0;
if(num1){
console.log('num1:'+num1)
}else{
console.log('没有值')
}
let num2:number|string|boolean = '';
if(num2){
console.log('num2:'+num2)
}else{
console.log('没有值')
}
let num3:number|string|boolean = false;
if(num3){
console.log('num3:'+num3)
}else{
console.log('没有值')
}
let num1: any;
if(num1){
console.log(num1)
}else{
console.log("数据不存在")
}
switch
let grade: string = 'A'
switch (grade) {
case 'A': {
console.log('优秀')
break
}
case 'B': {
console.log('合格')
break
}
case 'c': {
console.log('不合格')
break
}
default: {
console.log('非法输入')
break
}
}
3.循环迭代
TypeScript支持for和while循环。
//for循环
for(let i = 1; i <=3; i++){
console.log('i:'+i)
}
console.log("____________________________")
//while循环
let i = 1;
while(i <= 4){
console.log('i:'+i)
i++;
}
TypeScript中也为一些内置类型如Array等提供了快捷迭代语法。
let names: string[] = ['小丑','蝙蝠侠']
//for in 迭代器
for(const i in names){
console.log(i)
console.log(i + ":" + names[i])
}
//for of 迭代器
for(const name of names){
console.log(name)
}
4.函数
TypeScript通常利用function关键字声明函数,并且支持可选参数、默认参数、箭头函数等
特殊语法。
无返回值
//当没有返回值时,void也可以不写
function sayHello(name: string): void{
console.log("你好," + name +"!")
}
sayHello("橙子");
有返回值
function ageSum(age1: number, age2: number): number{
return age1 + age2
}
let result = ageSum(15, 16)
console.log(result)
箭头函数
let dontWord = (word: string) => {
console.log("老子今天不" + word)
}
dontWord("上班")
可选参数
//可选参数
let sayHi = (name666?: string) => {
name666 = name666 ? name666 : "陌生人"
console.log("Hi!" + name666)
}
sayHi("橙子")
sayHi()
默认参数
//默认参数
let sayHi = (name666: string = '陌生人') => {
console.log("Hi!" + name666)
}
sayHi("橙子")
sayHi()
5.类和接口
TypeScript具备面向对象编程的基本语法,例如interface、class、enum等。也具备封装
继承、多态等面向对象基本特征。
接口和类的继承
//定义枚举
enum Msg{
HI = '嗨',
HELLO = '你好'
}
//定义接口,抽象方法接收枚举参数
interface A {
say(msg: Msg):void
}
//实现接口
class B implements A{
say(msg: Msg): void{
console.log(msg + ', I am B')
}
}
//初始化对象
let a:A = new B()
//使用方法,传递枚举参数
a.say(Msg.HELLO)
类和类的继承
//定义矩形类
class Rectangle{
//成员变量
private width: number
private length: number
//构造参数
constructor(width: number , length: number) {
this.width = width
this.length = length
}
//成员方法
public area(): number{
return this.width * this.length
}
}
let a = new Rectangle(10,12)
console.log('长方形的面积为:' + a.area())
//定义正方形
class Square extends Rectangle{
constructor(side: number){
//定义父类构造
super(side,side)
}
}
let s = new Square(10)
console.log('正方形的面积为:' + s.area())
6.模块开发
应用复杂时,我们可以把通用功能抽取到单独的ts文件中,每个文件都是一个模块 (module)。模块可以相互加载,提高代码复用性。
//rectangle.ts
//定义矩形类
class Rectangle{
//成员变量
private width: number
private length: number
//构造参数
constructor(width: number , length: number) {
this.width = width
this.length = length
}
}
//定义工具方法,求矩形面积,通过export导出
export function area(rec: Rectangle): number{
return rec.width * rec.length
}
//index.ts
import {Rectangle, area} from '../rectangle'
let r = new Rectangle(10, 20)
console.log('面积为:' + area(r))