乐趣区

关于javascript:TypeScript-与-JavaScript你应该知道的区别

作者:京东批发 杨冰

译自 Radix 网站的文章,原文链接:https://radixweb.com/blog/typescript-vs-javascript,原文作者:Nihar Raval

正在寻找经验丰富的 JavaScript 开发团队来将您的利用创意变为事实?作为一名开发人员,如果您有机会参加 Web 开发我的项目,您肯定理解 JavaScript 的工作原理。JavaScript 上市多年,已成为开发者社区中风行的脚本语言。

但正如咱们所知,如果一种技术或语言正在崛起,总会有另一种抉择进入市场并与领先者开展强烈竞争。这里有一个新的竞争对手 ——TypeScript。随着 TypeScript 的日益遍及,咱们能够将其视为具备额定性能的 JavaScript 增强版。

谈到 TypeScript,它是一种用于开发大型简单应用程序的开源编程语言。TypeScript 由科技巨头之一——微软——于 2012 年开发,其创立背地的真正起因是解决大型应用程序。

此外,Angular 还应用 TypeScript 进行 Web 开发服务。依据这项钻研,TypeScript 和 JavaScript 别离是开发人员心愿应用的第二和第三大风行语言。你晓得为什么吗?

实际上,JavaScript 被认为是应用程序和网页的次要脚本语言。因而,当初,咱们能够将 JavaScript 用于 TezJS、React 等前端框架,以及 Node.Js 和 Deno 框架的后端。

但当初真正的问题是,JavaScript 是为创立大型简单的 Web 应用程序而开发的吗?我想答案是否定的!

在本文中,咱们将比拟这两种编程语言——TypeScript 与 JavaScript,它们之间的关系,它们的区别,并概述每种语言的长处。

但在此之前,在此视频中疾速理解 TypeScript 和 JavaScript 之间的差别。

TypeScript 与 JavaScript:真正的区别

如果咱们同时思考两者——TypeScript 与 JavaScript,那么每个 JavaScript 代码在 TypeScript 中都是无效的。这意味着 TypeScript 是 JavaScript 的超集。

换句话说,咱们能够说,

JavaScript + 更多功能 = TypeScript

因而,如果您将 JavaScript 编程文件 (.js) 保留为 TypeScript (.ts) 扩展名,它将执行得十分好。但这并不意味着这两种语言——TypeScript 和 JavaScript 是一样的。

因而,在进一步深刻之前,让咱们先理解一下每种语言的根本定义。以下是来自 Google Trends 的数据,显示了这两种前端语言过来一年的搜寻趋势。

为什么在有 JavaScript 的状况下开发 TypeScript?

JavaScript 语言是作为客户端编程语言引入的。然而随着 JavaScript 在 Web 开发中的应用,开发人员理解到它也能够被视为一种服务器端编程语言。

然而,JavaScript 代码也变得相当简单和惨重。因而,JavaScript 无奈满足面向对象编程语言的冀望。因而,JavaScript 永远不会作为服务器端技术在业界蓬勃发展。这就是为什么 TypeScript 语言诞生来弥合这一差距的起因。

什么是 TypeScript?

如果被问到“什么比 JavaScript 更好?”,您肯定会失去答案——TypeScript。

TypeScript 由 Microsoft 开发和保护,是一种面向对象的开源编程语言。它是 JavaScript 的超集,蕴含可选类型。此外,它还能够编译为纯 JavaScript。

简而言之,TypeScript 是一种动态编译的编程语言,用于编写清晰简洁的 JavaScript 代码。它实现与 JavaScript 雷同的目标,可用于客户端和服务器端应用程序。此外,JavaScript 的库也兼容 TypeScript。

TypeScript 是一种同时反对动静类型和动态类型的编程语言。它提供类、可见性范畴、命名空间、继承、联结、接口和许多其余个性。此外,它还提供正文、变量、语句、表达式、模块和函数。

您能够在 Node.Js 或任何其余反对 ECMAScript 3 或其最新版本的浏览器上执行它。

因为 TypeScript 是 JavaScript 的加强版本,因而 JavaScript 的所有代码在语法上都是无效的 TypeScript。然而,这并不意味着 TypeScript 编译器能够解决所有 JavaScript:

let a = 'a'; a = 1; // throws: error TS2322: Type '1' is not assignable to type 'string'.

