ヘルプあなたは活字体()思考のタイプを開発します

はじめに:プログラマーとして、私はあなたのためのアプリケーション分野の非常に広い範囲で、JavaScript言語をマスターしているので、プログラマである各請求項は、言語を習得しなければならないと考えています。
しかし、JavaScriptの自身の欠点は、私たちは、多くの場合、JavaScriptが大規模な開発プロジェクトに適していないと言うように、すべてのプログラマが完全に理解されていること、欠陥がプロジェクトの制約を作る大きなセキュリティ上のリスクがあると考えています。
それでは、どのようにこの問題を解決するには?
不足を補うことができ、より良いJavaScript言語はありますか?
痛みの隣にこの記事では、JavaScriptの展開を指して、私たちはTypeScripをリードするための方法を十分に理解して、タイプによって引き起こされる問題のいくつかをまとめたもの。

1.1優れたJavaScript
JavaScriptは良いプログラミング言語ですか?
それぞれの人は、ビューのまったく同じポイントではないかもしれないが、多くの観点から、JavaScriptは非常に優れたプログラミング言語です。
また、言語は、時間の長い期間のための場所ではありませんと言うことができる、と誰もがより広く分野で使用されます。
有名なアトウッドの法則:
2007年に創業者のジェフ・アトウッドStackオーバーフロー一つは有名なアトウッドの法則を作りました。
JavaScriptで記述することができanyアプリケーションは 、最終的には、JavaScriptで記述されます。
すべてのアプリケーションは、は、最終的にはJavaScriptを使用して実装されている達成するためにJavaScriptを使用することができます。
実際には、我々はすでに、まだ少なくとも今のところ、ブラウザはJavaScriptに代わるのを見ていない、ともサーバ側(Nodejs)上のアプリケーションの広い範囲を用意しました。
優れたJavaScriptは弱点ではないでしょうか?
;実際には、様々な歴史的要因、JavaScript言語自体は、多くの欠点がある
などES5と範囲の問題の前にvarキーワードの使用など;
配列型がされていないな連続したメモリ空間のJavaScriptの初期設計として、
例えば、JavaScriptは今日まで、このタイプの結合を検出するためのメカニズムはありません。
JavaScriptは徐々に良くなっている
ことは否めない、JavaScriptはゆっくりとそれが地面やアプリケーションレベルから設計されているかどうか、良くなっています。
な導入などES6,7,8、それぞれの言語は、より近代的な、より安全で便利になります。
今日知っている、しかし、JavaScriptはまだ検出の種類は進捗(タイプ検出は非常に重要である理由は、私は後でに話をします)ではありません。
問題の1.2種類の原因と
開発のプログラミング、最初にあなたが知る必要があるすべての、我々は合意しています。エラーが早いほど良い起こっ
コードを書くときにエラーを見つけることができるように、していない再発見の利点(IDEは、コードのコンパイル時にありますエラーを見つけ、私たちを助けるためにコードを書き込む処理)。
コードが実行されている時に、コードのコンパイル時にエラーを見つけ、あなたが見つけていない(検出のタイプを助けるために非常に良いことができ、私たちはそれを行います)。
開発段階でエラーを見つけることができるように、我々は、ライン上のエラーを見つけることができませんが、テスト中にエラーを検出するために、テスト中にエラーを見つけることができません。
今、私たちは探求したいコンパイル時にコード内のエラーコードを見つける方法です:
JavaScriptはそれを行うことができますか?いいえ、私たちはしばしば発生する可能性のあるコードの問題の以下の部分を見てください。

関数のgetLength(STR){
戻りstr.length。
}

console.log( "1つのコードが実行される。");
はconsole.log( "2スタート機能。");
のgetLength( "ABC"); //正しいコール
のgetLength(); //間違ったコール(IDEおよびエラーなし)

