• Skip to main content
  • Skip to primary sidebar

プログラミング入門ナビ by Proglus(プログラス)

プログラミング学習初心者のための情報メディア

本ページにプロモーションが含まれる場合があります

You are here: Home / Archives for TypeScript

TypeScript

TypeScript入門コースのサポート情報

2022-10-10 By プログラミング入門ナビ編集部

TypeScriptサポート情報

Udemyで公開している「はじめてのTypeScriptプログラミング入門」のサポート情報を掲載しています。

Windows環境に関するサポート情報

Windows10を使って検証しています。他のバージョンでは、動作が異なる場合が想定されます。

1. tsc -vを実行した時に、エラーが発生する

現象

error windows tsc -v

PS C:\Users\yourusername> tsc -v
tsc : このシステムではスクリプトの実行が無効になっているため、ファイル C:\Users\naka\AppData\Roaming\npm\tsc.ps1 を読み込むことができません。詳細については、「about_Exec
ution_Policies」(https://go.microsoft.com/fwlink/?LinkID=135170) を参照してください。
発生場所 行:1 文字:1
+ tsc -v
+ ~~~
    + CategoryInfo          : セキュリティ エラー: (: ) []、PSSecurityException
    + FullyQualifiedErrorId : UnauthorizedAccess

原因

PowerShellのデフォルト設定ではスクリプトの実行が禁止になっているため、有効にする必要がある。

対策

下記、ア〜ウを順番に実施
ア) 実行ポリシーを確認

PS C:\Users\username> Get-ExecutionPolicy
Restricted

→ Restricted と表示される場合は、スクリプトの実行が禁止されている。

イ) 一時的に、Unrestricted(すべてのスクリプトを実行可能)を設定する。
PS C:\Users\username> Set-ExecutionPolicy Unrestricted -Scope Process

補足: この設定は、PowerShellを起動するごとに設定が必要となる。恒久的に設定する方法は存在するが、ご自身で調べて設定と問題解決ができる方を除き、セキュリティの観点で推奨しない。

ウ) Unrestrictedが設定されたか、確認する
PS C:\Users\username> Get-ExecutionPolicy
Unrestricted

2. lite-serverを起動した時にダイアログが表示される

どのアプリで開きますか?

Google Chromeで開く

Windows セキュリティの重要な警告

Node.jsが、ファイアウォールでブロックされないように設定する。

3. バッチ ジョブを終了しますか (Y/N)?

ターミナルで、実行中のコマンドを終了するためにcontrol + cキーを押した時に、表示される。
「Y」キーを押してから、エンターキーを押すことで、終了できる。

動画でプログラミング入門をしよう

オンライン学習サービスProglus(プログラス)でプログラミングを学び、創れる人になろう!

プレミアムプランを2週間無料体験しよう

今すぐ詳細を確認する

Filed Under: プログラミング入門 Tagged With: TypeScript

TypeScriptとは?JavaScriptとの違いは?人気の理由を徹底解説!

2020-11-30 By プログラミング入門ナビ編集部

議論するエンジニアたち

はじめに

ITエンジニア

TypeScriptというプログラミング言語をご存知でしょうか?

JavaScriptと名前が似ているからその仲間かな?と思った方、あながち間違っていません。

この記事では、使いやすいと人気上昇中のTypeScriptについて詳しく解説します。

TypeScriptとは

TypeScriptは2012年にMicrosoft社によって開発されたオープンソースのプログラミング言語です。

2017年にはGoogleの社内標準言語として採用されたことから注目を集めています。

いったいどんな言語なのでしょうか?

JavaScriptの進化版

TypeScriptは下記の理由からJavaScriptの進化版のプログラミング言語といわれています。

  • Alternative JavaScript(AltJS)である
  • JavaScriptのスーパーセットである

まず「Alternative JavaScript」についてですがこれは「JavaScriptの代替言語」という意味です。

JavaScriptは汎用性が高く世界中で普及している言語ではありますが、多少ややこしいところや使いにくいところがあります。

それをカバーするために「記述を別の言語で行った後に全く同じ挙動をするJavaScriptプログラムに変換して使用しよう」という動きがあるのです。

