正解 B、D

JavaScriptのオブジェクトのプロパティにアクセスする方法は、ドット記法とブラケット記法の2つがあります。 ドット記法は、object.propertyNameのように、ドット（.）の後にプロパティ名を指定します。 ブラケット記法は、object["propertyName"]、またはobject['propertyName']のように、ブラケット（[]）の間にプロパティ名を指定します。

ドット記法では、プロパティ名に変数と同じ命名規則が適用され、数字始まりやハイフンを含むプロパティ名を用いることはできません。 ブラケット記法では、ドット記法と異なり、数字始まりやハイフンを含むプロパティ名として指定することができます。さらに、変数をプロパティ名として指定することもできます。

Aは、文法エラーとなります。ドット記法では、ハイフンを含むプロパティ名を用いることはできません。 Bは、値を取得できます。ブラケット記法は、ハイフンを含むプロパティ名を用いることができます。 Cは、undefinedとなります。ドット記法では、変数をプロパティ名として使用できません。propertyNameをプロパティ名に指定していることになり、このプロパティは存在しないため、undefinedとなります。 Dは、値を取得できます。ブラケット記法は、変数をプロパティ名として使用できます。propertyNameの値であるkey-sampleをプロパティ名として指定していることになります。

以上より、正解はB,Dとなります。

出題範囲の詳細

正解 D

typeof 演算子は、オペランドの型を示す文字列を返却する演算子です。 プリミティブ型には対応する型の名称を、オブジェクトにはオブジェクトを表す"object"を、それぞれ文字列で返却します。

正解は、Dの"objectobject"となります。"object"と"object"の2つの文字列を結合した結果となります。 [1, 2]は配列宣言であり、オブジェクトを生成します。typeofの結果は"object"となります。 nullは、「値が存在しない」という意味のプリミティブ型です。期待する返却値は"null"ですが、実際の返却値は"object"です。

typeof演算子にnullを与えたときに、"object"が返却されるのは、JavaScriptの歴史的な経緯によるもので、バグとして知られています。

typeof演算子で返却される値は、以下の通りです。

• "string":文字列の場合に返されます。
• "number":数値の場合に返されます。NaN (非数) や Infinity (無限大) も含まれます。
• "bigint":BigInt値の場合に返されます。
• "boolean":true または false のブール値の場合に返されます。
• "object":オブジェクト、配列、null の場合に返されます。
• "symbol":シンボル値の場合に返されます。
• "function":関数オブジェクトの場合に返されます。
• "undefined":未定義の変数または存在しないプロパティの場合に返されます。

出題範囲の詳細

正解 D

varによって変数宣言を行うと「変数の巻き上げ」が発生します。 変数の巻き上げとは、変数の宣言場所から最も近い関数スコープ、もしくはグローバルスコープの先頭が変数の宣言場所となるJavaScriptの仕様のことを言います。

本問では、変数の巻き上げにより、変数を宣言した場所であるブロックスコープから、最も近い関数スコープの先頭に変数の宣言場所が移動することになります。

                          ---
                          function fn() {
                            // 最も近い関数スコープの先頭に巻き上げられた宣言部分
                            var x;
                            {
                              // 代入部分はそのままの位置に残る
                              x = 'a';
                            }
                            console.log(x);
                          }
                            fn();
                          ---
                          

正解は、Dとなります。 変数xは、ブロックスコープ内部でvarによって変数宣言されています。 変数の巻き上げが発生し、fn()の関数スコープへ宣言場所が移動します。 xは、fn()の関数スコープ内では常にアクセス可能な変数となるため、xに代入された文字列'a'はブロックスコープを超えて有効な値となります。 したがって、console.log(x)は、文字列'a'を出力する結果となります。

なお、ES6で実装されたlet、constによる変数宣言は、ブロックスコープを持つため、変数の巻き上げは発生しません。 本文におけるxをlet、constで変数宣言し、console.log(x)すると関数スコープにはxは存在しないため、xの未定義エラーが発生します。

出題範囲の詳細

正解 B、D

変数名には命名規則があります。命名規則とは名前付けのルールになります。具体的には、以下の通りです。

1. 使用できる文字は、半角英数字、アンダーバー（_）、ドル記号（$）である。
2. ただし、数字は、先頭文字に設定することができない。
3. 上記2点を満たしていても、予約語にあたる文字列は使用することができない。

正解は、BとDとなります。

Aは、先頭文字が数字になり、命名規則に違反しています。 Bは、先頭文字がアンダーバー（_）であり、残りは半角英数字で構成されているため、命名規則に従っています。 Cは、先頭文字が半角英字、それ以降半角英数字ですが、defaultが予約語に該当している点で命名規則に違反しています。 Dは、先頭文字として利用可能な文字は、1文字で利用が可能です。ドル記号（$）のみの変数名は、命名規則に従っていることになります。

出題範囲の詳細

正解 A、B、C

プログラムを作成する際には、ソースコードとコメントを書くことができます。 ソースコードは、コンピュータによってプログラムとして評価され、何らかの処理を行う対象となります。 コメントは、プログラムとして評価されません。開発者の理解を助けるため、ソースコードの説明を書くために使われることがあります。

コメントは、スラッシュ（/）とアスタリスク（*）の二つの記号を組み合わせて、1行コメント（//）と複数行コメント（/* */）を書くことができます。

1. 1行コメントは、スラッシュを二つ（//）を使います。1行コメントを書いた場所から行末までがコメントとなり、改行するとコメントではなくなります。
2. 複数行コメントは、コメントの開始部分（/*）と終了部分（*/）で囲います。開始部分から終了部分までのすべてがコメントとなり、改行も含めてコメントにすることができます。

正解は、A、B、Cとなります。

