TypeScript系列（一）

相信使用Angular2.x之后版本的都知道TypeScript这门语言。其实这门语言完全的不像JavaScript，虽然它属于前端语言，但是它相对与JavaScript来说更加严谨化。与Java或kotlin语言较为相似。

本章内容的一些知识点：字符串模板；参数四种类型与参数定义；方法(函数)声明类型；参数的默认值；参数是否必须；可变参数；类的定义是使用；

1.字符串模板

let str = "字符串模板";
console.log(`hollow ${str}`);//输出结果：hollow 字符串模板

2.参数四种类型与参数定义

//参数的类型string number boolean any （注：也是全局变量或局部变量的参数声明）
let content: string = "我是内容"; // 字符串类型
let nb: number = 123; //数字类型
let flag:boolean = true; //判断类型
let ay :any = true; //任意类型:可以是string number boolean类型
ay = 123;
ay = "aaa";

3.方法(函数)声明类型

//方法返回值的声明类型
function getAge(): number {
    return 456;
}
function getAge2(): number {
    return "456"; //因为方法指定返回的是number类型，而此时返回的是字符串类型，所以会报错
}

//指定传参的类型 （此处指定返回值为void，也就是此方法无需返回值，
              //  若返回参数申明为string，boolean，number类型，则必须要有返回值，不然会报错）
function exceteMethod(str: string): void {
    console.log("执行方法:"+str);
}
//调用方法
exceteMethod("你好吗");
exceteMethod(132);//因为要求传入的参数是string类型，而此时传入的是132number类型，所以会报错

4.参数的默认值

//参数的默认值
let add = (a: number, b: number, c: number): number => a + b + c;
add(2, 6, 3);
add(2, 6);//必须要传参数 不然会报错

function add2(a: number, b: number, c: number = 3): number {
    return a + b + c
}
let number = add2(2, 6); //因为第三个参数指定了默认值，所以第三个参数可以不传
console.log(number);

5.参数是否必须

//可选参数(参数名+?) 必须声明在最后
function add3(a: number, b: number, c?: number): number {
    if (c === undefined) c = 0; //做一次判断
    return a + b + c
}
add3(2, 3,5);
add3(2, 3);//不必须要传参数

6.可变参数

function iterarArr(...arr) {
    arr.forEach((value, index) => console.log(index,value))
}
iterarArr(1,2,5,6,8,3);
iterarArr("ss","rrr","jkkk");

7.类的定义是使用

//类  
class Person {
    //定义为私有属性：外部不能通过Person直接访问到这个属性
    private name: string;
    //定义为公有属性：外部能通过Person直接访问到这个属性
    public age: number;
  
    setName(newName: string) {
        this.name = newName;
    }

    getName(): string {
        return this.name;
    }
}

let person: Person = new Person();
person.age = 456;//因为是public，所以能够直接访问此属性
person.name = "sss"; //因为是private，所以不能够直接访问此属性，会报错
person.setName("liu qiang");
console.log(person.getName());

建议将此示例代码copy到编译工具中查看那行代码报错了（因为我在编译工具工copy过来的代码在这上面没有错误提示，但是在编译工具中有，所以不好直观查看），或运行查看。

那么下一篇将介绍TypeScript的一些比较重要的知识点：继承，泛型，接口....

TypeScript系列（一）

1.字符串模板

猜你喜欢