当前位置: 移动技术网 > IT编程>开发语言>JavaScript > es5的JavaScript语法和TypeScript的比较

es5的JavaScript语法和TypeScript的比较

2019年06月03日  | 移动技术网IT编程  | 我要评论
1.变量(基础类型和定义) typescript定义变量需要指定变量的类型,后面不许更改变量的类型 1>定义 let 和 var 和const的区别 let定义的变量

1.变量(基础类型和定义)

typescript定义变量需要指定变量的类型,后面不许更改变量的类型

1>定义

let 和 var 和const的区别

let定义的变量只在作用域中起作用,出来作用域就会被销毁

var在指定作用域中起作用

比如:都在函数中定义for循环,let只能在for循环中使用,var可以在整个函数中使用

const 定义的变量不可以修改值,是一个常量

2>基础类型

//boolean
let isdone: boolean = false;

//number
let decliteral: number = 6;

//string
let name: string = "bob";

//对象object
let info:object = {};

//数组array<元素类型>或number[]
let list: array = [1, 2, 3];
let list: number[] = [1, 2, 3];

//元组---个数类型,位置都确定
let x: [string, number];
x = ['hello', 10]; // ok
x = [10, 'hello']; // error


//枚举enum
//不给赋值的话一般从0开始,赋值了,之后的元素对应值,接在后面递增
//把枚举的名字变成值
enum color {red = 1, green, blue}
let c: color = color.green;//2

//由枚举的值得到它的名字
enum color {red = 1, green, blue}
let colorname: string = color[2];

//any
let notsure: any = 4;
let tts:array = [1,"2",new date()];

//函数
//规定返回值类型为number
function run1():number{
    return 1;
}
//没有返回值,
function run3(name:string,age?:number):void{
//age这个参数可传可不传
}

//function run():never{}一般是死循环等永远拿不到的值

//类型断言
let somevalue: any = "this is a string";
//尖括号”语法:
let strlength: number = (somevalue).length;
//as语法
let strlength: number = (somevalue as string).length;

//高级类型
//|交叉类型,可以是str也可以是num
function test2():string|number{
    return 123;
}

//&联合类型




2.类

1>类的创建

class person{
    name:string;
    constructor(){
        this.name = "xiaoming";
    }
    open(){
        console.log("person.open()");
    }
}

//es5
function person(){
    this.name = "xiaoming";
    this.open = function(){
        console.log("person.open()");
    }
}

2>公共,私有与受保护的修饰符

a)public默认,公开,可以在继承了父类的子类内部使用,外部也可以访问
b)protected是只要自己和子类的内部就可以访问,外部不可访问
c)private私有的,只有自己才能访问,子类内部都不可以访问
一般通过存储器来设置,使用某些私有属性

//protected
class chinese{
    constructor(){}
    protected action(type:number){
        let deng ="red";
        let actiontype = "stop";
        switch (type){
            case 0:
                break;
            case 1:
                deng = "green";
                actiontype = "go";
                break;
            case 2:
                deng = "yellow";
                actiontype = "go";
                break;
            default :
                deng = "black";
                actiontype = "go";
                break;
        }
        console.log("灯的颜色是"+deng+"意思是 "+actiontype);
    }
    red(){this.action(0);}
    green(){this.action(1);}
    yellow(){this.action(2);}
}
//假如西安比其他地方多一个黑的等
class xian extends chinese{
    static cityname = "xian";//静态属性,和类属性差不多

    constructor(){super();}
    black(){
        this.action(3)
    }
}




//private
class person{
    private name:string = "";
    protected age:number = 8;

     /*
    //es5set,get方法
    var _name = "";
    this.getname = function(){
        return _name
    }
    this.setname = function(){
    _name = name;
    }*/

    get getname(){
        if(this.age>30){}
        return this.name;
    }
    set setname(name:string){
        this.name = name;
    }
}
class  china extends person{
    constructor(){
        super();
    }
    move(){
       // console.log(this.age+this.name);//protect类可以在子类里使用,所以this.age可以,name不行
        console.log("年龄是"+this.age+this.getname);//存储器直接当做属性一样使用

    }
}

3.继承

class animal{
    blood:number;
    att:number;
    level:number;
    constructor(blood:number,att:number,level:number){
        this.blood = blood;
        this.att = att;
        this.level = level;
    }
}

class person extends animal{
    name:string;
    job:string;            constructor(blood:number,att:number,level:number,name:string,job:string){
        super(blood,att,level);
        this.name = name;
        this.job = job;
    }

}

//es5
//多重继承
//混合继承

4.命名空间和模块

注意:不应该对模块使用命名空间
使用命名空间是为了提供逻辑分组和避免命名冲突。 模块文件本身已经是一个逻辑分组,并且它的名字是由导入这个模块的代码指定,所以没有必要为导出的对象增加额外的模块层。

module flower{
    //导出flower模块中的rose类
    export class rose{
        constructor(){}
        open(){
            console.log("a beautify rose");
        }
    }
}

//在其他文件中使用rose的open方法
new flower.rose().open();


//命名空间
namespace hxx{
    //导出命名空间里的内容
    export let name ="hxx";

}

//使用
console.log(hxx.name);

5.基础类

基础类不可实例化,只有继承了基础类的子类可以实例化(bmap的时候见了些)

abstract class dbmanagerbase{
    private dbname:"st"
    constructor(){}
    opration(){
        console.log("opration");
    }
}

class dbmanager extends dbmanagerbase{
    constructor(){
        super();
    }
}
new dbmanager().opration();
new dbmanagerbase();//error,基础类不可实例化,只有继承了基础类的子类可以实例化

如您对本文有疑问或者有任何想说的,请点击进行留言回复,万千网友为您解惑!

相关文章:

验证码:
移动技术网