値の場合、その値を暗黙的に真偽値へ変換してから、条件式として判定します。真偽値へ変換するとtrueとなる値の種類は多いため、逆に変換した結果がfalseとなる値を覚えるのが簡単です。次の値は真偽値へと変換するとfalseとなるため、これらはfalsyな値と呼ばれます(「暗黙的な型変換」の章を参照)。falsyfalseundefinednull00nNaN""(空文字列)オブジェクトオブジェクトオブジェクトはプロパティの集合プロパティとは名前(キー)と値(バリュー)が対になったものです。配列や関数などもオブジェクトの一種JavaScriptには、あらゆるオブジェクトの元となるObjectというビルトインオブジェクトが存在する。}のように省略して書けます。次のコードは、プロパティ名nameに変数nameを値にしたプロパティを設定しています。Object()を使う利点はありません。{}ポイント3プロパティへのアクセスドット記法(.)を使う方法とブラケット記法([])があります。assignment)が利用できる。"英語"ポイント5プロパティの存在を確認するJavaScriptでは存在しないプロパティへアクセスした場合に例外が発生しません。プロパティ名を間違えた場合に単にundefinedという値を返すため、間違いに気づきにくいという問題があります。undefinedin演算子in演算子は、指定したオブジェクト上に指定したプロパティがあるかを判定し真偽値を返します。console.log("`key`プロパティは存在する");}Object.hasOwnObject.hasOwn静的メソッドは、対象のオブジェクトが指定したプロパティを持っているかを判定できます。このObject.hasOwn静的メソッドの引数には、オブジェクトとオブジェクトが持っているかを確認したいプロパティ名を渡します。chaining演算子(?.)が導入されました。chaining演算子(?.)は、ドット記法(.)の代わりに?.をプロパティアクセスに使います。chaining演算子(?.)は左辺のオペランドがnullish(nullまたはundefined)の場合は、それ以上評価せずにundefinedを返します。一方で、プロパティが存在する場合は、そのプロパティの評価結果を返します。"未定義";console.log(`ウィジェットのタイトルは${title}です`);ポイント7オブジェクトはプロパティの集合です。そのオブジェクトのプロパティを列挙する方法として、次の3つの静的メソッドがあります。3]]オブジェクトをループしたいときなど、よく使います。オブジェクトのspread構文でのマージオブジェクトのspread構文は、Object.assignとは異なり必ず新しいオブジェクトを作成します。spread構文はオブジェクトリテラルの中でのみ記述でき、オブジェクトリテラルは新しいオブジェクトを作成するためです。spread構文でのマージで十分。プロトタイプオブジェクトプロトタイプオブジェクトObjectには、他のArray、String、Functionなどのオブジェクトとは異なる特徴があります。それは、他のオブジェクトはすべてObjectを継承しているという点です。正確には、ほとんどすべてのオブジェクトはObject.prototypeプロパティに定義されたprototypeオブジェクトを継承しています。prototypeオブジェクトとは、すべてのオブジェクトの作成時に自動的に追加される特殊なオブジェクトです。Objectのprototypeオブジェクトは、すべてのオブジェクトから利用できるメソッドなどを提供するベースオブジェクトとも言えます。Object.prototypeに定義されているtoStringメソッドなどは、インスタンス作成時に自動的に継承されるインスタンスからprototypeオブジェクト上に定義されたメソッドを参照できる仕組みをプロトタイプチェーンと呼ぶ。Object.hasOwn静的メソッドは、指定したオブジェクト自体が指定したプロパティを持っているかを判定します。in演算子はオブジェクト自身が持っていなければ、そのオブジェクトの継承元であるprototypeオブジェクトまで探索して持っているかを判定します。in演算子はインスタンスに実装されたメソッドなのか、プロトタイプオブジェクトに実装されたメソッドなのかを区別しません。trueObject.createメソッドはES5から導入、Object.createメソッドはObject.create(null)というイディオムで、一部ライブラリなどでMapオブジェクトの代わりとして利用されていました。ES2015からは本物のMapが利用できるため、Object.create(null)をMapの代わりに利用する必要はありません。Mapについては「Map/Set」の章で詳しく紹介します。Array.prototype.atES2022では、相対的なインデックスの値を指定して配列の要素へアクセスできるArray.prototype.atメソッドが追加されました。Arrayのatメソッドは、配列[インデックス]とよく似ていますが、引数には相対的なインデックスの値を引数として渡せます。.at(0)や.at(1)などのように0以上のインデックスを渡した場合は、配列[インデックス]と同じく指定した位置の要素へアクセスできます。一方で、.at(-1)のようにマイナスのインデックスを渡した場合は、末尾から数えた位置の要素へアクセスできます。undefinedの要素と未定義の要素の違いObject.hasOwn静的メソッドを使うことで、配列オブジェクトに対して指定したインデックスに要素自体が存在するかを判定できます。配列から指定範囲の要素を取り出す方法としてArrayのsliceメソッドが利用できます。sliceメソッドは、第一引数の開始位置から第二引数の終了位置(終了位置の要素は含まない)までの範囲を取り出した新しい配列を返します。第二引数は省略でき、省略した場合は配列の末尾の要素まで含んだ新しい配列を返します。[]sliceメソッドと引数の関係を図にすると次のようになります。配列をフラット化Arrayのflatメソッド[ES2019]を使うことで、多次元配列をフラットな配列に変換できます。引数を指定しなかった場合は1段階のみのフラット化ですが、引数に渡す数値でフラット化する深さを指定できます。配列をすべてフラット化する場合には、無限を意味するInfinityを値として渡すことで実現できます。"C"]ポイント7JavaScriptの配列には破壊的なメソッドと非破壊的メソッドが混在しています。変更後の配列ポイント8reduceメソッドに渡したコールバック関数は配列の要素数である3回呼び出され、それぞれ次のような結果になります。Array-likeオブジェクトか配列なのかを判別するにはArray.isArrayメソッドを利用できます。Array-likeオブジェクトは配列ではないので結果は常にfalseとなります。"c");Array.fromメソッド[ES2015]を使うことでArray-likeオブジェクトを配列に変換して扱うことができます。リテラルには"(ダブルクォート)、'(シングルクォート)、`(バッククォート)の3種類があります。`(バッククォート)が追加された。String.prototype.at配列と同じようにインデックスを渡してその位置の文字へアクセスできる。次のようにmain関数を呼び出していなくても構文エラー(SyntaxError)が発生します。main関数を呼び出すことで初めて構文エラー(SyntaxError)が発生します。数字が3つ連続しているかを検索し、該当した箇所のインデックスを返しています。3ポイント5マッチした文字列の取得matchメソッドは正規表現のgフラグなしのパターンで検索した場合、最初にマッチしたものが見つかった時点で検索が終了します。matchメソッドは正規表現のgフラグありのパターンで検索した場合、マッチしたすべての文字列を含んだ配列を返します。undefinedES2020では、正規表現のgフラグを使った繰り返しマッチする場合においても、それぞれマッチした文字列ごとの情報を得るためのStringのmatchAllが追加されています。matchAllメソッドは、マッチした結果をIteratorで返します。正規表現のgフラグを使った繰り返しマッチを行う場合には、matchメソッドではなくmatchAllメソッドを利用します。matchAllメソッドはgフラグなしの正規表現はサポートしていないため、gフラグなしの正規表現を渡した場合は例外が発生します。えお"StringのmatchAllメソッドは、ES2020で導入されたメソッドです。それまでは、RegExpのexecメソッドというStringのmatchメソッドによく似た挙動をするメソッドを利用して、StringのmatchAllメソッド相当の表現を実装していました。関数の呼び出しテクニックJavaScriptを勉強中、関数呼び出しのTipsをおそわったのでめもめも。ESLint標準のパーサーでは、まだ標準化されていないクラスフィールド構文は扱えないため、babel-eslintを追加すると解消できる。界隈って動きが早くってどんどん新しいものが出現します。ライブラリ「React」を紹介します。なんだ?」と思った人は、ちょっと古いJavaScript使いでしょう。MLP)最近のコメント表示できるコメントはありません。BLOG.ホーム検索トップサイドバータイトルとURLをコピーしました。