第一板块:两小时极速入门TypeScript,2-2;2-3,阿莱克斯刘
第二板块:
一.如何搭建开发环境?
由于TypeScript最终会编译成JavaScript代码,所以要安装对应的环境变量:
首先打开TypeScript官方文档:https://www.typescriptlang.org/
在项目中安装TS有两种方式:
(1)通过node.js中的npm安装(npm install -g typescript,检测是否安装成功:tsc -version)
(2)借助vscode编辑器插件安装(小众,一般使用第一种)
在安装TypeScript的前提需要先安装node,node安装方式直接通过node.js官方网站进行下载即可。
二.js的版本梳理:
ES3,ES5:支持目前所有主流浏览器
ES6=ES2015:目前浏览器不支持。ES7=ES2016,ES8=ES2017命名 。
在编写代码的时候我们会发现由ES6转成ES5之后在运行会非常的麻烦。
那么我们可以这么操作:
在终端输入:
npm init
接下来一直回车,会发现项目中会出现package.json文件,这个文件就是用来管理项目的配置文件。
{
"name":"demo-1",
"version":"1.0.0",
"description":"",
"main":"test.js",
"script":{
"test":"echo \'Error:no test specified\' && exit 1",
"start":"npm run start"
},
"author":"",
"dependencies":{
//我们项目中所需要的依赖包
},
"devDependencies":{
//我们项目中所需要的依赖包
}
}
"dependencies"与"devDependencies"的区别:devDependencies仅在开发项目时使用,不需要打包放到服务器;
dependencies则是需要打包放到服务器的。区分两个的好处是:在生产环境中可以让用户快速打开网站访问。注意:为什么说ES6浏览器不支持呢,因为绝大部分网站不支持直接运行.ts文件,需要将.ts文件编译为ES5的.js文件。
第三板块:
写一个ts文件进行测试:
// 文件 test.ts
function foo(str: string) {
console.log(str.length);
}
foo('abc');
在终端执行:tsc test.ts
编译之后我们会发现项目中生成一个test.js的文件。
执行:node test.js
终端输出了3第四板块: