TypeScript 入门笔记

TypeScript

TypeScript是一种由微软开发的自由和开源的编程语言。它是JavaScript的一个超集,而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。

Visual Code 安装 TypeScript

npm install -g typescript

构建第一个TypeScript文件

  • 创建文件 *** greeter.ts *** 键入如下内容
function greeter(person) {
    return "Hello, " + person;
}

let user = "Jane User";

console.log(greeter(user));
  • 编译代码

命令行运行如下代码

tsc greeter.ts
  • 当前目录下生成一个文件名相同的js文件 greeter.js

  • 使用node 执行当前js文件

node ./greeter.js
  • 可以看到当前Terminal输出
Hello, Jane User
  • 通过以上代码也就完成了TypeScript第一个小Demo

类型注释

  • TypeScript里的类型注解是一种轻量级的为函数或变量添加约束的方式.我们希望 greeter函数接收一个字符串参数。 然后尝试把 greeter的调用改成传入一个数组:
function greeter(person: string) {
    return "Hello," + person;
}

let user = [ '0' , '1' , '2'];

console.log(greeter(user));

  • 重新编译(可以Terminal报如下错误)
Argument of type 'string[]' is not assignable to parameter of type 'string'.

接口(interface)

  • 在TypeScript里,只在两个类型内部的结构兼容那么这两个类型就是兼容的。 这就允许我们在实现接口时候只要保证包含了接口要求的结构就可以,而不必明确地使用 implements语句。
interface Person {
    firstName: string;
    lastName: string;
}
function greeter(person: Person) {
    return "Hello," + person.firstName + " " + person.lastName;
}
let user = {
    firstName: "Jane",
    lastName: "User"
}
console.log(greeter(user));
  • 编译运行
Hello,Jane User

类(class)

  • TypeScript支持JavaScript的新特性,比如支持基于类的面向对象编程。
  • 创建一个Student类,它带有一个构造函数和一些公共字段。
  • 注意类和接口可以一起共作,程序员可以自行决定抽象的级别
  • 在构造函数的参数上使用public等同于创建了同名的成员变量.
  • 创建文件 student.ts
class Student {
    fullName: string;
    constructor(public firstName, public middleInitial, public lastName) {
        this.fullName = firstName + ' ' + middleInitial + ' ' + lastName;
    }
}
interface Person {
    firstName: string;
    lastName: string;
}

function greeter(person: Person) {
    return "Hello, " + person.firstName + " " + person.lastName;
}
let user = new Student('Jane',"M.","User");

console.log(greeter(user));
  • 编译运行
Hello, Jane User
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 一、什么是TypeScript? TypeScript 是微软开发一款开源的编程语言,本质上是向 JavaScri...
    ConRon阅读 5,511评论 0 3
  • TypeScript 是 JavaScript 的一个超集,主要提供了类型系统和对 ES6 的支持,它由 Micr...
    Gukson666阅读 12,821评论 3 29
  • TypeScript 是微软开发和控制的开源项目,我在应用 Anguar 2+ 和 Ionic 2+ 框架开发系统...
    廖全磊LesterLiao阅读 5,649评论 0 3
  • 慕课网@JoJozhai 老师 TypeScript入门课程分享 TypeScript入门 ES5,ES6,JS,...
    shangpudxd阅读 13,567评论 0 22
  • 公司/团队/项目名称:上海艺相文化传播有限公司 产品名称:Enstylement时尚课程 联系人:Carter z...
    zhaoxiankang阅读 2,490评论 4 0

友情链接更多精彩内容