TypescriptとJavaScriptの違いを理解する

私が受け取るよくある質問の1つは、JavaScriptとTypescriptの違いは何ですか？

確認してみましょう…

コーディングを開始したときから、JavaScript（JS）はすべてのフロントエンドプロジェクトの一部でした。 JSに少し慣れている場合は、TypeScriptをJSに加えて、アプリケーションをすっきりと入力できるようにするいくつかの追加機能と考えてください。 typeScriptは、JS開発をより効率的にし、コンパイルエラーを早期にキャッチするために、Microsoftによってオープンソースプロジェクトとして開発されました。

この記事では、JavaScriptとTypeScriptのいくつかの重要な機能と、両方のスクリプト言語の違いについて説明します。

JavaScriptとは何ですか？

JavaScriptはクライアント側のスクリプトに使用されます。 HTMLページでスクリプトを作成するか、拡張子が.jsのファイルを作成してHTMLファイルに含めることができます。 JavaScriptを確認できる一般的な実例は、ログインページの検証です。この場合、ユーザー名/パスワードが正しくない場合にエラーが表示されます。

簡単なJSコードを記述して、ブラウザーで実行してみましょう。

example.htmlファイルを作成し、次のコードを追加します。

 <script> feeling = 'happy'; feeling = 23; </script>

この単純なコードは変数を宣言し、それにhappy（文字列）の値を割り当てます。 同じ変数に異なるタイプ（数値）の値を割り当てることができます。 JavaScriptはそれについて文句を言わず、問題なくどのブラウザでもコードを実行できます。 それでは、ユーザーから感情の価値を取得しましょう。

HTMLは次のようになります。

 <input type = "textbox" id = "howyoufeel">

スクリプトは次のようになります。

 feeling = document.getElementById("howyoufeel").value;

スクリプトに明示的なチェックを入れない限り、JSはユーザーからの値を受け入れて渡します。 したがって、感情変数には234、@。＃$％などを入れることができます。

JavaScriptの機能

上記から、JavaScriptの次の機能を確認できます。

• 弱い型のスクリプト言語
• クライアント側とサーバー側（node.jsを使用）のスクリプトに使用されます
• 柔軟でダイナミック
• すべての主要なブラウザでサポートされています
• 軽量で解釈済み

JavaScriptの習得に興味がある場合は、このUdemyコースを確認してください。

TypeScriptとは何ですか？

実際のアプリケーションには、多くの検証と動的チェックがあります。 このようなアプリケーションの場合、主に型チェックがないため、JavaScriptコードはある時点でテストが困難になります。 ユーザーから価値を得る一方で、最初から価値を正しく得ることが重要です。 これは、TypeScriptが売り込むところです。

TypeScriptは強く型付けされており、変数の型を定義しないと文句を言うコンパイラがあります。

JavaScriptとTypeScriptはどちらも、スクリプト言語のECMAScript仕様に準拠しています。 TypescriptはすべてのJavaScriptコードを実行でき、そのすべてのライブラリをサポートします。そのため、TypescriptはJavaScriptのスーパーセットと呼ばれています。

TypeScriptのインストール

TypeScriptで以前のコードを実行するには、npmパッケージを使用してTypeScriptコンパイラをインストールする必要があります（ノードjsがある場合）。

 npm install -g typescript

または、Microsoftの公式ダウンロードページから直接ダウンロードしてください。 TSプレイグラウンドを使用して、コードがtsからjsにトランスコンパイルされる方法を確認することもできます。

これが完了したら、 tsconfig.jsonプロジェクト設定を構成し、任意のIDEまたはテキストエディターを使用してTypeScriptコードを記述し、それを.tsとして保存.tsます。

変数の型を定義しないことで回避でき、TypeScriptはデータ型を推測できます。 ただし、コンパイル中に最初に使用されたタイプ（この場合は文字列）以外のものを指定すると、「フィーリング」エラーが発生します。

保守性と使いやすさのために、コードに型注釈を付けることは常に適切です。

 var feeling: string = “happy”;

それではない！

TypeScriptは、開発者の生活を楽にする他の多くの機能を提供します。

TypeScriptの機能

Typescriptには豊富な機能セットがあり、すべてのリリースには、以前よりも開発を容易にする新機能が付属しています。 たとえば、新しいリリース（4.0）では、いくつかの追加機能として、可変個引数タプルタイプ、カスタムJSXファクトリ、コンストラクターからのクラスプロパティ推論などがあります。TypeScriptの一般的な機能は次のとおりです。

• インターフェイス、継承、クラスなどのオブジェクト指向プログラミングの概念をサポートします。 ジェネリック
• エラーの早期検出
• 構文チェックと提案によるIDEサポート
• 入力するとデバッグが容易になります
• JavaScriptにトランスコンパイルします
• サーバー側とクライアント側の両方のアプリケーションに使用されます
• クロスプラットフォームとクロスブラウザのサポート
• すべてのJSライブラリと拡張機能をサポートします

なぜTypeScriptが必要なのですか？ （JavaScriptに対するTypeScriptの利点）

Microsoftは、TypeScriptを開発して社内プロジェクトで2年間使用した後、2012年に公開しました。本番環境グレードのエンタープライズアプリケーションのコードをテストする方が簡単だったため、型付きJavaScriptを作成しました。 動的型付け機能は引き続き使用できますが、本当に必要な場合は変数を入力することもできます。

以下のコードを検討してください。

 var mynum = //get from user; addten(number){ return number + 10; }

結果は常に数値になると予想されます。 しかし、ユーザーが「羊」を与えるとどうなるでしょうか。 出力はsheep10になります。理想的には、この操作は不可能であることをユーザーに通知する必要があります。

また、タイプ情報を利用できる場合、テキストエディタとIDEは、実行時エラーを使用して保存するのに便利になります。 また、後でコードをリファクタリングする方が簡単です。

それはJavaScriptが必要ないということですか？ （JavaScriptに対するTypeScriptのデメリット）

TypeScriptはJavaScriptの拡張機能と考えることができますが、これに代わるものではありません。

コードの小さなチャンクの場合、TypeScriptはオーバーヘッドになる可能性があります。インストール、コンパイル、トランスコンパイルは冗長になります。 JavaScriptを使用すると、スクリプトをHTMLで入力するだけで、機能します。 また、何かを変更するたびにブラウザを更新するだけで、コードのデバッグも簡単になります。

直接比較

TypeScriptとJavaScriptの両方の機能と利点を理解したので、さらに比較してみましょう。

結論

学習の観点からは、JavaScriptが自然な選択になる可能性があります。 ファイルを開き、 <script></script>タグ内に何かを入力し、それをHTMLとして保存すると、結果が表示されます。 その後、それを基に構築して、より動的なコンテンツを作成できます。

さらに、大規模なアプリケーションで作業している場合、JavaScriptの知識があると、TypeScriptに簡単に移行できます。

ただし、キャリアと支払いの観点から、TypeScript開発者は、JSプロジェクトとTSプロジェクトの両方に柔軟かつ快適に対応できるため、市場での資産としては間違いなく優れています。 通常、TypeScript開発者には年間11万ドルから14万7000ドルの範囲で支払われますが、JS開発者には年間約6万3000ドルから11万8000ドルが支払われます。