//上記のコードのエラーの後、後続のすべてのコードは、通常の実行を続行することができません
はconsole.log(「3通話終了を。」);
ヘルプあなたは活字体()思考のタイプを開発します
ブラウザでの動作結果、次のように:
ヘルプあなたは活字体()思考のタイプを開発します
image02
これは非常に一般的な間違いである私たち。
操作中にエラーが見つかったまでこの理由は、JavaScriptが何らかの制限に渡された私たちの引数ではありませんので、大きな間違いである、だけ待つことができます。
このエラーが発生した場合、それはフォローアップコードの継続的な実施に影響を与えるだろう、小さなミスとの綿密なクラッシュため、プロジェクト全体、
キャッチされない例外TypeError:缶の読み取りプロパティではない未定義の「長さ」
もちろん、あなたが考えるかもしれない:どのように私は、このような低レベルのミスを犯すだろうか?
我々は上記の私たちのような簡単なデモを書くときは、そのような間違いは容易に回避することができ、エラーが発生したときに、それがチェックアウトすることは非常に簡単です。
しかし、我々は、大規模なプロジェクトにそれを開発するとき?あなたはこのような問題ということを保証することはできないのだろうか?我々は他の誰かのライブラリを呼び出すようにしている場合や、どのように私たちが最後に渡すことをどのような種類のパラメータである知っているのですか?
しかし、我々は開発中のJavaScriptに多くの制約を追加することができる場合は、この問題を回避するために良いことができます:
タイプたとえば、私たちのgetLength関数strが、発信者がコンパイル意志の間に通過しなかった、ではない合格しなければならないですエラー;
我々はそれが直接のエラーの他のタイプを渡し、文字列型でなければなりませんでしたので。
その後、あなたではなく、待機より見つけて修正して行くために実行時まで、コンパイル時に発見されたミスの問題の多くを知っている。
1.3思考のタイプが存在しない場合
我々は、単に思考のタイプについてのフロントエンド開発の結果として損失がありませんので、型チェックは、JavaScriptをもたらした問題のいくつかは、初期設計から、制約の種類を考慮していなかったためということを理解している:
フロントエンドの開発者は通常、気や変数はありません ;それはタイプを決定する必要があるとき、私たちは多くの場合、ベリファイ判定の様々なを使用する必要がある場合、どのような引数のは、ある
十分ではなく、何の型制約が存在しないためにも、他の方向からのスタッフの前に行くが、常に不安の独自のコードを心配します堅牢;
我々は、多くの場合、JavaScriptが大規模な開発プロジェクトに適していないと言うので、アップに一度時に巨大なプロジェクトので、緩い拘束のこのタイプは、セキュリティリスクの多くをもたらすでしょう、そしてより多くのスタッフの開発はまた、それらの間の契約の良いタイプではありません。
たとえば、ときに我々は無いタイプの制約あれば、他の人が様々なパラメータに渡すことが我々のコードの堅牢性を確保するために検証し必要がある、コア・クラス・ライブラリを達成するために行く。
たとえば、我々は他の誰か、他の関数に関数を呼び出しますすべてのコメントは、我々は唯一の戻り値は、どのようなタイプで、この関数の内部では、あなたがパラメータを渡すために必要なもののロジックを理解することである見ることができます。
、JavaScriptの型制約上の欠陥を補うため、制約の種類を増加させるためには、多くの企業が独自のプログラムを立ち上げました。
2014インディアン、FacebookはJavaScriptを種類を確認するために、フローを開始しました。
同じ年では、マイクロソフトMicrosoftはまた、TypeScript1.0バージョンを導入しました。
彼らはJavaScriptに型チェックを提供することにコミットしている。
そして今、間違いなく活字体は完全に勝利されました:
Vue2.xの使用は型チェックを行うための時間の流れであり、
軒並みVue3.xは、活字体になってきた、98.3パーセントは、活字体を使用していました復興;
と角が非常に早い活字体プロジェクトの使用上の復興と活字体の開発を使用する必要がありました。
;Facebookや自分の会社の製品のさらにいくつかはまた、活字体を使用している
活字体が我々のコードに制約の種類を増やすことができるだけでなく、学習が、私たちは、フロントエンドプログラマは思考の型を持つ開発することができます。
今日のヒーローは、壮大なデビューにそれを活字体ましょう!
II。出会い活字体
2.1。活字体は何である
私たちはすでに活字体がやっている知っている、ともそれは問題を解決知っているが、我々はまだ終わりで活字ものです完全に理解する必要があるのに?
自分とGitHubの公式の活字体の定義で見てみましょう:

GitHubのは言う:活字体はきれいなJavaScriptにコンパイル出力というのJavaScriptのスーパーセットです。
typescriptです公式サイト:活字体では、JavaScriptの型付きスーパーセットです 。プレーンなJavaScriptにコンパイルがいることを
翻訳:活字体は、JavaScriptのスーパーセットのタイプを持つことである、それは、普通にコンパイルすることができますきれいな、完全なJavaScriptコード。

上記の言葉を理解するには?
私たちは、活字体では、JavaScriptの拡張版として理解することができます。
JavaScriptは活字体はすべてのサポートされている、それが標準のECMAScriptを踏襲している、プロパティを所有していたので、ES6、ES7、ES8およびサポートされている他の新しい構文標準;
や言語レベルだけでなく、増加します型制約はなく、そのようないくつか列挙型(列挙型)として構文拡張、タプル型(タプル)などを含め、
TypeScript新機能を実現しながら、と常に同期ESの標準とさえリードを保った。
と活字体あなたはコンパイル時に、その互換性の問題を心配する必要も、そのようなバベルのようなツールの助けを必要としないので、最終的には、JavaScriptコードにコンパイルされます。
神はJavaScriptを許可していないだけで、JavaScriptで満たされたとして、それゆえ、我々は活字体で理解することができますより安全、それは素敵な特殊効果機器の多くをもたらします;
。活字体の2.2特性
公式活字体の段落は、特性を説明してきた、私は(いくつかの正式な、見た目が)場所で非常に感じ、私たちは一緒に共有します。
JavaScriptを帰せ、JavaScriptで始まった

はJavaScriptの数百万からtypescriptです本日オープン 構文とセマンティクスに精通している人は、開始します。人気のJavaScriptライブラリを含む既存のJavaScriptコードを使用して、およびJavaScriptコードから活字体のコードを呼び出します。