その「別の言語」の一つがTypeScriptで、後ほど取り上げますがJavaScriptと比較し記述しやすくなっています。

なお、AltJSはTypeScriptだけではありません。

他にもRubyのように記述できるCoffeeScriptや、Googleが大規模Webアプリのために開発したDart等があります。

また、TypeScriptはJavaScriptのスーパーセットです。

これは簡単にいうと「全てのJavaScriptの文法はTypeScriptでも使用可能」ということなので、既存のJavaScriptプログラムはTypeScriptプログラムとして実行できます。

こういった点が、TypeScriptはJavaScriptの進化版であるといわれる所以です。

GitHub人気急上昇言語の一つ

GitHub人気上昇言語ランキング

GitHubが年次で発表する世界の開発状況に関するレポート「The State of the Octoverse」では、人気急上昇のプログラミング言語を紹介しています。

ここでTypeScriptは5位に入っており、人気の高さが見て取れますね。

先ほど他のAltJSとして先述したDartが1位なのは、iOSアプリ・Andoridアプリの両方を同じ環境で開発できるプラットフォームであるFlutterで使用できるため注目を集めているのが理由でしょう。

Rust・Kotlinといった言語も上位に入っていますが、これらはTypeScriptと同様に、後述する「静的型付け」が可能なので人気が上がっているのではないかと分析されています。

JavaScriptとの違い

コードを比較する開発者たち

TypeScriptがJavaScriptの進化版であることは説明しましたが、どういった点が異なるのでしょうか。

静的型付けができる

プログラミング言語にはデータの型(整数・文字列・ブーリアン等)について、プログラマーがあらかじめ明示的に決める「静的型付け」のパターンと、実行時に自動的に決められる「動的型付け」のパターンがあります。

JavaScriptはもともと動的型付けで、プログラミングの際にデータ型を気にせず気軽に記述できるのですが、変数に想定と違うデータ型が代入されてエラーが起こる可能性がありそれは実行時になるまでわかりません。

TypeScriptでは動的型付けだけでなく静的型付けもオプションとして選択可能です。

もし最初に定義したデータ型と異なる値が代入される箇所があればコンパイル時にエラーとして検出されるため、意図しないエラーを低減させることができます。

クラスを作成できる

JavaScriptはオブジェクト指向のプログラミング言語です。簡単にいうと、ソースコードの中で同じような動作をする部分をひとかたまり(オブジェクト)としてまとめておき、後から簡単に使い回すことができる仕組みがあります。

「クラス」はオブジェクトの設計書であり、どんなデータを持ってどんな操作ができるのかを記述したものです。

オブジェクト指向のプログラミング言語のほとんどはクラスを作成できるようになっているのですが、JavaScriptは2015年に発表された新標準(ECMAScript 2015)より前ではクラスを使えませんでした。

また、新標準でクラスを使えるようになったとはいえ、まだ一部のブラウザや一部バージョンによってはこの新標準への対応が行われておらず、正しく動作するとは限りません。

そのため旧仕様のJavaScriptはまだ一般的に使用されており、ここでクラスを作ろうとすると関数などを活用して無理やり記述する必要があったのですが、TypeScriptではクラスを作成することができます。

nullやundefinedのチェック可能

JavaScriptプログラムを実行時に、参照した値がnullやundefinedでエラーになったことはありませんか?

これは最もよくある実行時エラーの一つですよね。

TypeScriptではこういったエラーを最小化するため、コンパイル時にnullやundefinedの可能性がある変数をチェックすることが可能です。

このような仕組みは「null safe」や「null安全」と呼ばれ、事前にエラーを減らすための方法として注目を集めています。

TypeScriptの利点

議論するエンジニアたち

JavaScriptとの違いをふまえて、TypeScriptの利点についても見ていきましょう。

大人数で開発してもエラーを抑えられる

データ型の間違い検知やnull・undefinedチェックができるので、実行してみるまでわからなかったようなエラーを事前に撲滅できます。

また、大人数で開発している場合に、自分は文字列しか入らないと想定して書いた部分に対して別の開発者が数値を入れてしまうことがあるかもしれません。

動的型付けは規模の小さいコードを少人数で書く時はスピーディーで手軽なのが利点ですが、大人数になればなるほどこのように想定しないエラーやバグの原因となりやすいです。