TypeScript 提供的文件能够蕴含来自以后指标文件的类型数据,相似于 C++ 头文件如何定义以后指标文件的创立。因而,其余应用程序能够应用文件中定义的值,就像应用动态类型值的 TypeScript 实体一样。

您还会找到风行库(如 jQuery、D3.js 和 MongoDB)的第三方头文件。还有用于 NodeJs 根本模块的 TypeScript 标头,容许在 TypeScript 中进行 Node.Js 开发。

TypeScript 的编译器是在 JavaScript 中组装并用 TypeScript 编写的。它在 Apache License 2.0 下注册。

看完 TypeScript 介绍后,您肯定想晓得将动态类型增加到 JavaScript 的目标是什么?

好吧,咱们能够用给定的陈说来廓清你的疑虑:

  • 您能够防止暗藏忍者谬误,例如经典的“未定义”不是函数。
  • 易于重构代码而不会显着毁坏它。
  • 在大规模、简单的零碎中定位本人不再是一场噩梦。

依据这项钻研,TypeScript 辨认出大概 15% 的 JavaScript 谬误。

动静类型的自由性常常导致谬误,这不仅升高了开发人员的效率,而且因为增加新代码行的开销减少而使开发变得很吃力。

因而,因为不足类型和编译时谬误查看,JavaScript 对于组织和大型代码库中的服务器端代码来说是一个蹩脚的抉择。

正如他们的标语所暗示的那样,TypeScript 是可扩大的 JavaScript。

为什么咱们须要应用 TypeScript?

正如咱们之前所说,TypeScript 是 JavaScript 的增强版。因而,在将它与 CoffeeScript(增加了语法糖)或 PureScript(与 JavaScript 齐全不类似)等其余语言进行比拟时,编写 TypeScript 代码须要学习很多货色。

在 TypeScript 中,类型是可选的,任何 JavaScript 文件都是无效的 TypeScript 文件。尽管如果您的任何初始文件存在类型问题,编译器会告诉您,但它仍会提供一个无效的 JavaScript 文件。TypeScript 将不负众望,随着工夫的推移进步您的技能也很简略。

TypeScript 适宜前端还是后端?

因为 TypeScript 被编译为 JavaScript,因而它实用于利用程序开发的前端和后端。

此外,JavaScript 是网页和应用程序前端的首选编程语言。因而,出于同样的起因,可能会应用 TypeScript,但它在服务器端也实用于简单的大型企业我的项目。

然而,您也能够应用其余顶级前端框架(如 React、Angular、Vue)来构建下一代应用程序。

TypeScript 的类型

TypeScript 蕴含各种根本类型,例如 Number、Array、Tuple、Boolean、String 等等。好吧,其中一些类型在 JavaScript 中不可用。然而,您能够在 TypeScript 文档中理解无关它们的更多信息。

此外,上面是一些其余类型,它们是 TypeScript 的表现力:

Any & Unknown

一个名为 Any(任何你想要的)的类型能够笼罩 unknown 是它的类型平安零碎。在这里,any 容许您在想要本义类型零碎时调配和 JavaScript 变量。它宽泛用于形容尚未验证且类型未知的传入变量(例如,来自第三方 API)。

Unknown 相似于 Any,但它不容许您对它执行任何操作,除非它已明确进行类型查看。

Void

当没有返回值时,应用 Void。个别用于不返回任何函数的返回类型。

Never

Never 是不应该产生的事件的返回类型,例如异样抛出函数。

Intersection & Union Types(交加和并集类型)

这些类型容许您依据逻辑创立自定义类型。

交加类型让您能够将几种根本类型组合成一种类型。例如,如果咱们创立一个自定义类型 Person,它蕴含 first_name:string 一个 last_name:string. 好吧,你能够这样说:我心愿我的类型 是这样且那样的

联结类型容许您输出各种根本类型之一。例如,如果有一个返回 result:stringorundefined,您能够这样说:我心愿我的类型 是这个或那个

当您将它们视为空间时,所有这些类型都有意义。

TypeScript 同时反对隐式和显式类型。如果您不显式编写类型,编译器将启用类型推断来辨认您正在应用的类型。

另一方面,明确编写它们会带来益处,例如帮助其余团队成员浏览您的代码并验证您所看到的是编译器所看到的。

TypeScript 的特点

借助 TypeScript 的高级个性,它反对 JavaScript 的附加个性,例如面向对象的编程概念、JS 库、平台无关性等。

Compatibility(兼容性)