1. Aは、1行コメントです。
2. Bも、1行コメントです。先頭のコメント以降がすべてコメントとなるため、2つ目の1行コメントはコメント開始ではなくコメント内の文字列となります。
3. Cは、複数行コメントです。コメントの開始部分と終了部分が同一行に記載されていても有効です。
4. Dは、文法エラーとなります。2つ目の開始部分「/*」はコメントではなくただの文字列となり、複数行コメントの開始「/*」が1つに対して、終了「*/」が2つとなり、終了部分が1つ対応する開始部分がないため文法エラーとなります。

出題範囲の詳細

正解 B

JavaScriptには、オブジェクトをテキストデータに変換するシリアライズという処理があります。 シリアライズは、JSON.stringifyメソッドによって実現します。 このメソッドは、オブジェクト、配列、数値、文字列、真偽値、nullをそれぞれテキストデータに変換します。

また、問題文の「復元可能なテキスト形式のデータ」とは、JSON.stringifyメソッドでシリアライズしたデータが処理前の元のオブジェクトに復元できることを意味します。 シリアライズしたデータを復元する処理のことをデシリアライズと呼びます。 デシリアライズは、JSON.parseメソッドによって実現します。 JSON.stringifyメソッドによってシリアライズしたテキストデータは、JSON.parseメソッドによってデシリアライズすることでオブジェクトに復元が可能ということになります。

正解は、Bになります。 本文の配列をJSON.stringifyメソッドに渡してシリアライズすると、["A","B",100,200,["C","D"]]という結果になります。 この結果をJSON.parseメソッドに渡してデシリアライズすると、元のオブジェクトと同じ内容で復元されます。

Aは、 "A,B,100,200,C,D"という一つの文字列に変換されます。カンマを区切り文字として配列に変換しても、配列の中の配列を復元できません。
CとDは、存在しないメソッドになります。

なお、JSON.stringify、JSON.parseは、実務上はいずれもJSON形式のデータを取り扱うためのメソッドです。 JSON(JavaScript Object Notation)とは、言語に依存しないテキストベースのデータ交換フォーマットになります。 下記のようなデータをJSON形式のデータと呼びます。

                          {
                            "名前": "山田太郎",
                            "年齢": 30,
                            "職業": "プログラマー",
                            "既婚": false,
                            "趣味": ["読書", "映画鑑賞", "旅行"],
                            "住所": {
                              "郵便番号": "123-4567",
                              "都道府県": "東京都",
                              "市区町村": "渋谷区",
                              "番地": "1-2-3"
                            },
                            "子供": null
                          }
                        

JSON.stringifyメソッドによってシリアライズされたテキストデータは、JSON形式のデータとなります。 JSON.parseメソッドは、JSON形式のデータをデシリアライズしてJavaScriptのオブジェクトを復元します。

JSONは、JavaScriptのオブジェクトを基にしたシンプルで扱いやすいデータ交換フォーマットとして設計されました。 JavaScriptと関係性の深いフォーマットですが、プログラムで取り扱う上で使い勝手が良いことから他の言語でも使用されています。

出題範囲の詳細

正解 B

JavaScriptのURLエンコードに関する問題です。 URLエンコードとは、特定の文字列をURLの一部として安全に使用できる形式に変換する処理のことを言います。 日本語もURLエンコードを行う必要があり、'あ'は、「%E3%81%82」に、空白(スペース)は「%20」に変換します。

JavaScriptでは、URLエンコードを担うメソッドとしてescape,encodeURI,encodeURIComponentが用意されています。 このうち、escapeは、現在は非推奨です。Unicode文字、ASCII文字のエンコード処理が不完全なうえに、Webブラウザ毎の仕様が異なるおそれがあります。 現在は、encodeURL、encodeURIComponentのいずれかを使用してURLエンコードを行います。 encodeURLは、URLのなかで意味のある記号（;,/?:@&=+$#など）はエンコードしません。 encodeURIComponentは、encodeURLがエンコードしない記号も含めた全ての記号をエンコードします。

正解は、Bとなります。 Aのescapeメソッドは、アットマーク(@)をエンコードしません。 BのencodeURIメソッドは、アットマーク（@）とドル記号（$）をエンコードしません。 CのencodeURIComponentメソッドは、全ての記号をエンコードします。 Dのhtmlspecialcharsメソッドは、JavaScriptのメソッドではありません。PHPの関数でありHTMLの特殊文字をエンコードします。

なお、実際に各メソッドを使用したコードと結果は、以下の通りです。

                        const url = "https://example.com/search?q=テスト&page=1";

                        console.log(escape(url));
                        // 結果: "https%3A//example.com/search%3Fq%3D%u30C6%u30B9%u30C8%26page%3D1"
                        
                        console.log(encodeURI(url));
                        // 結果: "https://example.com/search?q=%E3%83%86%E3%82%B9%E3%83%88&page=1"
                        
                        console.log(encodeURIComponent(url));
                        // 結果: "https%3A%2F%2Fexample.com%2Fsearch%3Fq%3D%E3%83%86%E3%82%B9%E3%83%88%26page%3D1"
                        

出題範囲の詳細

正解 B

eval関数に関する問題です。 eval関数は、与えられた文字列をJavaScriptとしてのコードと解釈し、実行します。 本問では、変数aに1を代入したあとに、console.logでaの値を出力するコードを文字列としてevalに渡しています。

eval関数は、関数の内外によって変数のスコープを分離せずに実行します。 そのため、evalの文字列で指定した変数aは、直上で宣言した変数aと同じスコープになります。

結果、evalの実行結果は、Bになります。

現在では、プログラム開発でevalの使用は避けるべきとされています。 eval関数は、ユーザが入力した文字列をJavaScriptとして実行するため、ページの書き換えやなりすまし、情報漏洩などにつながることがあります。

出題範囲の詳細

正解 A

