面试了几家公司,发现 TypeScript 真香!


前言

最近有学前端的小伙伴抱怨,去大厂面试前端,面试官提了一堆 TypeScript 的问题,比如“TypeScript 的特性”、“TypeScript 的内置类型”、“TypeScript 接口是什么意思”等。

他很纳闷,是不是现在不会 TypeScript 就进不了大厂了?

其实,只要你稍微关注一下前端的发展,就会知道 TypeScript 的火爆。2018 年 Stack Overflow Developer 的调研就显示,TypeScript 已经成为比 JavaScript 更受开发者喜爱的编程语言了。

包括腾讯在内等大厂的高级工程师也表示过,TypeScript 使用率很高,并逐渐成为前端编程领域的主流,甚至,Vue 3.0 的 98% 也是由 TypeScript 来写的。

为什么香?

我们都知道,JavaScript 是一门动态弱类型语言, 对变量的类型非常宽容,TypeScript 的出现很好地弥补了 JavaScript 在静态类型检查方面的缺陷,为它提供了良好的类型检查支持。

目前, Angular 和 Vue 的新版本都已使用 TypeScript 进行了重构,在可预见的未来,TypeScript 将成为前端开发者必须掌握的开发语言之一。

那么, TypeScript 提供了哪些特性,使得它成为大家的” 刚需 “呢?

太多了,包括但不限于:

1. 支持静态类型

2. 支持模块

3. 支持接口

4. 支持可选参数方法

5. 支持原型特性

6. 更简洁,可读性和复用性更强,更适合大型项目

7. ……

TS代码难写吗?

TypeScript 代码难写吗?不难,它只是JavaScript的超集,最简单的做法三步就搞定。

1. 找一个 js 文件

2. 按下重命名

3. 把.js 改成.ts

搞定

但接下来,你可能会迎来面试官的毒打……

实验楼上线了一门免费的 TypeScript 基础入门教程,将从“从什么是 TypeScript 开始”,一步步讲解 TypeScrip 基本数据类型、接口、类、函数、模块、命名空间等知识点。

课程地址:

https://www.shiyanlou.com/courses/2023

????????????下面是课程第一节的内容:

初识TypeScript

简介

TypeScript 是 JavaScript 的一个超集,他们两个之间有非常深入的联系,所以在学习 TypeScript 之前,你需要学习 JavaScript 相关教程。在本实验我们将会对 TypeScript 进行简单的介绍并初步使用它。

知识点
  • TypeScript 简介

  • 为何选择 TypeScript

  • 安装使用 TypeScript

TypeScript 简介

什么是TypeScript?

TypeScript 是一种由微软开发的自由和开源的编程语言。它是 JavaScript 的一个超集,而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。它扩展了 JavaScript 的语法,所以任何现有的 JavaScript 程序可以不加改变的在 TypeScript 下工作。TypeScript 是为大型应用之开发而设计,而编译时它产生 JavaScript 以确保兼容性。

TypeScript 与 JavaScript 的区别
  • TypeScript 是 JavaScript 的超集,扩展了 JavaScript 的语法。

  • TypeScript 可处理已有的 JavaScript 代码,并只对其中的 TypeScript 代码进行编译。

  • TypeScript 文件的后缀名 .ts (.ts.tsx.dts),JavaScript 文件是 .js

  • 在编写 TypeScript 的文件的时候就会自动编译成 js 文件。

用一张表格来更清晰的观察两者的区别:


JavaScriptTypeScript
语言脚本语言面向对象编程语言
学习难度灵活易学需要有脚本编程经验
类型轻量级解释编程语言强类型的面向对象编程语言
客户端/服务端客户端服务端都有侧重客户端
拓展名.js.ts 或 .tsx
耗时更快编译代码需要些时间
数据绑定没有类型和接口的概念使用类型和接口表示数据
语法所有的语句都写在脚本标签内。浏览器将脚本标签内的文本识别为脚本一个 TypeScript 程序由模块、方法、变量、语句、表达式和注释构成
静态类型JS 中没有静态类型的概念支持静态类型
模块支持不支持模块支持模块
接口没有接口支持接口
可选参数方法不支持支持
原型没有这种特性支持原型特性
参考选择小型项目TS 是一种面向对象语言,代码更简洁,可读性和复用性强。因此 TS 更适合大型项目。

为何选择 TypeScript

  • TypeScript 增加了代码的可读性和可维护性。

  • 新增了其他语言的语法,比如 Class(类)、Interface(接口)、Generics(泛型)、Enums(枚举)等。

  • TypeScript 拥抱了 ES6 规范。

  • 兼容很多第三方库,即使第三方库不是用 TypeScript 写的,也可以编写单独的类型文件供 TypeScript 读取。

  • TypeScript 拥有活跃的社区

更值得一提的是,TypeScript 在开发时就能给出编译错误,而 JavaScript 错误则需要在运行时才能暴露。作为强类型语言,你可以明确知道数据的类型,代码可读性极强,几乎每个人都能理解。TypeScript被很多业界大佬使用,像Asana、Circle CL 和 Slack 这些公司都在用 TypeScript。

安装使用 TypeScript

打开终端 terminal 输入全局安装命令:

cnpm install -g typescript

新建一个文件index.ts,输入以下内容:

console.log("hello world");
var a: string = "2"; //这是ts写法,暂时不需要掌握,后续会讲到

在终端输入tsc index.ts编译文件,编译成功则会生成一个同名的 js 文件。

生成的 js 文件里则将 ts 语法转换成了 js 语法。

总结

本小节我们学习了以下知识点:

  • TypeScript 简介

  • 为何选择 TypeScript

  • 安装使用 TypeScript

我相信你已经对 TypeScripty 有了一个初步了解,接下来我们将会对 TypeScript 进行进一步学习。

???? 点击阅读原文,免费学习完整课程

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值