入门

你喜欢编程吗？

是的

你经常使用JavaScript开发吗？

是的

你用过TypeScript开发吗？

用过，但是没有掌握它

好的，编程江湖，风云再起，TypeScript通关秘籍助你登顶武林盟主！

进阶

你知道什么是类型系统吗？

类型系统是一种在写代码时（static）就可通过声明的类型防止程序在运行时(running time)出错的程序

能举个例子不？

例子1

Number num = 1
num = '1' // 类型系统会 提示报错 Number can't set to string

JavaScript可以做到上面的事情吗？

不能哦

怎样让JavaScript拥有类型系统呢？

扩展JavaScript的语法，套一个类型系统给它

TypeScript就是这么做的，下图为证！

你知道TypeScript的基本语法吗？

知道

例子2

const num:number = 1

为什么不是例子1的语法？

TypeScript编译的目标是转换为JavaScript，.ts文件可以直接书写JavaScript代码，考虑到以上两点，所以TypeScript是这样的语法，去掉类型 :number 就是JavaScript代码，有助于TypeScript的普及，一统前端江湖

你知道TypeScript门派所在何地吗？

知道，门派传送矩阵 www.typescriptlang.org/

请随我一起探索 TypeSctipt 门派

探索

你知道如何建立自己的洞府吗？

知道，执行门派口令即可

npx crb-cli init ts-secret

src/index.ts

const hi:string = 'hi'

请运行编译命令

npm run compiler

发现有什么错误了吗？

发现了如下错误：Cannot redeclare block-scoped variable 'hi'.

为什么会出现？

因为TypeScript是根据tsconfig.json所在的最近目录去决定编译哪些文件的，如果没有tsconfig.json，会默认采用的是全局作用域，虽然在两个不同的文件有两个变量 hi,但是TypeScript认为这是在同一全局作用域声明了两个相同的变量所以报错，相当于JavaScript中的以下情况

怎么去解决呢？

模块化就是为解决这个问题的，直接执行以下命令,默认产生 tsconfig.json 文件，里面有个默认配置模块化方案是 commonjs

npx tsc --init

修改文件 src/index.ts 为

export const hi:string = 'hi'

门派任务1，通过模块化消灭重复声明的bug顺利完成

TypeScript通关秘籍初篇修炼完成，: )