if文での典型的なミスに関する出題です。 if文における比較演算子は、「==」または「===」を使用します。 本問では a = 1 と記述したため、比較ではなく代入を行っています。 代入と同時に、if(a)、すなわちif(1)という評価が行われることになります。 このときの評価は常にtrueとなるため、console.log('a = 1');が実行されます。

正解はAとなります。 このようなときにはDのエラーを期待したいところですが、比較演算子 == と、代入演算子 = の書き間違いは必ずしもエラーにはなりません。

if文は与えられた条件式の結果によって、プログラムの実行を分岐させる構文です。 if文の例は以下のようになります。

                            
                              if (条件式) {
                                条件式の結果がtrueの時に実行されるプログラム
                              } else {
                                条件式の結果がfalseの時に実行させるプログラム
                              }
                            
                          

なお、JavaScriptでは、比較演算子「===」を使用することが推奨されています。 「===」と「＝＝」は、型の比較を含めた比較を行うかどうかという点が異なります。 文字列'1'と数値1を比較したときに「==」はtrueになりますが、「===」はfalseになります。 「===」を使用する方がより安全な比較が可能になります。

出題範囲の詳細

正解 A

JavaScriptでは真偽値を扱う場合、通常はプリミティブ型を使用します。 もっとも、BooleanコンストラクタにnewキーワードをつけてBooleanオブジェクトを作成することもできます。 このBooleanオブジェクトは、Booleanコンストラクタの引数に応じてオブジェクト内部にプリミティブ型の真偽値を持つラッパーオブジェクトとなります。 プリミティブ型の真偽値は、真偽値であるtrue/falseそのものとして振る舞うため、条件式の評価はtrue/falseに対応して扱われます。 一方、Booleanオブジェクトは、Objectとして振る舞う以上は、Objectの存在そのものが条件式の評価になるため、常にtrueとなります。

正解は、Aとなります。 new Boolean(false)とした場合、Booleanオブジェクトは内部にプリミティブ型のfalseを持ちます。 ただし、条件式は、Booleanオブジェクトの内部の真偽値ではなく、オブジェクトの有無を評価するため、必ずtrueになります。

Booleanオブジェクトは、プリミティブ型にオブジェクトとしての特性（メソッドを追加するなど）を持たせるような場合に使うものになります。 また、BooleanオブジェクトのvalueOfメソッドを使ってプリミティブな真偽値を取り出し、条件式で扱うこと自体は可能です。 しかし、そもそもBooleanオブジェクトを使うこと自体が極めて例外的なケースであり、通常はプリミティブ型の真偽値を使うべきといえます。

なお、Booleanコンストラクタの引数にfalsyな値（0,-0,null,false,NaN,undefined,空文字列）を渡すか、Booleanコンストラクタの引数が省略された場合はfalse、それ以外はtrueが、Booleanオブジェクト内部の真偽値になります。

出題範囲の詳細

正解 C

JavaScriptには、Infinityという値があります。厳密には正負の無限大(Number.POSITIVE_InfinityとNumber.NEGATIVE_Infinity)があります。 JavaScriptで扱える数には最小範囲（Number.MIN_VALUE）と最大範囲(Number.MAX_VALUE)があり、その範囲を超えるとInfinityとなります。 また、計算結果などが数値として表わすことが出来ない場合は、NaN(Not a Number)となります。

これらの特殊数値の判別メソッドが、isFinite、Number.isFiniteです。 isFiniteは、JavaScriptで扱える数(Number.MIN_VALUE 〜 0 〜 Number.MAX_VALUE)であればtrueとなり、それ以外の値はfalseとなります。 なお、文字列は、JavaScriptで扱える数に変換できる場合にはtrueが返ります。 Number.isFiniteメソッドは、isFiniteよりも厳密な評価を行います。 文字列などの数値ではない値は常にfalseになります。

正解は、Cとなります。 Aは、JavaScriptで扱えない値であるInfinityを与えているためfalseになります。 Bは、JavaScriptが数値として扱えない値を表すNaNを与えているためfalseになります。 Cは、文字列"0"がJavaScriptで取り扱いが可能な数値0に変換可能なためtrueになります。 Dは、文字列"0"をNumber.isFiniteメソッドに与えており変換を許容しないためfalseになります。

出題範囲の詳細

正解 B

prototypeプロパティに関しての出題です。 JavaScriptでは、プログラムの動作に必要な変数とメソッドをひとつのオブジェクトという単位にまとめることができます。 複数のオブジェクトで共通する変数やメソッドをひとつのオブジェクトにまとめて、共通部品として使いまわすことができます。 この仕組みを継承と言います。

JavaScriptには、Objectという全てのオブジェクトが継承するオブジェクトが存在します。 ObjectはObject.prototypeプロパティーを持ち、新しくオブジェクトを作成するときにObjectを継承することでprototypeプロパティを持つようになります。 本問題では、new Array()を使用してArrayオブジェクトを作成するときに、ArrayオブジェクトがObjectを継承し、Array.prototypeプロパティを持つようになります。

作成済みのArrayオブジェクトは、prototypeプロパティを持ちますが、Object.prototypeプロパティとは別のものになります。 Object.prototype.msgプロパティを作成し、'hello'を代入したときにObject.prototype配下にmsgプロパティが作成されますが、Array.prototype配下にmsgプロパティは作成されません。 Array.prototype.msgに'good-bye'を代入したとき、はじめてArray.prototype配下にmsgプロパティが作成されます。

arrayはmsgプロパティを宣言する前のArrayオブジェクトを継承したオブジェクトのため、array自身にはmsgプロパティを持っていません。 array自身がmsgプロパティを持っていなくとも、プロトタイプチェーンという仕組みでmsgプロパティを呼び出すことができます。