また、エラーが発生してしまった後も何が原因なのか突き止めにくくなります。

TypeScriptのように静的型付けやnull安全が担保されていればそのリスクも減りますね。

先述の人気急上昇言語でも静的型付け言語が上位に入っていたのはそういった背景に基づいているといえるでしょう。

コードが読みやすい

クラスを記述できるので、クラスが作れないなか無理にオブジェクト指向を実現していたJavaScriptと比較し読みやすいコードが書けるのが利点です。

また、データ型も明示的に記述するため、どんな型が入る想定で書いているのかが伝えやすく、読む側としても読み取りやすくなります。

nullやundefinedチェックがあるため宣言しっぱなしの変数も減り「これ何のための変数なんだろう?」といった疑問も少なくなるでしょう。

まとめ

いいね!と微笑む開発者たち

人気急上昇中のTypeScriptについて、JavaScriptと比較しながらその特徴やメリットを紹介しました。

JavaScriptを学習したことのある方は学んでみてはいかがでしょうか。

動画でプログラミング入門をしよう

オンライン学習サービスProglus(プログラス)でプログラミングを学び、創れる人になろう!

プレミアムプランを2週間無料体験しよう

今すぐ詳細を確認する

Filed Under: プログラミング入門 Tagged With: JavaScript, TypeScript

Primary Sidebar

Proglus(プログラス)

Twitter

Follow @programmingnavi Tweets by programmingnavi

最近の投稿

  • 【05/02更新】Udemyプログラミング入門講座等の割引クーポン配布
  • AWSのパブリックIPv4アドレス有料化について 2024/2より
  • 【CSS】Google Fontsの利用方法について解説します!新UIに対応2023年11月更新
  • 【SQL】XAMPPのMySQLがXAMPPがポートの競合で起動できない問題について解決方法を解説します!
  • 【Colab】–NOMAL– と表示されて、ショートカットキー(ctrl+c)でコピーができない場合の解決方法を解説します!

カテゴリー

  • AIの使い方
  • Arduino入門
  • AWS
  • その他
  • エンジニアのしごと
  • エンジニアへの道
  • ツールの使い方
  • ニュース
  • プログラミング入門
  • 電子工作入門

タグクラウド

AI AWS AWS Cloud9 Cloud9 CodeWing CSS Emmet GCP Git GitHub Heroku HTML JavaScript li Linux macOS MySQL MySQL Workbench node.js Nuxt.js ol Proglus Python Ruby Ruby on Rails SQL Udemy Visual Studio Code Vue.js Web開発 Windows インストール エラー エンジニア オンライン学習 サーバー スクリーンショット セール プログラミング プログラミング入門 プログラミング学習 ユーデミー 初心者 未経験 機械学習

アーカイブ

  • 2025年5月
  • 2024年1月
  • 2023年11月
  • 2023年9月
  • 2023年8月
  • 2023年7月
  • 2023年5月
  • 2023年4月
  • 2023年2月
  • 2023年1月
  • 2022年12月
  • 2022年11月
  • 2022年10月
  • 2022年9月
  • 2022年8月
  • 2022年7月
  • 2022年4月
  • 2022年3月
  • 2022年2月
  • 2022年1月
  • 2021年10月
  • 2021年9月
  • 2021年8月
  • 2021年6月
  • 2021年4月
  • 2021年3月
  • 2021年1月
  • 2020年12月
  • 2020年11月
  • 2020年10月
  • 2020年9月
  • 2020年8月
  • 2020年7月
  • 2020年5月
  • 2020年4月
  • 2020年3月
  • 2020年2月
  • 2020年1月
  • 2019年11月
  • 2019年9月
  • 2019年7月
  • 2019年6月
  • 2019年5月
  • 2019年4月
  • 2019年3月
  • 2019年2月
  • 2019年1月
  • 2018年12月
  • 2018年11月
  • 2018年10月
  • 2018年9月
  • 2018年8月
  • 2018年7月
  • 2018年6月
  • 2018年5月
  • 2018年4月
  • 2018年3月

検索

Copyright © 2025 · programmingnavi.com ・About・プライバシーポリシー