はじめに 今回は型指定で度々登場する合併型(union型)と交差型(intersection型)について取り上げます。この2つは高校数学で習うベン図を使うことで、違いが分かります。2つの型が存在したとして、その2つの合わせた部分を型の集合とした合併型、2つの共通部…

はじめに 今回はオブジェクトの一つである配列についてです。javascript同様、TypescriptのArray型も要素の連結、追加、検索のような操作をサポートしています。 Array型の定義 ①型指定 let chara: string[] = ["naruto", "sasuke", "sakura"]; console.log(…

はじめに 今回は、javascriptでも馴染み深いObjectについてです。TypescriptはObjectがどのようのkeyを持っているべきか、それらの値の型はなにかなどきめ細かくObjectの型を定義することができます。では以下コードで確認しましょう。Object型の定義 ①型指…

はじめに Typescriptは型チェックをサポートするjavascriptの上位互換です。ブラウザで実行する前に、なにか問題があればコード上でエラーを投げかけてくれます。またTypescriptはブラウザで直接実行できません。javascriptにコンパイルすることによって、Ty…

はじめに ES6の記事のネタが尽きたため、Typescriptの記事をしばらく書いていきます。Typescript第一弾は環境構築です。あくまで自分への備忘録とこの記事を残しますが、この記事を読んでくださった方のためになれば幸いです。 ⚠エディタはvscodeです。他の…

はじめに Symbolという言葉の定義から確認しましょう。 Symbol・・・プロパティの重複を避けるために、必ず一意の値を返す関数 Symbol の使い方、注意点 ①Symbolの定義方法 const s = Symbol() console.log(s); //Symbol() ②言葉の定義の意味 const s = Symb…

はじめに データを管理するための入れ物としての役割を持つMap,Setについて、Map,Setの使い方やObjectやArrayとの違いを紹介していきます。 Map,Setの使い方 1.new演算子でMap,Set(入れ物)を生成 //Map const map = new Map(); //Set const s = new Set(); 2…

はじめに 非同期APIの一つであるPromiseの説明の前に、同期処理と非同期処理について確認しましょう。コードが上から下へと読み取られる同期処理に対し、非同期処理とは上から下へと順に読み取られない(上からのコードの完了実行を待たない)ことを指します。…

はじめに 近年ではjavascriptのコードは肥大化して行っています。（javascriptでできることが増えたという嬉しさ）そのためモジュールという仕組みを用いて、コードを整理、分割することは現代のjavascriptでは必須です。 module・・・ソースコードを機能毎…

はじめに javascriptにおける繰り返し構文は数多くあります。その中から用途を使い分けることが大切であると僕は考えます。今回扱う繰り返し構文の一つであるfor...ofは、イテレーターを持つオブジェクトの反復操作を行います。イテレーターは簡単にStringや…

はじめに スプレッド構文（...）とは反復可能や列挙可能オブジェクトの展開を行うことです。主なユースケースは配列を展開する際です。 let a = [...array]; //展開された配列を新しい配列として、変数などに代入する。 以下コードで確認しましょう。 const …

はじめに バッククオート（shift+@）で文字列を囲むと、${}の波括弧内に変数展開ができます。従来の文字列での構文より簡潔かつ明確に記述できます。 //旧 const name = "Itathi"; console.log('My name is ' + name); //My name is Itathi //新 const name …

はじめに 分割代入とは、オブジェクトから特定のプロパティーを抽出して宣言を行うことです。 let { a, b } = object; //objectに含まれるプロパティaとbが変数a、bの初期値として代入されることになります。 オブジェクトと変数は切り離された関係になる。 …

はじめに デフォルト引数、名前の通り引数(実パラメータ)に値を入れなくてもパラメータ(仮パラメータ)にデフォルト（初期値）として設定されている引数のことです。コンストラクター関数からクラスで書くほうが直感的でわかりやすかったのと同様に、デフォル…

はじめに ES6のクラスが導入されるまではコンストラクター関数によってプロパティを設定し、prototypeによって関数を作った後newインスタンスによってオブジェクトを生成していた。それをより直感的にしたのがクラスです。 //コンストラクター関数 function …

はじめに 関数の記法の一つとして導入されたアロー関数。従来のfunctionを用いた関数（以下無名関数とします。）と比べると簡潔な記述で関数を定義できる省略記法となっています。 //従来のfunction const fn = function(name) { return 'hello' + name; }; …

はじめに ES6を自分の備忘録としてまとめていきます。まずはletやconstについて。 変数である。 プログラミングを学び始めると、変数や関数やはたまたクラスとして名前を付ける機会が多くあります。その際、変数を宣言できるのがletやconstです。（ES6 以前…