JavaScriptは、呼び出したメソッドや変数が呼び出し元オブジェクトに存在しなくても、継承したオブジェクトのprototypeが持つ同名のメソッドや変数を利用することができます。 この仕組みをプロトタイプチェーンと呼びます。

arrayは、ArrayオブジェクトとObjectオブジェクトを継承しています。 array.msgを呼び出したとき、プロトタイプチェーンによって継承しているArrayオブジェクトのArray.prototype.msgを探しに行きます。 Array.prototype.msgには'good-bye'が格納されているため、'good-bye'が出力されます。 Array.prototype.msgが見つかった時点でプロトタイプチェーンは終了し、Object.prototype.msgが持つ'hello'が出力されることはありません。

なお、Array.prototype.msgプロパティが存在しないのであれば、Object.prototype.msgプロパティまでプロトタイプチェーンによる探索が進み、'hello'が出力されることになります。

出題範囲の詳細

正解 C

parseInt関数に関する問題です。
parseInt関数は、第1引数に渡した文字列を数値に変換します。2,8,10,16などの数字を指定すると2進数、8進数、10進数、16進数などに変換して数値を返却します。 第2引数を指定しない場合は、デフォルトの設定である10進数に変換します。

正解は、Cとなります。 Cは、第2引数に16を渡しているため、第1引数に渡した文字列を16進数に変換します。 16進数とは、「0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F」の16種類の数字とアルファベットで表記され、16になると桁上がりが発生し、1の位が0、10の位が1になります。 したがって、16進表記の10は10進表記で16となるため、Cの10は10進表記で10にならないものにあたります。

A,B,Dは、第2引数を指定していないため、デフォルトの設定である10進数に変換し、結果は10進数の10となります。 しかし、A,B,Dいずれも注意点があります。 Aの表記方法は、ECMAScript3では、文字列の先頭が0のとき8進表記とされていました。 ECMAScript5では、0で始まっても10進表記として扱うと定められました。 Bの表記方法は、parseIntの仕様により数値として読み取れる部分までを取り出して数値化するため、10+30は10として変換されます。 先頭に+記号がある場合は、数値の表記として正しいのでそのまま変換されます。 DはparseIntの一般的な使用方法と言えます。 ただし、過去のブラウザとの互換性や予期せぬ挙動を防ぐために、Cのように基数を明示することが推奨されています。

出題範囲の詳細

正解 A

in演算子に関する問題です。 in演算子は、オブジェクトのプロパティ名の存在を検証する演算子であり、「検証するプロパティ名 in 検証するオブジェクト」と記述します。 Arrayオブジェクトは、変数宣言時に配列要素に対して前から順番に0,1,2とプロパティを割り振って値を格納します。 本問の配列オブジェクトは、['Alice','Bob','Chris','Dan']であると同時に{0:'Alice',1:'Bob',2:'Chris',3:'Dan'}というプロパティを持つオブジェクトでもあります。 in演算子を配列オブジェクトに対して用いると、プロパティを持つオブジェクトと評価し、プロパティ名の存在を検証します。 本問では、arrayには「2」というプロパティが存在するため、結果はtrueになります。

なお、配列オブジェクトの値の存在を検証する場合には、includesメソッドを使用します。 array.includes('Chris')であればtrue、array.includes('Eve')であればfalseとなります。

ところで、for/in構文のinと、in演算子は、いずれも配列オブジェクトに対して使用する処理ですが、実態とは異なる処理になります。 for/inは、プロパティを使用した繰り返し処理です。 in演算子は、プロパティ名の存在を検証し、true/falseを返却する処理です。

出題範囲の詳細

正解 C

JavaScriptのURLエンコードに関する問題です。 URLエンコードとは、特定の文字列をURLの一部として安全に使用できる形式に変換する処理のことを言います。 日本語もURLエンコードを行う必要があり、'あ'は、「%E3%81%82」に、空白(スペース)は「%20」に変換します。

JavaScriptでは、URLエンコードを担うメソッドとしてwindow.escape,window.encodeURI,window.encodeURIComponentが用意されています。 このうち、window.escapeは、現在は非推奨です。Unicode文字、ASCII文字のエンコード処理が不完全なうえに、Webブラウザ毎の仕様が異なるおそれがあります。 現在は、window.encodeURI、window.encodeURIComponentのいずれかを使用してURLエンコードを行います。 window.encodeURIは、URLのなかで意味のある記号（;,/?:@&=+$#など）はエンコードしません。 window.encodeURIComponentは、window.encodeURIがエンコードしない記号も含めた全ての記号をエンコードします。

正解は、Cとなります。 Aのwindow.escapeメソッドは、スラッシュ(/)をエンコードしません。 Bのwindow.encodeURIメソッドは、コロン（:）とスラッシュ（/）をエンコードしません。 Cのwindow.encodeURIComponentメソッドは、全ての記号をエンコードします。 Dのwindow.htmlentitiesメソッドは、存在しないメソッドです。

なお、実際に各メソッドを使用したコードと結果は、以下の通りです。

                            
                              const url = "https://example.com/sample test.html";

                              console.log(window.escape(url));
                              // 結果: "https%3A//example.com/sample%20test.html"

                              console.log(window.encodeURI(url));
                              // 結果: "https://example.com/sample%20test.html"

                              console.log(window.encodeURIComponent(url));
                              // 結果: "https%3A%2F%2Fexample.com%2Fsample%20test.html"
                            
                          

windowオブジェクトのメソッドとして呼び出しても、単独で使用しても同じ結果になります。 ブラウザ環境では、windowオブジェクトは、JavaScriptのグローバルオブジェクトになります。 escape、encodeURI、encodeURIComponentは、いずれもwindowオブジェクトのメソッドであり、グローバルスコープでの呼び出しが可能です。 グローバルオブジェクトであるwindowオブジェクトを指定しても、省略しても、いずれもグローバルスコープで定義されたメソッドを呼び出しているため、同じ結果になります。

