typeScript学习（一）

什么是typescript

1. typescript是javascript类型的超集，可以变异为纯javascript
2. typescript可以在任何浏览器、任何计算机和任何操作系统上运行，并且是开源的
3. typescript100%支持javascript
4. typescript :为构建大型应用而生，小程序也可以同样使用
5. 生态圈支持广泛
6. 强大的类型系统（强类型，静态类型）
7. 丰富了class的扩展功能（接口，抽象类）
8. 添加了系统级设计能力（自顶向下）

以前的js属于弱类型语言，而ts属于强类型语言，让我们来了解一下，强弱语言之分吧。

• 强类型定义语言:强制数据类型定义的语言。也就是说，一旦一 个变量被指定了某个数据类型，如果不经过强制转换，那么它就永远是这个数据类型

• 弱类型定义语言:数据类型可以被忽略的语言。它与强类型定义语言相反，一个变量可以赋不同数据类型的值。

接下来我们开始学习Ts

首先 我们先了解一下TS的基本类型

• 'TypeSprict ’ 和 ‘JavaSprict’ 的类型是基本一致，‘TypeSprict’ 依次是:
  1. ‘boolean’ – 布尔类型,定以后可以赋值true/false 和Boolean()对象
  2. ‘number’ --数字类型，,定以后可以赋值’2/8/10/16进制’，‘整数类型’， ‘小数类型’，‘NaN’,‘Infinity（表示无穷大）’
  3. ‘string’ – 字符串类型
  4. ‘数组类型’ – ‘类型[]’ /’ Array<类型>’
  5. ‘元组类型’ – ‘[类型]’
  6. ‘enum’ – 枚举
  7. ‘any’ – 任意类型
  8. ‘void’ – 空置,定义方法时候没有返回值使用
  9. ‘null/undefined’ – ‘Null 和 Undefined’
  10. ‘never’ – 不存在类型一般用于错误处理函数.例如’抛出异常’/‘死循环’
  11. ‘object’ – ts 中是泛指非所有非原始类型
  12. ‘类型断言’ – 可以理解成断定这个类型是自己断言设置的类型
• 基本类型使用的时候，通过冒号分割，以冒号左边为变量名，右面是变量的 类型

npm install -g typescript
使用tsc查看版本

2.typescript 运行

//初始运行：demo1.ts
function tsprimary() {
    let web: string = 'hello world'
    console.log(web)
}

tsprimary()

当我们编写了一些TS文件后，我们如何去进行编译和查看结果呢

编译ts的一些方法

1. 在这里介绍一个运行插件 ts-node :npm install -g ts-node
2. 否则使用tsc 文件名编译成js文件
3. 很多厂商支持自动编译（react,angler,vue）

1.ts的静态类型

给变量名加上相应的数据类型，给他相应的静态类型。

let count: number = 1;
count = 2

interface Person{
    name: string,
    age: number
}

const personone: Person= {
    name: "小红",
    age: 18
}

console.log(personone)

1.1基础静态类型

//基础静态类型
const counts: number = 918;
const myname: string = 'jjjj'
//null undefinde boolean void symbol

1.2对象静态类型

//普通对象类型
const Person: {
    name: string,
    age: number
} = {
    name: 'lll',
    age: 18
}


//数组对象类型
const PersonArr: string[] = ['1vcsadf', 'fsasadf', 'sadfasdf']

//类 类型
class Person { }
const person: Person = new Person()//person属于Person类

//函数形式
const createPerson: () => string = ()=> { return 'dajia' } //表明函数的类型，返回值是字符串

2.类型注解和类型推断

//type annotation 类型注解
let count: number;
count=123
//事先注解数据类型


//type interface 类型推断
let countInterfase = 123
他会自动推断数据的类型


如果ts能自动推断就不用声明类型、如果不能就要给他声明类型
//自动推断数据类型
const one = 1;
const two = 2;
const three = one + two

//此时 one two不确定数据类型 any，所以应该给one two添加数据类型
//function getTotal(one:number, two:number)

function getTotal(one, two) {
    return one + two
}
const total = getTotal(1, 2)


const person= {
    name: 'liuying', age: 18
}

3.函数参数和返回类型的注解

function getTotal(one:number, two:number) :number{
    return one + two
}
const total = getTotal(1, 2)



//函数参数的类型，对象做参数的时候，特别注意

function sayHello() {
    console.log('hello world')
}
//函数永远执行不完。使用never
//添加never以后，会执行死循环之后的代码

function errorFunction(): never {
    throw new Error()
    console.log('hello world')
}

function forerver(): never {
    while (true) { }
    console.log('hello world')
}

function add({ o, t }: { o: number, t: number }) {
    return o + t
}
const all = add({ o: 1, t: 0 })