TypeScript 也反对旧的和新的附加性能。然而,它兼容所有版本的 JavaScript,例如 ES7 和 ES12。它能够将 ES7 中的残缺代码编译回 ES5,反之亦然。这确保了平稳过渡和语言可移植性。

Static Typing(动态类型)

动态类型意味着开发人员必须申明变量类型。

假如咱们取变量名 str。代码将不会运行,直到您给它一个类型,例如 Integer、Float、List 或任何其余类型。而 TypeScript 是动态类型的。

动态类型能够帮忙您及早检测谬误、更快地实现代码等等。

当初,让咱们在这里为您提供其余突出的特点:

  • 它易于保护并可进步我的项目生产力。
  • 能够应用动态类型和正文
  • 反对面向对象的个性,例如接口、继承和类
  • 调试简略,问题及早发现。
  • 反对 ES6 (ECMAScript),它为解决对象和继承提供了更简略的语法。
  • 全功能 IDE 反对

TypeScript 的长处

TypeScript 提供了多种劣势,能够帮忙您为 Web 开发编写更好的编程语言。

Language Features(语言个性)

以下是 TypeScript 反对的其余性能。

  • 命名空间
  • 接口
  • 空查看
  • 泛型
  • 拜访修饰符

Optional Parameters(可选参数)

// -- TypeScript -- //
function log(message: string = null) { }
// -- TypeScript compiled output -- //
function log(message) {if (message === void 0) {message = null;}
}
// -- JavaScript with Babel -- //
function Log(message = null) { }
// -- Babel compiled output -- //
"use strict";
function Log() {var message = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
}

Classes Class 形式

// -- TypeScript -- //
class Article {
name: string;
constructor(name: string) {this.name = name;}
}
// -- TypeScript compiled output -- //
var Article = /** @class */ (function () {function Article(name) {this.name = name;}
return Article;
}());
// -- JavaScript with Babel -- //
class Article {constructor(name) {this.name = name;}
}
// -- Babel compiled output -- //
"use strict";
function _classCallCheck(instance, Constructor) {if (!(instance instanceof Constructor)) {throw new TypeError("Cannot call a class as a function"); } }
var Article = function Article(name) {_classCallCheck(this, Article);
this.name = name;
};

什么是 JavaScript?

JavaScript – 一种脚本语言,用于开发交互式网页。它恪守客户端编程规定;因而,它能够在用户的​​网络浏览器中无缝执行。然而,您能够将 JavaScript 与其余技术(如 XML 和 REST API)联合应用。

JS 的次要目标是使其成为一种互补的脚本语言,相似于 Visual Basic 之于 C++。然而,JavaScript 不适宜大型简单应用程序。它旨在为一个应用程序只编写几百行代码。

以下是 JavaScript 提供的一些独特性能:

  • 灵便、动静和跨平台
  • 它能够用于客户端和服务器端
  • 轻量化解读
  • 所有浏览器都反对
  • 弱类型
  • 即时编译

TypeScript 和 JavaScript 之间的区别

TypeScript 和 JavaScript 之间的区别
在比拟两种编程语言——TypeScript 和 JavaScript 时,咱们必须思考许多因素,如下所示:

1) 学习曲线

TypeScript 是 JavaScript 的超集。要编写 TypeScript 代码,您应该对 JavaScript 有根本的理解和常识。此外,您还应该分明 OOPS 的概念。

另一方面,JavaScript 是一种风行且易于学习的脚本语言。许多开发人员将 JavaScript 与 CSS 和 HTML 联合应用来创立 Web 应用程序。然而,HTML 很难,因为它蕴含事件处理、Web 行为、动画和脚本。

2)开发者社区

TypeScript 在短时间内流行起来,并被许多企业施行。您会在 Internet 上找到许多学习 TypeScript 的教程和指南。然而,它有一个十分沉闷和反对的社区。

另一方面,与 TypeScript 相比,JavaScript 没有宏大的社区。JavaScript 提供了许多库、框架和代码实际。因而,建议您理解最适宜您的业务需要的 Web 开发团队构造,以取得整体团队绩效。

3)性能

家喻户晓,创立 TypeScript 是为了克服 JavaScript 对大型简单应用程序的挑战。因而,TypeScript 节俭了开发工夫并让开发人员变得更有效率。

TypeScript 和 JavaScript 之间的惟一区别是 TypeScript 代码在执行之前被编译成 JavaScript。