出題範囲の詳細

正解 D

JavaScriptの論理和(OR、||)についての問題です。 論理和は、A || B のように記述し、AがtrueであればBの評価を省略しAの値を返し、AがfalseであればBの値を返します。 本問では、array['key']を評価し、trueであればarray['key']で取得できる値を変数elmに格納し、falseであれば'empty'を変数elmに格納します。 変数arrayは、空の配列オブジェクトであり、存在しないプロパティ名の'key'を指定したときJavaScriptではundefinedとなります。 そして、undefinedは、論理値としてはfalseと見なされます。 したがって、array['key']は、falseとなり、'empty'が式の結果となり、変数elmに代入されます。

論理和（||）のことを論理演算子と呼び、他に論理積（&&）があります。 論理積は、A && B のように記述し、AがfalseであればBの評価を省略しAの値を返し、AがtrueであればBの値を返します。

論理演算子が左側の値を評価した結果によって右側の値の評価を省略しうる性質を短絡評価と言います。 論理和（OR）は、A OR BのようにAとBのどちらかがtrueである場合にtrueとなります。 論理積（AND）は、A AND BのようにAとBの両方がtrueである場合にtrueとなります。 すなわち、論理積においては、Aがfalseであればその時点でfalseと評価でき、論理和においては、Aがtrueであればその時点でtrueと評価できます。

この短絡評価の発想を流用し、Aのみで評価が完結するときにはAを返し、Bの評価が必要な場合はBを返すといった処理を実現しています。 論理和（||）は、AがtrueであればAを返し、AがfalseであればBを返す、という処理として実装されました。 論理積（&&）は、AがfalseであればAを返し、AがtrueであればBを返す、という処理として実装されました

出題範囲の詳細

正解 E

JavaScriptの例外処理についての問題です。 例外処理とは、プログラム実行中のエラーによって処理を止めずに、エラーに応じた処理を行うための機能です。エラーは、例外という呼び方もします。 JavaScriptでは、try, catch, finallyによって記述します。 tryは、通常実行されるコードブロックのうち、例外処理を発生させたいコードを記載する領域です。try内では例外が起きると処理を中断し、catchのコードブロックに移動します。 catchは、例外が発生したときに実行されるコードブロックです。try内で例外が発生したときのログを受け取る変数を指定することができます。変数名には「e」がよく使われます。 finallyは、例外の有無を問わず実行されるコードブロックです。

                            
                              try {
                                // エラー時に例外処理を行う処理;
                              }catch( e ){ // 変数eには発生した例外が代入される
                                // エラーが発生した場合の処理;
                              }finally{
                                // エラーの有無に係わらず実行される処理;
                              }
                            
                          

なお、throwとは、明示的に例外を発生させる命令です。throwで指定した文字列やオブジェクトは、catchの変数に代入されます。

本問では、try内で'A'を表示したあとに、throwで例外を発生させます。try内で例外が発生するとcatch内に移動し、throwで指定した文字列'B'を変数eに代入します。 その後、例外発生の有無を問わずfinallyの処理が実行されるため、'D'が表示されます。 出力結果は'A B D'となるので、正解はEとなります。

例外を適切にコントロールしないと例外によるスクリプトの中断によってHTML,CSS,JavaScriptなどが適切に処理されず表示崩れやエラーが発生します。 適切に例外処理を行い、常にあるべき表示や処理がなされるように設計を行うことが重要です。

出題範囲の詳細

正解 A

繰り返し処理のfor文のうち、for-inに関する出題です。 JavaScriptのfor-inは、オブジェクトのプロパティを対象に繰り返し処理を行ないます。 文法は以下の通りです。

                            
                              for(let 処理ごとにプロパティを受け取る変数 in 繰り返し処理対象のオブジェクト){
                                // プロパティへのアクセスは オブジェクト[変数] の形でおこないます。
                              }
                            
                          

本問の正解は、Aになります。 Aは、上記の文法にそったものになります。なお、変数名は任意のものでもよくindex以外ではkey、スコープが適切に限定できているならばi,j,kなどを使用してもよいです。 Bは、文法エラーになります。 Cは、文法としては正しく動作します。ただし、for-inは、プロパティを変数に受け取るため、「value」という名前付けは混乱の元になるので、もっとも適切とは言えません。 Dは、繰り返し処理自体は動作します。しかし、indexにletがなくグローバルスコープで変数が定義されるため、forループの外でも参照できてしまいます。このような挙動は、予期せぬ不具合につながるため、適切ではありません。

出題範囲の詳細

正解 B

繰り返し処理のdo whileと、繰り返し処理へのcontinue処理,break処理に関する出題です。 do whileは、do配下の処理を1度実行した後に、whileの条件を評価し、trueであれば処理を繰り返し、falseであれば繰り返しを終了しループを抜けます。 do whileの文法は以下の通りです。

                            
                              do {
                                // 処理内容
                              } while ( 条件式 );
                            
                          

breakとcontinueは、繰り返し処理の制御命令になります。いずれも実行中の繰り返し処理を中断し終了させる点では共通しています。 breakは、繰り返し処理そのものを終了させます。一方、continueは、繰り返しを維持したままで次の繰り返し処理に移ります。

本問では、配列と配列インデックス用の変数iを宣言し、do-while内の処理を繰り返し回数を数えるカウンタ変数iは初期値0です。

