【angular】TypeScript 搭建

最新推荐文章于 2023-06-24 17:39:39 发布

FCAT.TOP

最新推荐文章于 2023-06-24 17:39:39 发布

阅读量554

点赞数

分类专栏： angular 文章标签： angular

本文链接：https://blog.csdn.net/xf1195718067/article/details/78659910

版权

angular 专栏收录该内容

15 篇文章 0 订阅

订阅专栏

TypeScript 有一些先天的优势：高度兼容原生脚本语法（甚至可以混着写）对语法的破坏性较少，即使没接触过的人，也能很快上手，初次阅读也没有什么障碍如名字所述，它讲究基于接口的强类型，因此非常适合原本的服务器开发者使用提供了大量编辑器的集成，有现有大量库的 .ts 元文件可用

静态类型检查
IDE 智能提示
代码重构
可读性

自从angular宣布2.0 基于TypeScript构建。TypeScript一下子火起来了。

TypeScript是众多以js为编译目标的语言中，做的最好的之一

安装TypeScript

npm install -g typescript

构建你的第一个TypeScript文件

index.ts

function sayHi(person) {
    return "Hello, " + person;
}

var user = "Jane User";

document.body.innerHTML = sayHi(user);

编译代码

tsc index.ts

类型注解

function sayHi(person: string) {
    return "Hello, " + person;
}

var user = [0, 1, 2];

document.body.innerHTML = sayHi(user);

接口

interface Person {
    firstName: string;
    lastName: string;
}

function sayHi(person: Person) {
    return "Hello, " + person.firstName + " " + person.lastName;
}

var user = { firstName: "Jane", lastName: "User" };

document.body.innerHTML = sayHi(user);

允许我们在实现接口时候只要保证包含了接口要求的结构就可以，而不必明确地使用 implements语句。

类

支持基于类的面向对象编程。

class Student {
    fullName: string;
    constructor(public firstName, public middleInitial, public lastName) {
        this.fullName = firstName + " " + middleInitial + " " + lastName;
    }
}

interface Person {
    firstName: string;
    lastName: string;
}

function sayHi(person : Person) {
    return "Hello, " + person.firstName + " " + person.lastName;
}

var user = new Student("Jane", "M.", "User");

document.body.innerHTML = sayHi(user);

运行TypeScript Web应用

index.html

<!DOCTYPE html>
<html>
    <head><title>TypeScript Greeter</title></head>
    <body>
        <script src="index.js"></script>
    </body>
</html>

angular、spring cloud 开源实战项目源码：https://gitee.com/xfdm/FCat
QQ群：549141844

代码持续更新…

FCAT.TOP

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录