4) 语法

TypeScript 提供了 JavaScript 不提供的变量申明、函数范式和类型零碎。它在语法方面相似于 JScript 和 .Net,反对 ECMAScript 2015 规范性能,包含模块、箭头函数语法和类。

JavaScript 也遵循 ECMAScript 定义。然而,它不是像 TypeScript 这样的类型化语言。它应用许多来自 C 语言的结构化编程术语,例如 if 语句、switch 语句、do-while 循环等等。它提供事件驱动格调、函数式和命令式编程。

5)工具和框架

因为微软反对 TypeScript,它领有许多当先的框架和编辑器。通过与编辑器的严密集成,它提供了编译期间的错误处理,以防止在运行时出错。

另一方面,市场上有许多 JavaScript 框架可用于 Web 开发我的项目需要。这是一个十分受程序员欢送的微小生态系统。您能够疾速找到精通 ReactJS、VueJS、Angular 和其余框架的开发人员。

6)代码

对于 TypeScript:

class Person
{
private name: string;
constructor (private name: string)
{this.name = name;}
name()
{return“name is“+ this.name;}
}

对于 JavaScript:

var Person = (function()
{function Person(personName)
{this.name = personName;}
Person.prototype.name= function()
{return "My name is" + this.name;}
return Person;
})();

TypeScript 与 JavaScript 有何不同?

咱们晓得 TypeScript 提供的性能比 JavaScript 多。简而言之,TypeScript 是一种面向对象的编程语言,而 JavaScript 是一种脚本语言。因而,TypeScript 通过 ES6 个性提供接口和模块;另一方面,JavaScript 不提供此类性能。

实际上,一些开发人员可能会混同面向对象和函数式编程语言。然而,您能够在这里辨别函数式编程与面向对象的编程语言,并理解它们之间的区别。

为什么要将您的我的项目迁徙到 TypeScript?

如果您有一个宏大而简单的代码库,则产生谬误的可能性更高。然而,如果能在编译期间解决了一些谬误,那就太好了。这时你能够应用 TypeScript 来缩小编译时的谬误。最好的局部是残缺的 Java(此处应该是作者笔误,应该是 JavaScript)代码库能够按原样重用。

何时抉择:JavaScript 和 TypeScript 的区别

TypeScript

| 编译时类型查看 | 应用 Vanilla JavaScript,类型验证在运行时执行。然而,这会减少运行时开销,这能够通过进行编译时验证来防止。|
| 大型项目或多个开发人员 | TypeScript 能够在大型项目或许多开发人员一起工作时无缝运行。|
| 易于应用新库或框架 | 假如,如果你正在应用 React 进行开发并且不相熟它的 API,你能够取得 语法提醒来帮忙你辨认和导航新界面。然而,它们都提供类型定义 |

JavaScript

| 小我的项目 | 对于代码较少的小型我的项目,TypeScript 可能有点矫枉过正。|
| 框架反对 | 如果 TypeScript 不反对您抉择的框架 – 例如 EmberJS,那么您可能无奈利用它的性能。|
| 构建工具 | 要生成能运行的最终 JavaScript,TypeScript 须要有一个构建的步骤。不过,在不应用任何构建工具的状况下开发 JavaScript 利用正变得越来越少。|
| 测试工作流程 | 如果您优良的 JavaScript 开发人员曾经在应用测试驱动开发,那么切换到 TypeScript 的益处可能不足以证实迁徙老本是正当的。|

我应该学习 JavaScript 还是 TypeScript?

如果你理解 JavaScript,那么你就很容易了解 TypeScript。它们两种语言共享雷同的语法和运行时行为。

作为最风行的语言,JavaScript 提供了许多资源和宏大的开发人员社区。因为两种语言在很多状况下都以雷同的形式执行,因而 TypeScript 开发人员也能够从这些资源中受害。

TypeScript 绝对于 JavaScript 的劣势

  • TypeScript 反对动态类型。这意味着动态类型容许在构建时查看类型的准确性。
  • 在开发时,TypeScript 会辨认编译谬误。因而,运行时评估谬误的范畴十分小。另一方面,JavaScript 是一种解释型语言。
  • TypeScript 只是具备一些额定性能的 JS,即 ES6 性能。TS 编译器能够将 .ts 文件编译成 ECMAScript,只管它可能不会保留在您抉择的 Web 浏览器中。

TypeScript 会取代 JavaScript 吗?

