16:32:36Jestで始めるJavaScriptのテスト概要Jestを使ってJavaScriptのテストをかいてみる。準備jestとESModulesを使いたいのでbabel-preset-2015をインストールしておく。(babel-jestはjestに用意されている。.babelrcの中身はこんな感じ。package.jsonはこんな感じ。Blogで掲載されている記事を転載したものです。2015から追加されたオブジェクトで、オブジェクトが持つ機能をラップすることにより、オブジェクトの機能をカスタマイズすることができます。Proxyの関連用語Proxyを知る上で必要な用語です。handler・・・トラップを入れるためのオブジェクトで、プレースホルダ的な扱いをされます。trap・・・Proxyがプロパティへのアクセスを実装するためのメソッド。target・・・プロキシするオブジェクト。Blogで掲載されている記事を転載したものです。Functionオブジェクトを返す関数です。asyncとawaitというキーワードを使って、Promiseよりも簡潔に非同期処理を書くことができます。ES2017で仕様が定義されています。使い方使い方はカンタンです。async関数を関数定義の時に頭につけるだけです。Promise以外の値を返すように定義した場合は、その値で解決された形でPromiseが返されます。Blogで掲載されている記事を転載したものです。Blogで掲載されている記事を転載したものです。準備ビルド環境のセットアップが面倒なので、今回はFacebook公式のcreate-react-appというツールを使います。md-editorというアプリ名で環境を用意することにします。次に、今回使うライブラリのインストールをしておきます。Blogで掲載されている記事を転載したものです。分割代入とは分割代入とは、配列またはオブジェクトのデータをそれぞれ別個の変数に代入する式のことです。文章ではイメージがつきにくいかと思います。それぞれの例を見て確認してみましょう。Blogで掲載されている記事を転載したものです。exportとはexportは、指定のファイルから関数、変数、オブジェクト、クラス(クラスはプロトタイプベース継承の糖衣構文であり、関数の一種。モダンなJSの話──クラス)などを受け取り、任意のファイルでそれらを使えるようにするための文です。exportには主に2種類の使い方があります。exportsexportしたい要素の名前を付けてexportする方法です。Blogで掲載されている記事を転載したものです。ECMAScript6からのクラス定義ECMAScript6以前ではnew演算子やprototypeプロパティを使ってクラスに近い機能を実現していましたが、ECMAScript6からはclassキーワードでクラスを定義できるようになりました。<br>classキーワードはこれまでのnew演算子やprototypeプロパティによるクラス定義のシンタックスシュガーです。classキーワードを使ったクラス定義の方法には、クラス宣言とクラス式の2種類があります。Blogで掲載されている記事を転載したものです。スコープとは本題に入る前に、スコープの定義について確認しておきましょう。スコープとは、変数名や関数名が参照可能な範囲のことです。スコープの種類は色々ありますが、ここでは主に3つのスコープについて表で説明します。どこからでもアクセスできる。ローカルスコープ内からでしかアクセスできない。Blogで掲載されている記事を転載したものです。アロー(=>)を使ってかく関数式で、"thisの値を語彙的に束縛することができる"という点が大きなポイントです。