本問では、出力結果は「C」となり、正解はBとなります。 do-whileの冒頭で配列インデックス用のカウンタ変数iを0→1とインクリメントしています。 配列オブジェクトは、0から始まるインデックスとそれに対応する値を持ち、{0:A,1:B,2:C,3:D,4:E}とみなします。 冒頭のインクリメントしたカウンタ変数iを使って配列から値を取り出すとき「B」が参照されることになります。 1つ目のif文では「B」がtrueとなり、continue命令で実行中の処理が終了し、次の繰り返しが始まります。 インクリメントによってカウンタ変数iが1→2となり、「C」が参照されます。 1つ目、2つ目のif文は、いずれもfalseとなるため、console.log(array[i])が実行され「C」が表示されます。 do-while構文の処理が最後まで進むとwhileの条件式が評価されることになり、条件式は「C」 != 「E」でtrueなので繰り返し処理が継続されます。 続く繰り返し処理で、カウンタ変数iが2→3とインクリメントされ、「D」が参照されます。 2つ目のif文のbreak命令が実行され、処理を中断し、さらに繰り返し処理そのものが終了します。

なお、類似の繰り返し構文にwhileがあります。 whileは実行前に条件を評価し、do whileは最低1度処理を実行してから条件を評価する点が異なります。 whileもdo-whileも繰り返しの終了条件を適切に設定しないと無限ループが発生してしまうので、そこは注意が必要です。

出題範囲の詳細

正解 A

switch文に関する出題です。
switch文は、if文のような条件分岐を行なうための構文です。 switch文にパラメータを設定し、case句でパラメータの内容に応じた処理を記述します。 case句に一致するパラメータがない場合の処理は、default句に記述します。 文法は以下の通りです。

                          
                            switch(パラメータ) {
                              case ラベル1:
                                // パラメータとラベル1が同じときに実行される処理
                                break;
                              case ラベル2:
                                // パラメータとラベル2が同じときに実行される処理
                                break;
                              default:
                                // パラメータと一致する条件が存在しない場合の処理
                                break;
                            }
                          
                        

switch文では、break命令が実行されるまで、実行対象のcase句より下部に記載されたcase句とdefault句をすべて実行します。 この挙動をフォールスルーと呼びます。 本問では、switch文の評価対象であるstrが'A'なので、case 'A'の処理を実行します。 case 'A'にはbreak命令がないため、case 'B'のbreak命令まで続けて処理を実行することになります。 case 'A'とcase 'B'が実行されるため、出力結果は12となります。

フォールスルーは、caseごとの処理を共通化する意図で利用することがあります。 例えば、以下のようなケースです。ラベル1、2、3とラベル4、5を同じ処理にしたいので、フォールスルーを利用しています。

                            switch(パラメータ) {
                              case ラベル1:
                              case ラベル2:
                              case ラベル3:
                                // パラメータがラベル1,2,3と同じときに実行される処理
                                break;
                              case ラベル4:
                              case ラベル5:
                                // パラメータがラベル4,5と同じときに実行される処理
                                break;
                              case ラベル6:
                                // パラメータがラベル6と同じときに実行される処理
                                break;
                              default:
                                // パラメータと一致する条件が存在しない場合の処理
                                break;
                            }
                          

このように具体的に共通化したいという意図がない限りは、必ずbreak命令を記述することが望ましいでしょう。

出題範囲の詳細

正解 A

プリミティブ型とオブジェクト型に関する出題です。 JavaScriptでは、プリミティブ型とオブジェクト型の2種類のデータ型が存在します。 プリミティブ型は、Boolean,Null,Undefined,Number,String,Symbolの6種類です。 オブジェクト型は、プリミティブ型以外のデータです。Array,Date,RegExp,Function,Objectなど、これらはオブジェクト型です。

プリミティブ型が用意されているデータ型は、プリミティブ型で取り扱うことが原則です。 ただし、仕様上はオブジェクト型として宣言することも可能で、new String('123')というように、new演算子を使うと、オブジェクト型となります。 本問では、'123'はプリミティブ型の宣言でありデータ型はstringとなり、new String('123')のデータ型はobjectとなります。 したがって、正解はAとなります。

オブジェクト型で文字列を宣言するnew String()ですが、newを外したString()でも同じようにオブジェクト型となります。 ただし、String()は、引数に渡した値を文字列型に変換するメソッドです。new String()は、オブジェクトを生成するコンストラクタなので別物です。 そして、String()は、nullやundefinedを渡した場合に'null'や'undefined'という文字列を返し、エラーになりません。 予期せぬ不具合を防ぐためにも文字列型への変換はtoString()メソッドを使うようにしましょう。

出題範囲の詳細

正解 B

thisに関する出題です。 thisは関数の呼び出し方によって参照するオブジェクトが代わります。 Aは、オブジェクト内でメソッドとして定義し、objのメソッドとして呼び出されています。このときのthisはobj自身を差し、objのオブジェクトを表示します。 Bは、オブジェクト内のメソッドですが、アロー関数によって定義しています。アロー関数は、関数が定義されたスコープをthisに保持し、ここではグローバルスコープであるwindowオブジェクトを表示します。 Cは、グローバルスコープで関数として定義されています。グローバルスコープではthisはグローバルオブジェクトを参照するため、windowオブジェクトを表示します。 Dは、グローバルスコープでアロー関数として定義されています。アロー関数は、関数が定義されたスコープをthisに保持するのでグローバルスコープであるwindowオブジェクトを表示します。 したがって、正解はAになります。

なお、Cの呼び出し方のときに、厳格モード（use strict）を適用しているとthisはundefinedになります。 thisを使うときには、呼び出し方による挙動の変化に注意する必要があります。

出題範囲の詳細

正解 A

JavaScriptの関数の返り値に関する出題です。 JavaScriptでは、関数内で明示的にreturn文によって返り値を設定しない限り、undefinedを返します。 関数に引数を設定して適切に値を渡したとしても、return文がなければundefinedとなります。 本問では、return文が書かれていないので、変数aはundefinedとなります。 したがって、正解はAとなります。

関数fに引数を渡し、なんらかの処理を加えた結果を受け取りたいという場合には、例えば下記のように変更を加えます。

                            function f(x){
                                return x + 10;
                            }
                            let a = f(20);
                            
                            

