随着科技的发展时代的进步,日益完善并多元化的前端变得如此的丰富多彩且富有诗意(我在说什么),本着活到死学到老的不变社会主义核心价值观,感谢和平年代带给我们的美好与未来。随着vue.3.0的横空出世,前端新一轮的浪潮瞬间天翻地覆,一直安稳不求上进自甘堕落无欲无求满不在乎且自以为是的我终于,坐不住了。咋整?学呗!
之后的日子里,会在不耽误亲情爱情工作友谊等情况下,拿出一点点时间,学习一下,最严格的前端语法,我认为在不久的将来,会取代JavaScript的语言---typeScript.
1、安装typeScript环境
npm install typeScript //简单的要死,哎,这个我都能学会,也是厉害了
安装完成后我们可以使用 tsc 命令来执行 TypeScript 的相关代码,以下是查看版本号:
$ tsc -v
Version 3.6.4
javaScript文件都是什么什么.js
,那么这个typeScript就是什么什么.ts
;我们建一个test.ts
,内容如下:
let message:string = "helloworld";
console.log(message);
命令行执行你会发现
tsc test.ts
多了一个test.js文件,node执行输出 helloworld
;
因为我们的浏览器无法解析ts文件,所以我们最终都要将它转为js文件。
如何查看ts配置文件,可以修改相应配置。比如:outdir,ts编译成的js存放位置。
tsc --init //文件目录出现一个文件 tsconfig.json
2、基础语法
TypeScript 程序由以下几个部分组成:
- 模块
- 函数
- 变量
- 语句和表达式
- 注释
TypeScript 与面向对象
TypeScript 是一种面向对象的编程语言。
面向对象主要有两个概念:对象和类。(和js一样感觉)
- 对象:对象是类的一个实例(对象不是找个女朋友),有状态和行为。例如,一条狗是一个对象,它的状态有:颜色、名字、品种;行为有:摇尾巴、叫、吃等。
- 类:类是一个模板,它描述一类对象的行为和状态。
- 方法:方法是类的操作的实现步骤。
TypeScript 面向对象编程实例:
class Site {
name():void {
console.log("Runoob")
}
}
var obj = new Site();
obj.name();
以上实例定义了一个类 Site,该类有一个方法 name(),该方法在终端上输出字符串 Runoob。
new 关键字创建类的对象,该对象调用方法 name()。
编译后生成的 JavaScript 代码如下:
var Site = /** @class */ (function () {
function Site() {
}
Site.prototype.name = function () {
console.log("Runoob");
};
return Site;
}());
var obj = new Site();
obj.name();//Runoob
下做个简单了解,慢工出细活儿,细水长流也。
网友评论