那么,上述问题的最短答案是否定的!

在议论 TypeScript 时,它是一种齐全不同的语言,只是它继承了 JavaScript 的根本性质。因而,JavaScript 永远也不会被取代。

JavaScript 是软件开发行业中风行的根底技术之一,被大量开发人员用于客户端和服务器端。

另一方面,TypeScript 不间接在 Web 浏览器中执行。它转译为 JavaScript。JavaScript 更容易调试和编译,因为它间接在 Web 浏览器中执行。然而,TypeScript 并不是为所有类型的我的项目开发的。因而,两种编程语言都有其长处和毛病以及一组特色。为了适应企业 Web 发展趋势,您必须采纳新技术或框架来取得更好的业务流程和客户体验。

侧面比拟:TypeScript 与 JavaScript

TypeScript 和 JavaScript 在开发交互式网页方面有许多相似之处。在提供 TypeScript 与 JavaScript 的间接比拟时,咱们能够说 JavaScript 是一种轻量级的解释型动静语言,用于加强 HTML 网页。另一方面,TypeScript 是 JavaScript 的增强版。这意味着 TypeScript 是 JavaScript 和其余一些个性的组合。

  • TypeScript 是由 Microsoft Corporation 开发的一种面向对象的编程语言,而 JavaScript 是用于 Web 的编程语言。
  • TypeScript 是一种用于构建大型 Web 应用程序的开源语言,而 JavaScript 是一种有助于开发交互式网页的服务器端编程语言。
    另一方面,TypeScript 是 JavaScript 的增强版。这意味着 TypeScript 是 JavaScript 和其余一些个性的组合。
    让咱们理解下表中 TypeScript 与 JavaScript 的重要区别。
范畴 Typescript JavaScript
开发者 Microsoft in 2012 Brendan Eich (Netscape),1995 年
定义 TypeScript 是一种弱小的面向对象语言,作为 JavaScript 的超集,具备泛型和 JS 个性来解决 JS 的简单问题。 JavaScript 是一种脚本语言,具备创立动静网页的一流性能。
类型 强类型。TypeScript 反对动态类型和动静类型。 弱类型。JavaScript 仅反对动静类型。
生态 TypeScript 更像是一种反对动态类型的弱小而直观的语言。 JavaScript 是一种简略的语言,它优化了代码的兼容性,易于浏览和编写。
编译 TypeScript 须要编译。 JavaScript 不须要编译。
数据绑定 TypeScript 利用接口和类型等概念来定义所应用的数据。 JavaScript 中没有这样的概念。
学习曲线 TypeScript 有一条不敌对的学习曲线。此外,它须要 JavaScript 常识。 它易于学习并且是一种用于编写 Web 脚本的灵便语言。
Npm 包 应用 Typescript,许多 npm 包要么有动态类型定义,要么有一个更容易装置的内部类型定义。 JavaScript 提供了不须要任何构建步骤就能够搜寻和生成代码的代替计划。
客户端或服务器端 TypeScript 专门用于客户端。 JavaScript 用于服务器端和客户端。
文件扩展名 .tsx 和 .ts .js
社区 TypeScript 有一个较小的软件开发者社区。 JavaScript 领有宏大的软件开发人员社区。
原型设计 原型设计个性在 TypeScript 中可用。 JS 不反对原型设计。
公司和网站 Asana, Clever, Screen award Airbnb、Codecademy、Instagram
代码示例 function multiply (a, b){return a*b;}var result = multiply(a, b);console.log('答案是 -' + result); <script>function multiply (a, b){return a\*b;}var result = multiply(a, b);document.write (‘The answer is –’+ result);</script>

论断

最初,在浏览了咱们在本文中整顿的所有见解之后,咱们能够说这两种语言各有利弊。

TypeScript 适宜想要创立整洁洁净的可读代码的开发人员。好吧,咱们没有提到 TypeScript 提供了什么,包含各种实时谬误检查和动态类型。

尽管 JavaScript 不是一种综合性的编程语言,但它能够与 HTML 一起应用来进步网页的品质。甚至,您会发现许多精通 JavaScript 编码的经验丰富的开发人员。

然而,与 JavaScript 一样,并非所有 Web 浏览器都反对 TypeScript。所以,如果你在 TypeScript 和 JavaScript 之间纠结,能够参考下面的文章。


首次翻译,集体程度无限,有翻译不失当的中央欢送大佬们斧正。

退出移动版