引数に対して10を足した結果がreturn文によって返却されることになり、変数aは20+10で30となります。

出題範囲の詳細

正解 A

暗黙的な型変換と明示的な型変換に関する出題です。 暗黙的な型変換は、JavaScriptが自動的に型を変換することで発生する型変換です。 明示的な型変換は、JavaScriptのコード上に型変換を記述することで発生する型変換です。 本問では、暗黙的な型変換によって、quantityの値が数値型の5.5に変換され、priceと掛け算され57.75となります。 明示的な型変換は、Number、parseInt、parseFloatを使い、文字列型のquantityを数値型に変換することで実現します。

正解は、Aとなります。 AのparseInt関数は、文字列型"5.5"を整数の5に変換し、5*10.5で52.5となります。 BのNumber関数は、文字列型"5.5"を数値型の5.5に変換し、5.5*10.5で57.75となります。 CのNumber関数は、文字列型"5.5"を数値型の5.5に変換し、5.5*10.5で57.75となります。 DのparseFloat関数は、文字列型"5.5"を浮動小数点数の5.5に変換し、5.5*10.5で57.75となります。 Aのみ52.5であり、B,C,Dは設問の57.75と一致します。

なお、JavaScriptでは整数(5)も浮動小数点数(5.0)もいずれもnumber型になります。

出題範囲の詳細

正解 B,D

多次元配列に関する問題です。
JavaScriptでは、配列の要素に配列が含まれているものを多次元配列と呼びます。
配列の中に配列があるものを2次元配列、配列の中の配列に、さらに配列が要素として含まれるものを3次元配列と言い、入れ子になっている階層をnとしたときにn+1次元配列となります。
選択肢Aはarrayに代入された配列は1次元配列のため、[0][0]という形で要素にアクセスできません。
選択肢Bは、最初に作成された配列は1次元ですが、その後で要素に配列を代入しているため2次元配列になっています。
選択肢Cは、配列を作成する書式として、[][]は認められません。
選択肢Dは、配列の要素として配列を作成し、その要素に'a'を格納していますので、2次元配列になっています。
実際にスクリプトを実行すると、選択肢A,Cはエラーになります。

出題範囲の詳細

正解 B

配列操作とlengthプロパティに関する問題です。
定義済み配列の範囲を超えたインデックスを指定して要素を追加すると、そのインデックスの位置までundefinedで埋めながら要素が追加されます。
本問では、最初の二行で配列の要素は['a','b',undefined,undefined,'c']となります。

配列のlengthプロパティは、配列の要素数を返します。配列のlengthプロパティに数値を代入すると配列の要素数の変更が可能です。 配列の要素数より大きい数字を代入するとその長さまでundefinedで埋められます。 配列の要素数より小さい数字を代入するとその長さまで配列の要素数を切り詰めます。 仮にarray.length = 7とすると、['a','b',undefined,undefined,'c',undefined,undefined]となります。 本問の通り、array.length = 3とすると、['a','b',undefined]となり、正解はBとなります。 なお、array.length = 0とすると空配列[]になります。

出題範囲の詳細

正解 D

JavaScriptの配列の宣言方法についての出題です。 JavaScriptの配列の宣言方法は2つあり、コンストラクタ関数Array()によるものと、配列リテラル[]によるものです。

Array()は、引数が1つの場合、渡した数値分の長さで要素がundefinedの配列を生成し、引数が2つ以上のときはその数値を要素とする配列を生成します。 Array(3)は、配列の長さが3でそれぞれの要素がundefinedの配列を生成し、Array(1,2,3)は、[1,2,3]の配列を生成します。newキーワードがあっても同じ挙動になります。 配列リテラルは、引数に関わらず渡した数値がただちに配列の要素となるため、3を渡すと[3]の配列を生成します。

本問では、Dが正解となります。 引数が1つなので、数値の3を要素として持つ配列はArray()では作れません。

JavaScriptで配列を生成する際には一般的には配列リテラル[]が推奨されています。 配列の要素を事前に確保する意味ではArray()は有用ではあるものの、JavaScriptでは配列の長さは動的に変更可能なため、事前に確保する場面は非常に少ないと言えるでしょう。

出題範囲の詳細

正解 A B C

strictモードについての出題です。

strictモードとは、JavaScriptのスクリプトに厳格なルールを適用する設定になります。 暗黙的なエラーや潜在的なバグを回避し安全性の高いJavaScriptのコードを実現するためにECMAScript5で導入されました。

本問は、A B Cが正解です。 Aは、正しい選択肢です。コードの曖昧さの低減、潜在バグの回避、予期せぬ不具合の防止などを目的にしています。 Bは、正しい選択肢です。ただし、かつてstrictモードの導入時に複雑な処理や非効率な処理が抑制され、速度が改善されたのであり、現在は処理速度の改善はあまり期待できないでしょう。 Cは、正しい選択肢です。strictモードを有効にする"use strict"は、宣言したスコープの範囲で有効になります。関数スコープに限定して有効化にし、関数スコープ外では有効にしないという設定も可能です。 Dは、誤りです。サポートしていないブラウザでは、"use strict"はただの文字列として無視され、JavaScript自体は正常に動作します。

strictモードの設定方法は下記の通りです。

                              // スクリプト全体でstrictモードを有効にする場合
                              "use strict";
                              let x, y, z;

                              // 関数内でstrictモードを有効にする場合
                              const x = function(){
                                "use strict";
                                let y, z;
                              }; 
                              
                            

strictモードを設定した場合に、発生する挙動の変更を一部記載します。

