TypeScript入门二（类型）

1，TypeScrip 的静态类型
TypeScript 的一个最主要特点就是可以定义静态类型，英文是 Static Typing。那到底是什么意思那？太复杂的概念性东西这里就不讲了，你可以简单的理解“静态类型”为，就是你一旦定义了，就不可以再改变了。就像人一生下来性别就定了，男就是男的，女就是女的。这个事不可以改变了
2，如何定义静态类型，相关代码如下：

// 正确代码
const count: number = 1;
= 
//错误代码
const count: number = 1;
count = "jspang";

上面代码中: number就是定义了一个静态类型。这样定义后count这个变量在程序中就永远都是数字类型了，不可以改变了。比如我们这时候给count复制一个字符串，它就报错了。
3，对象类型
新建一个demo1.ts,写下如下代码

const xiaoJieJie: {
  name: string,
  age: number,
} = {
  name: "大脚",
  age: 18,
};
console.log(xiaoJieJie.name);

写完后，我们在terminal（终端）中输入ts-node demo1.ts，可以看到结果输出了大脚。这就是一个经典的对象类型，也是最简单的对象类型。对象类型也可以是数组，比如现在我们需要很多小姐姐，我们就可以这样写。

const xiaoJieJies: String[] = ["谢大脚", "刘英", "小红"];

这时候的意思是，变量xiaoJieJies必须是一个数组，数组里的内容必须是字符串。你可以试着把字符串改为数字，VSCode会直接给我们报错

const xiaoJieJies: String[] = ["谢大脚", "刘英", 123];

现在都讲究面向对象编程，我这面向对象编程这么多年了，也没再多编出来一个。我们再来看看下面的代码。这个代码就是用类的形式，来定义变量。

class Person {}
const dajiao: Person = new Person();

这个意思就是dajiao必须是一个Person类对应的对象才可以。我们还可以定义一个函数类型，并确定返回值。代码如下：

const jianXiaoJieJie: () => string = () => {
  return "大脚";
};

那我们现在总结一下对象类型可以有几种形式：

对象类型
数组类型
类类型
函数类型
这几种形式我们在TypeScript里叫做对象类型。
4，简单类型定义
直接上代码：

//定义1
function getTotal(one: number, two: number): number {
  return one + two;
}

const total = getTotal(1, 2);
// 定义2，无返回值
function sayHello(): void {
  console.log("hello world");
}
// 函数参数为对象（结构）时
// 两个参数：
function add({ one, two }: { one: number, two: number }): number {
  return one + two;
}

const three = add({ one: 1, two: 2 });
// 一个参数
function getNumber({ one }: { one: number }): number {
  return one;
}

const one = getNumber({ one: 1 });

5，一般数组类型定义
现在我们可以定义一个最简单的数组类型，比如就是数字类型，那么就可以这么写：

const numberArr = [1, 2, 3];
const numberArr: number[] = [1, 2, 3];
const stringArr: string[] = ["a", "b", "c"];
const undefinedArr: undefined[] = [undefined, undefined];
const arr: (number | string)[] = [1, "string", 2];

6,数组中对象类型定义
如果你作过一些项目，你就会知道真实的项目中数组中一定会有对象的出现。那对于这类带有对象的数组定义就稍微麻烦点了。 比如现在我们要定义一个有很多小姐姐的数组，每一个小姐姐都是一个对象。这是的定义就编程了这样

const xiaoJieJies: { name: string, age: Number }[] = [
  { name: "刘英", age: 18 },
  { name: "谢大脚", age: 28 },
];

这种形式看起来比较麻烦，而且如果有同样类型的数组，写代码也比较麻烦，TypeScript 为我们准备了一个概念，叫做类型别名(type alias)。

比如刚才的代码，就可以定义一个类型别名，定义别名的时候要以type关键字开始。现在定义一个Lady的别名。

type Lady = { name: string, age: Number };
const xiaoJieJies: Lady[] = [
  { name: "刘英", age: 18 },
  { name: "谢大脚", age: 28 },
];
// 利用类定义也是可以的
class Madam {
  name: string;
  age: number;
}
const xiaoJieJies: Madam[] = [
  { name: "刘英", age: 18 },
  { name: "谢大脚", age: 28 },
];

7，元组的使用

const xiaojiejie: [string, string, number] = ["dajiao", "teacher", 28];
const xiaojiejies: [string, string, number][] = [
  ["dajiao", "teacher", 28],
  ["liuying", "teacher", 18],
  ["cuihua", "teacher", 25],
];

8，TypeScript中的interface接口
现在红浪漫洗浴中心要开始招聘小姐姐了，这时候你需要一些小姐姐的简历投递和自动筛选功能，就是不符合简历要求的会直接被筛选掉，符合的才可以进入下一轮的面试。那最好的解决方法就是写一个接口。TypeScript 中的接口，就是用来规范类型的。
9，Interface接口初步了解
现在我们要作一个简历的自动筛选程序，很简单。年龄小于 25 岁，胸围大于 90 公分的，可以进入面试环节。我们最开始的写法是这样的

const screenResume = (name: string, age: number, bust: number) => {
  age < 24 && bust >= 90 && console.log(name + "进入面试");
  age > 24 || (bust < 90 && console.log(name + "你被淘汰"));
};

screenResume("大脚", 18, 94);

这时候老板又增加了需求，说我必须能看到这些女孩的简历。于是你又写了这样一个方法。

const getResume = (name: string, age: number, bust: number) => {
  console.log(name + "年龄是：" + age);
  console.log(name + "胸围是：" + bust);
};
getResume("大脚", 18, 94);

最后我们可以用个办法来整合一下这两个代码----interface
代码如下：

interface Girl {
  name: string;
  age: number;
  bust: number;
}

有了接口后，我们的程序也要作一些修改，需要写成下面的样子。这样就更像是面向对象编程了。

const screenResume = (girl: Girl) => {
  girl.age < 24 && girl.bust >= 90 && console.log(girl.name + "进入面试");
  girl.age > 24 || (girl.bust < 90 && console.log(girl.name + "你被淘汰"));
};

const getResume = (girl: Girl) => {
  console.log(girl.name + "年龄是：" + girl.age);
  console.log(girl.name + "胸围是：" + girl.bust);
};
const girl = {
  name: "大脚",
  age: 18,
  bust: 94,
};

screenResume(girl);
getResume(girl);

10，接口非必选值得定义
因为接口这里的知识点还是挺多的。比如这时候老板又有了新的要求，要求尽量能看到小姐姐的腰围，但是不作强制要求，就是可选值吗。那接口如何定义那？其实typeScript已经为我们准备好了相应的办法，就是在:号前加一个?

比如把Girl的接口写成这样。

interface Girl {
  name: string;
  age: number;
  bust: number;
  waistline?: number;
}
const getResume = (girl: Girl) => {
  console.log(girl.name + "年龄是：" + girl.age);
  console.log(girl.name + "胸围是：" + girl.bust);
  girl.waistline && console.log(girl.name + "腰围是：" + girl.waistline);
};