Ts知识点-基础类型

TypeScript 是 JavaScript 的一个超集，主要提供了类型系统和对 ES6+ 的支持

安装:npm install -g typescript
检查是否成功：tsc -V

1. js文件中使用ts代码,需要编译成js代码才能引入 tsc .\text01.ts
2. ts文件中使用js代码,可以直接引入
3. ts文件中函数形参使用某个类型进行修饰，编译后的js文件不会显示【ts:name:string js:name】
4. ts文件中使用let,编译后为var
5. ts文件自动编译:

5.1 生成配置文件tsconfig.json
tsc --init
5.2 修改tsconfig.json配置

"outDir": "./js", // 把ts文件最终编译后放在js目录中
"strict": false, //不使用严格模式

5.3 启动监视任务
终端 -> 运行任务 -> 监视tsconfig.json
6. 类型注解：一种轻量级的为函数或变量添加约束的方式【name:string】
7. 接口：

// 接口：一种能力，一种约束而已
(()=>{
    // 定义一个接口
    interface Iperson {
        firstname:string // 姓
        lastname: string // 名
    }
    // 输出姓名
    function showName(person: Iperson) {
        return  person.firstname + person.lastname
    }
    // 定义一个对象
    const person = {
        firstname:'西门',
        lastname: '吹雪'
    }
    console.log(showName(person));
})()

8. 布尔值类型 字符串类型 数字类型 数组类型 元组类型

let isDone: boolean = false
let a1: number = 10 // 十进制
let name: string = 'tom'
// null 和 undefined 是所有类型的子类型 可以把 null 和 undefined 赋值给 number 类型的变量【注意去除严格模式 tsconfig.json "strict": false, //不使用严格模式】
let u: undefined = undefined
let n: null = null
// 数组类型 里面的数据类型必须和定义数组时候的类型一致
let list1: number[] = [1, 2, 3]
// 数组泛型，Array<元素类型>
let list2: Array<number> = [1, 2, 3]
// 元组类型 类型和数据个数被限定
let t1: [string, number] =  ['hello', 10] // OK

9. 枚举

enum Color {
  Red,
  Green,
  Blue
}

// 枚举数值默认从0开始依次递增
// 根据特定的名称得到对应的枚举数值
let myColor: Color = Color.Green // 1
console.log(myColor, Color.Red, Color.Blue)

10. any类型 适用任何类型【不清楚类型的变量指定一个类型】
let str:any = ['asdnjas']
let list: any[] = [1, true, 'free']
11. void 表示没有任何类型, 一般用来说明函数的返回值不能是undefined和null之外的值
声明一个 void 类型的变量没有什么大用，因为你只能为它赋予 undefined 和 null

function fn(): void {
   console.log('fn()')
   // return undefined
   // return null
   // return 1 // error
 }
console.log( fn());

12. object类型

function fn(obj:object): object {
    console.log(obj);
    // 返回类型是object
    return {
        name:'he',
        age:18
    }
  }
  let obj = {
    height:1.88,
    weight:90
  }
  console.log(fn(obj));
//   console.log(fn(String));
//   console.log(fn(new String('123')));

13. 联合类型

function fn(obj:object | string): object {
    console.log(obj);
    return {
        name:'he',
        age:18
    }
  }

let obj = 'obj'
console.log(fn(obj));

// 类型断言:告诉编译器，我知道我自己是什么类型 写法：1.(<string>变量名) 2.  值 as 类型
function fn(obj: number | string): number {
    //    return obj.toString().length
    if ((<string>obj).length) {
        return (obj as string).length
    } else {
        return obj.toString().length
    }

}

let obj = 123456
console.log(fn(obj));


// 类型推断
/* 定义变量时赋值了, 推断为对应的类型 */
let b9 = 123 // number
// b9 = 'abc' // error

/* 定义变量时没有赋值, 推断为any类型 */
let b10 // any类型
b10 = 123
b10 = 'abc'