• 変数宣言の演算子（var, let, const）を使わない場合にグローバル変数の宣言を抑制するためエラーとなる。
• オブジェクトのプロパティ名にダブルクォーテーションで囲われていない識別子を使うとエラーになる。
• 関数の引数に重複した名前を使うとエラーとなる。
• with文、evalのスコープの変更、argumentsオブジェクトの挙動変更
• 一部予約語（implements, interface, let, public, static, yieldなど）の使用を制限

出題範囲の詳細

答え B

JavaScriptのクラスベースの継承に関する出題です。 本問の正解は、Bになります。 Aは、クラスベースの継承ではなく、プロトタイプベースの継承の説明です。 Cは、メソッドのオーバーライドの説明ですが、エラーは起きず子クラスのメソッドとして定義可能です。 Dは、継承したメソッドへのアクセスについての説明ですが、継承を使う理由のひとつが継承したクラスのメソッドが利用可能であることです。

以下、クラスベースの承継に関する解説になります。 JavaScriptでは、Class構文を用いることでオブジェクトを生成することができます。 クラスを宣言したものをnewキーワードによってオブジェクトを作ります。 クラスはオブジェクトで共通するプロパティやメソッドを設定できます。 また、コンストラクタ（constructor）にクラス変数を設定してオブジェクトごとに固有なパラメータを持たせることも可能です。 コンストラクタとは、クラスからオブジェクトを生成するときの初期設定を行うメソッドです。 Class構文は、下記のように記述します。

                            class Parent {
                              constructor(name) {
                                this.name = name;
                              }
                              sayHello() {
                                console.log(`my name is ${this.name}`);
                              }
                            }
                            const parent = new Parent("太郎");
                            parent.sayHello(); // "my name is 太郎"
                          

クラスを超えて共通化したいプロパティやメソッドがある場合、継承という仕組みで別のクラスのプロパティやメソッドを取り込みます。 クラスベースの継承は、クラスの宣言時にextendsキーワードで共有したいクラスを指定します。 Parentクラスを共有継承したChildクラスを作成する場合は、下記のように記述します。

                            class Child extends Parent {
                              constructor(name, age) {
                                super(name); // 親クラスのコンストラクタの呼び出し
                                this.age = age;
                              }
                              sayAge() {
                                console.log(`I am ${this.age} years old.`);
                              }
                            }
                            const child = new Child("太郎", 10);
                            child.sayHello(); // "my name is 太郎"
                            child.sayAge(); // "I am 10 years old."
                          

Childクラスは、sayHello()メソッドをParentクラスから継承しています。 ParentクラスのsayHello()メソッドは、親クラスのnameプロパティを要求しています。 ChildクラスからParentクラスの初期設定をするには、Childクラスのconstructor()にsuper()を記述します。 super()は、親クラスのコンストラクタを呼び出すためのキーワードです。 super()を使用することで、親クラスのコンストラクタを呼び出し、親クラスのプロパティを初期化することができます。 上記の例では、new Child("太郎", 10)からChildクラスのconstructorへ”太郎”が渡され、さらにsuper(name)によって、親クラスのコンストラクタに渡されsayHello()で参照可能になります。 sayAge()は、Childクラスのメソッドであり、new Child("太郎", 10)から渡された10がsayAge()のための変数として利用可能になります。

さらに、親クラスを継承した子クラスでは、メソッドのオーバーライドによって、親クラスのメソッドを上書き定義することができます。 メソッドのオーバーライドとは、子クラスで継承した親クラスと同名のメソッドを宣言することで子クラス固有のメソッドとして定義しなおすことです。 親クラスがさまざまなクラスに継承されていく中で子クラス側で固有のメソッドを定義する必要が出てきたさいにオーバーライドを利用します。 オーバーライドは、下記のように記述します。

                            
                              // メソッドのオーバーライド
                              class Parent2 {
                                sayHello() {
                                  console.log("親クラスの挨拶");
                                }
                              }
                              class Child2 extends Parent2 {
                                sayHello() {
                                  console.log("子クラスの挨拶"); // メソッドのオーバーライド
                                }
                              }
                              const child2 = new Child2();
                              child2.sayHello(); // "子クラスの挨拶"
                            
                          

出題範囲の詳細

答え A

void演算子についての出題です。

JavaScriptにはvoid演算子があります。 void演算子は、式の評価結果を問わず、プリミティブ型のundefinedを返却する演算子です。 onclickでJavaScriptを動作させるときに、href属性に"javascript:void(0)"を設定して、ブラウザによる再描画を防ぐ手法が有名です。

出題範囲の詳細

答え A B D

NaN（Not-a-Number）についての出題です。
NaNは、数値として表現できない、または未定義な計算結果を示すために使われる、特殊な数値型 (number) の値です。 データ型はあくまで数値型(number）なのですが、以下のような数値で表現できない値を包括的に表現したものになります。

• ゼロ（0）とゼロ（0）の割り算
• 無限（Infinity）と無限（Infinity）の引き算
• 負の数の平方根（Math.sqrt(-1)）
• 負の数の対数（Math.log(-1)）
• 数字として解釈できない文字列を数値型に変換（parseInt()、Number())
• 10+NaNなどのNaNを含む計算

表記上は、同じNaNでも表現しえない実態が異なるため、NaN===NaN、NaN==NaNいずれもfalseで評価される仕様となっています。 なんらかの処理結果がNaNとなるかを評価するには、Number.isNaN()によって判定します。

本問の正解は、A B Dです。 Aは、正しい選択肢です。NaNは、数値として表現できない、または未定義な計算結果を示すために使われる特殊な数値型 (number) の値です。 Bは、正しい選択肢です。いずれも結果がNaNになる処理です。
Cは、誤りです。NaNをNaN自身と比較しても常にfalseとなるので、Number.isNaN()を使います。
Dは、正しい選択肢です。typeof NaNの結果はnumberになります。なお、InfinityもNumber型です。

出題範囲の詳細