活字体は、純粋な、簡単なJavaScriptコードをコンパイルすることができ、およびJavaScriptエンジンで任意のブラウザ、Node.jsの環境および任意のECMAScriptの3のためのサポート(またはそれ以降)上で実行することができます。

typescriptですが、大規模なプロジェクト構築するための強力なツールです

のJavaScriptのタイプは、開発者が、このような静的チェックやリファクタリングなどのJavaScriptアプリケーションの開発に開発ツールと共通の操作を使用して効率的にできるようになります。


タイプはオプションで、あなたは、コードの静的検証を作るコメントのいくつかのタイプのための型推論は非常に異なっています。タイプは、ソフトウェアコンポーネント間の行動にインターフェイスと既存のJavaScriptライブラリの洞察を定義することができます。

高度なJavaScriptは

最新とJavaScriptを進化さを提供するために、typescriptですが、ヘルプビルド堅牢なコンポーネントに、このような非同期機能とデコレーターとして2015の機能、からのものはECMAScriptと将来の提案を含め、ます。


これらの特性の高信頼されたアプリケーションを開発して利用可能ですが、JavaScriptのきちんとしECMAScript3(またはそれ以降)にコンパイルされます。

これらの特性により、活字体は今、多くの場所で適用されているので、それは次のとおりです。
私たちの前にVue3と角度が活字体を再構築し使用していた言及を含む。
ヘルプあなたは活字体()思考のタイプを開発しますimage03

vue3ソース

ヘルプあなたは活字体()思考のタイプを開発しますimage04

角度ソース

包括Vue3以后的开发模式必然会和TypeScript更加切合,大家也更多的需要使用TypeScript来编写代码;
包括目前已经变成最流行的编辑器VSCode也是使用TypeScript来完成的

ヘルプあなたは活字体()思考のタイプを開発しますimage05

包括在React中已经使用的ant-design的UI库,也大量使用TypeScript来编写:

ヘルプあなたは活字体()思考のタイプを開発しますimage06

ant-design源码
包括小程序开发,也是支持TypeScript的

ヘルプあなたは活字体()思考のタイプを開発しますimage07

小程序开发
2.3. 体验TypeScript
本来想在这个位置放上一个体验TypeScript的程序,但是涉及到过多TypeScript的安装流程和vscode的配置信息。
所以,我打算在下一篇中专门讲解这部分的内容,包括使用webpack搭建一个可以自动测试TypeScript代码的环境。
So,稍安勿躁,这一个章节我们就和TypeScript有一个简单的邂逅就好,后面再进行深入了解。
三. 前端学不动系列
3.1. 前端开发者的难
在之前的Flutter文章中,我说到一个话题,大前端是一群最能或者说最需要折腾的开发者:
客户端开发者:从Android到iOS,或者从iOS到Android,到RN,甚至现在越来越多的客户端开发者接触前端相关知识(Vue、React、Angular、小程序);
前端开发者:从jQuery到AngularJS,到三大框架并行:Vue、React、Angular,还有小程序,甚至现在也要接触客户端开发(比如RN、Flutter);
目前又面临着不仅仅学习ES的特性,还要学习TypeScript;
Vue3马上也会到来,又必须学习Vue3新特性;
大前端开发就是,不像服务器一样可能几年甚至几十年还是那一套的东西。前端新技术会层出不穷。
ヘルプあなたは活字体()思考のタイプを開発しますimage08
但是每一样技术的出现都会让惊喜,因为他必然是解决了之前技术的某一个痛点的,而TypeScript真是解决了JavaScript存在的很多设计缺陷,尤其是关于类型检测的。
そして、ビューの長期的な視点の開発者、私たちは思考の活字体のフロントエンドプログラマのトレーニングの種類を学ぶのを助ける、この考え方は完成し、大規模なプロジェクトのために特に重要です。
私は活字を学ぶために一緒に皆をもたらす、と私たちは思考の種類を形成することができる訓練に、一連の記事の活字体を更新します。
彼の心の中に疑いの3.2リフティング
私たちの開口部にバック疑問の一部が上昇:
最後に活字体とは?なぜ誰もが最終的には良かったか、どのように良い活字体について話していますか?角速度、Vue3連続使用の活字体は、我々は活字体を把握する必要がどういう意味を再構築され、なぜ彼らは、活字体を選ぶべきなのでしょうか?私は基礎の種類を学ぶか、活字体、それを学ぶ必要がありますか?
上記の私のシェアであり、いくつかのドライ共有計画は、すべて私はあなたに高度なDaguaiを取る懸念のためにプラットフォームアップデートに戻ってきます!

学校の友達を言うためにもっと何かを感じるようにしたい、より多くのスキルが攻略のアップグレードを取得したい、マイクロ文字を追加してください:19950277730、ここで私はあなたのために答える準備ができています。多くの無料動画や、iOSの、データ構造とアルゴリズムなどの学習教材は、スキルをプログラミングする、があります。
次の当初から、私たちが活字体が良い環境を構築して、今、正式な学習にそれを起動入れてみましょう!

おすすめ

転載: blog.51cto.com/13007966/2452433