typescript 入门级教程下篇

1.在上篇中我们已经提到了ts中的变量声明了
// 变量的声明后面得加上他的类型声明

let num1:number=12
let str:string="hello"
let flag:boolean=false;
// 当然你也可以声明 成任何类型的变量
let bian:any=""112
//也可以声明多种类型
let liang:string|numer ; // 既可以使字符也可以是字符串

2.在ts中还有一种特殊的类型是 never 是任何类型的子类
他可以用于抛出错误 或者无限循环的程序中
3.数组的声明

var arr:number[]=[1,2,3,4]  里面只能放数字的数组
var str:string[]=["hello","word"]   只能放字符串的数组
// 还可以有另一种声明  泛型声明
var arr:Array<number>=[1,2,3,4,5];
var str:Array<string>=["hello","world"];

4.在ts中有一种强制要求数组每个位置上的属性要求 叫做 元组

var arr:[string,number]=["hello",12]  // 指定位置类型的数组

5.ts中的运算符合js差别不大 基本上常用的没啥子变化
6.ts中的函数

// 传入的参数也可以要求 类型
function func(val:string){}
// 也可以要求函数返回的数值类型   当然你可以不返回 设置成  void 就行了
function func(val:string):number{return 12}

ts中的类
TypeScript 是面向对象的 JavaScript。
类描述了所创建的对象共同的属性和方法。

class className{
	public name:string;
	private age:number;
	protected salary:number;
}

public 修饰的属性或者方法 在类和外面都可以使用
private 只能在当前类中调用
建议 类名都是首字母大写开头

class Person{
	public name:string;
	private age:number;
	protected salary:number;
}
var xiaoming=new Person();
console.log(xiaoming.age) // 报错 私有属性不能在外面进行访问的

protected 只能在当前类和其子类中调用

class Person{
	// 类里面有一个构造函数 当我们在参数上加上修饰符的话 
	// 简介 就说明我们定义这个属性 
	// 比如 Public name:string 在构造函数的参数中这样写 我们就不          用 在定义 name 属性了  
	constructor(public name:string,private age:number,protected salary:number){
		this.name=name;
		this.age=age;
		this.salary=salary;
	}
}

当然 类中还有一个重要的概念就是继承

class people extends Person {
	// 修饰符 和 类型限制我这里没有写哈 
    construcotr(name,age,salary,grade){
		super(name,age,salry); // 继承父类的属性
		this.grade=grade;
	}
}

7.接口 interface
学过其他面向对象语言的童鞋可能知道 接口
接口可以提前定义一些 属性和方法 但是不去实现 规定实现 该接口的必须要完成定义的属性和方法的初始化

interface Person{
	name:string,
	age:number
}
// 如果不全部实现的话就会报错
var people implements Person{
    name:string="xiaowang",
    age:number=12;
}

当然 类也可以 实现 接口
同时接口之间也可以进行继承,而且还是可以多继承,一个类只能继承一个父类,但是一个父类可以被多个子类继承

接口1   implements 接口2 , 接口3

8.泛型
说通俗点就是在函数中 往往都是 提前定义好了参数的类型
但是有的时候,我们想通过传入的参数进行自动识别

function sum<T>(value1:T,value2:T):T{
	return value1+value2;				
}
// 指定类型 是number
sum(T<number>2222,T<number>11);
sum(11); 同样你可以什么都不屑 ts 自动会帮我推断里面输入是什么类型
// 泛型约束
<T extends string> 这个就是指定类型是 string
// 接口中使用泛型

9.命名空间
单独给自己的项目开辟一个空间,空间里面的变量和外面的变量不冲突,使用的时候加上空间名称就可以了
命名空间一个最明确的目的就是解决重名问题。

namespace myPath{
	export myName:string="zhao"
}
namespace myClass{
 export myName:string="yun"
}
console.log(myPath.myName,myClass.myName);

10.ts中的文件引入
/// my.ts 前面有三个斜线 引入当前文件夹中的 ts文件

总结 上面说的 ts终究都是基础的,不过你要是经常用到ts慢慢就熟练了,毕竟经常用的可能就那几个。
后面 我会加上 在vue脚手架中如何使用ts