1.JavaScript的超集
关于es5,es6,ts的关系
es5[标准] < es6[标准] < ts[不是标准,社区]
ts相当于es6+强类型
2.数据类型
es6是弱类型语言(一个变量的数据类型取决于值,数据类型可以改变)
let a = 2; a = false
ts中添加了强类型的特性(一个变量的数据类型在声明的时候确定,变量的数据类型一旦确定无法修改)
比如java中int a = 3;
1)基本数据类型
number
string
boolean
symbol
null
undefined
2)引用数据类型
Object
通过自定义类来校验对象
let a:Object;
a = 2;
console.log(a);
let b:Object=3;
console.log(b);
export default{}
Array
let arr:Array<string>;
let set:Set<number>;
let map:Map<string,number>;
let arr:Array<string>;
arr=['a','b','c'];
console.log(arr);
let set:Set<number>;
set = new Set();
set.add(7)
set.add(3)
console.log(set)
let map:Map<string,number>
map = new Map();
map.set('一',1);
let arr1: number[] = [1, 2, 3];
console.log(arr1);
Function
函数通常存放在对象中,我们通过接口来约束对象,进而约束函数
interface Foo{
login(username:string,password:string):User;
}
class User{
id:number;
username:string;
realname:string;
gender:number;
}
interface Foo{
login(username:string,password:string):User;
}
let obj:Foo;
obj={
login(username:string,password:string){
//登录逻辑
return new User()
}
}
enum枚举类型
不赋值默认为0,1,2...
enum Gender{
MALE='男',
FEMALE='女',
}
// enum Gender{
// MALE='男',
// FEMALE='女'
// }
// console.log(Gender.FEMALE) 可以这样用
enum Gender{
// MALE,
MALE=1,//不赋值 默认为0 赋值后为1 第二个就是2
FEMALE,
}
// console.log(Gender.FEMALE,Gender.MALE)
// console.log(Gender.FEMALE,Gender.MALE)
console.log(Gender[1],Gender.MALE)//1是MALE 也可以这样用
3.ts的编写以及运行
ts文件不能被nodejs和浏览器所识别,所以要经过编译变成js文件,ts可以设置其编译级别(ES5 OR ES6),相关方法可以自行百度。
使用ts的方法
1)安装typescript
$cnpm install -g typescript
2)编写ts代码
3) 编译
$tsc hello.ts
4)执行
$tsc hello.ts / $tsc hello --target es6 ——(es6语法进行编译)
$node hello.js
4.面向对象
1)类
class Animal{
name:string;
age:number;
constructor (name:string,age:number){
this.name=name;
this.age=age;
}
sayName():void{
console.log('my name is',this.name);
}
sayAge():void{
console.log('my age is',this.age);
}
}
2)泛型:
父类类型的引用指向子类对象,通过父类类型的引用只能访问父类中声明的特性
如果子类重写了父类的方法,通过父类类型引用调用该方法,体现子类的特性。
class Dog extends Animal{
color:string;
constructor(name:string,age:number,color:string){
super(name,age);
this.color=color;
}
sayColor(){
console.log('my color is',this.color);
}
sayName():void{
console.log('wang wang--',this.name)
}
}
//泛型
let a:Animal=new Dog('yiname',12,'pu');
a.sayName();//wang wang-- yiname
3)方法重写,方法覆盖
子类中提供了一个与父类前名(函数名,参数类型,返回值)完全一致的方法
4)抽象类
如果一个类中出现了抽象方法,那么这个类,就是抽象类;抽象类无法实例化
抽象类是为了让其他子类继承
//抽象类
abstract class Parent{
abstract study():string;
eat(){
console.log('wa zhenxianga~');
}
work(){
console.log('work...');
}
}
class Child extends Parent{
study():string{
super.eat()//用在普通函数内,super表示父类的实例
super.work();
return '好好学习,找到工作'
}
}
let child:Parent = new Child();
child.study();
child.eat();
child.work();
5)接口
抽象到极致的抽象类,接口中的方法全部都是抽象方法,这些方法无需再使用abstract修饰
接口是一种特殊的类,接口不再通过extends,而是通过implements来实现
class User{
id:number;
name:string;
gender:string;
constructor(id:number,name:string,gender:string){
this.id=id;
this.name=name;
this.gender=gender;
}
}
interface IBaseService{
foo():void;
}
interface UserService{
login(username:string,password:number):User;
register(user:User):void;
}
//接口要使用implements 实现接口
//抽象类要继承
class UserServiceImpl implements UserService,IBaseService{
foo():void{
}
login(username:string,password:number):User{
return new User(1,'name','male');
};
register(user:User):void{}
}
export default{}
6) 访问修饰符
private 当前类能访问
protected 当前类和子类能访问
public 所有都能访问
//访问修饰符 用在类中,用来修饰属性或者方法
export default{}
class Animal{
private id:number;
private name:string;//只能在当前类访问
constructor(id:number,name:string){
this.id=id;
this.name=name;
}
public getId(){
return this.id
}
//方法默认就是public
protected sayName(){
//protected 受保护的 保护给子类的
console.log(a.name);
}
}
let a = new Animal(1,'terry');
// console.log(a.name);//a.name 是私有属性 只能在Animal中访问
console.log(a)//转换成es5 可以访问;
console.log(a.getId());//如果要访问id 要提供一个公共的访问方法 getId
class Dog extends Animal{
constructor(id:number,name:string){
super(id,name);
}
foo(){
super.sayName()
}
}
let dog:Dog=new Dog(1,'lor');
dog.foo();