HTML5プロフェッショナル認定試験 レベル2 全分野の一問一答
📖 HTML5プロフェッショナル認定試験 レベル2「全分野」の全375問と解説(一覧)
HTML5プロフェッショナル認定試験 レベル2の全分野に関する一問一答(全375問)の正解と解説の一覧です。上の一問一答で実際に解いてから、ここで復習・確認できます。
-
問1.addEventListener()の第3引数にtrueを指定すると、イベントはキャプチャフェーズでハンドラが実行される。
正解:○(正しい)
解説:第3引数(useCapture)がtrueでキャプチャフェーズ、省略またはfalseでバブリングフェーズに登録される。
-
問2.イベントの伝播は、キャプチャフェーズ→ターゲットフェーズ→バブリングフェーズの順に行われる。
正解:○(正しい)
解説:DOMイベントは祖先から対象へ降りるキャプチャ、ターゲット、対象から祖先へ昇るバブリングの3フェーズで伝播する。
-
問3.event.stopPropagation()を呼ぶと、同じ要素に登録された他のリスナーも即座に実行されなくなる。
正解:×(誤り)
解説:誤り。正しくは、stopPropagation()は伝播を止めるだけで同一要素の他リスナーは実行される。同一要素も止めるのはstopImmediatePropagation()。
-
問4.event.preventDefault()は、イベントに関連付けられたブラウザの既定動作(フォーム送信やリンク遷移など)をキャンセルする。
正解:○(正しい)
解説:preventDefault()は既定動作を抑止するが、イベントの伝播自体は止めない。
-
問5.querySelectorAll()が返すNodeListは、DOMの変更が即時に反映される動的(live)なコレクションである。
正解:×(誤り)
解説:誤り。正しくは、querySelectorAll()が返すNodeListは静的(static)で、取得後のDOM変更は反映されない。
-
問6.getElementsByClassName()が返すHTMLCollectionは、取得後のDOM変更が反映されない静的なコレクションである。
正解:×(誤り)
解説:誤り。正しくは、getElementsByClassNameが返すHTMLCollectionはlive(動的)で、DOMの変更がリアルタイムに反映される。
-
問7.removeEventListener()でリスナーを削除するには、addEventListener()に渡したものと同一の関数参照を指定する必要がある。
正解:○(正しい)
解説:無名関数で登録すると参照が異なり削除できないため、削除予定のリスナーは名前付き関数で登録する。
-
問8.DOMContentLoadedイベントは、画像やスタイルシートなどすべての外部リソースの読み込み完了後に発火する。
正解:×(誤り)
解説:誤り。正しくは、DOMContentLoadedはHTMLの解析とDOM構築完了で発火する。全リソース完了で発火するのはloadイベント。
-
問9.addEventListenerの第3引数にオプション{once:true}を指定すると、リスナーは一度だけ実行され自動的に削除される。
正解:○(正しい)
解説:onceオプションがtrueのリスナーは最初の呼び出し後に自動で除去される。
-
問10.addEventListenerの{passive:true}オプションを指定したリスナー内でpreventDefault()を呼ぶと、既定動作が確実にキャンセルされる。
正解:×(誤り)
解説:誤り。正しくは、passive:trueはpreventDefault()を呼ばない宣言で、呼んでも無効(警告が出る)。スクロール性能向上が目的。
-
問11.createTextNode()はテキストノードを生成するが、生成しただけではDOMツリーには挿入されない。
正解:○(正しい)
解説:createTextNode/createElementは生成するのみで、appendChildやinsertBefore等で明示的に挿入する必要がある。
-
問12.textContentに文字列を代入すると、その文字列はHTMLとして解釈され子要素が構築される。
正解:×(誤り)
解説:誤り。正しくは、textContentは代入文字列をHTMLとして解釈せず、すべて文字として扱う。HTMLを解釈するのはinnerHTML。
-
問13.innerHTMLに文字列を代入すると、その文字列はHTMLとして解釈され子要素が構築される。
正解:○(正しい)
解説:innerHTMLは代入文字列をHTMLパースして子ノードを再構築する。信頼できない入力ではXSSに注意が必要。
-
問14.classList.toggle('active')は、active クラスの有無にかかわらず常にクラスを追加する。
正解:×(誤り)
解説:誤り。正しくは、toggleはクラスが存在すれば削除し、存在しなければ追加する切り替え動作を行う。
-
問15.setTimeout()のコールバックは、指定ミリ秒が経過すると現在実行中のコードの途中でも割り込んで即座に実行される。
正解:×(誤り)
解説:誤り。正しくは、JavaScriptはシングルスレッドで、コールバックは現在の実行完了後コールスタックが空になってから実行される。
-
問16.location.assign(url)とlocation.replace(url)はどちらも遷移するが、replace()は履歴に残さず戻るボタンで前のページに戻れない。
正解:○(正しい)
解説:assign()は履歴に追加、replace()は現在の履歴エントリを置換するため戻れない。
-
問17.history.pushState()でURLを変更すると、ページ全体の再読み込みが発生する。
正解:×(誤り)
解説:誤り。正しくは、pushStateは再読み込みなしで履歴エントリとURLを追加する。これによりSPA等でURLを更新できる。
-
問18.popstateイベントは、ユーザーが戻る/進むボタンを操作して履歴エントリが変化したときに発火する。
正解:○(正しい)
解説:popstateはアクティブな履歴エントリが変化(back/forward等)したとき発火する。pushState/replaceState自体では発火しない。
-
問19.history.go(-2)は履歴を2つ前のページに移動する。
正解:○(正しい)
解説:go(n)は相対移動でnが負なら戻る、正なら進む。go(-2)は2つ前へ移動する。
-
問20.dispatchEvent()はイベントの既定動作を抑止するためのメソッドである。
正解:×(誤り)
解説:誤り。正しくは、dispatchEvent()はスクリプトからイベントを発火させるメソッド。既定動作抑止はpreventDefault()。
-
問21.イベント委任(delegation)は、共通の親要素に1つリスナーを付けてイベントのバブリングを利用する手法である。
正解:○(正しい)
解説:親要素でバブリングを捕捉しevent.targetで発生元を判別する。動的に追加される子にも対応でき効率的。
-
問22.changeイベントは、テキスト入力欄でキーを押すたびにリアルタイムで発火する。
正解:×(誤り)
解説:誤り。正しくは、changeは値が確定(フォーカスを外す等)したときに発火する。一文字ごとに発火するのはinput。
-
問23.submitイベントはform要素で発生し、preventDefault()でフォーム送信を中止できる。
正解:○(正しい)
解説:submitイベントはフォーム送信時に発火し、preventDefault()で既定の送信処理を抑止できる。
-
問24.node.children は要素ノードのみを返すが、node.childNodes はテキストノードやコメントノードも含めて返す。
正解:○(正しい)
解説:childrenは要素ノード(HTMLCollection)のみ、childNodesは全ノード種別(NodeList)を含む。
-
問25.element.firstChild は最初の子要素ノードを必ず返す。
正解:×(誤り)
解説:誤り。正しくは、firstChildは最初の子ノードでありテキストノードや空白を返すことがある。最初の子要素はfirstElementChild。
-
問26.data-user-id 属性は、JavaScriptから element.dataset.userId としてアクセスできる。
正解:○(正しい)
解説:data-*属性はdatasetでアクセスし、ハイフン区切りはキャメルケース(user-id→userId)に変換される。
-
問27.window.alert()は実行されると、ユーザーがダイアログを閉じるまでスクリプトの実行をブロックする。
正解:○(正しい)
解説:alert/confirm/promptは同期的にユーザー応答を待ち、その間スクリプト実行を停止する。
-
問28.confirm()はユーザーがOKを押すとfalse、キャンセルを押すとtrueを返す。
正解:×(誤り)
解説:誤り。正しくは、confirm()はOKでtrue、キャンセル/閉じるでfalseを返す。
-
問29.setInterval()で開始した繰り返し処理を停止するには、clearTimeout()を使う。
正解:×(誤り)
解説:誤り。正しくは、setIntervalの停止はclearInterval()を使う。clearTimeoutはsetTimeout用。
-
問30.insertBefore(newNode, referenceNode)は、referenceNodeの直前にnewNodeを挿入する。
正解:○(正しい)
解説:insertBeforeは参照ノードの前に新ノードを挿入する。参照ノードにnullを渡すと末尾に追加される。
-
問31.location.search には、URLのパス部分(ドメイン以降のディレクトリパス)が含まれる。
正解:×(誤り)
解説:誤り。正しくは、location.searchは「?」以降のクエリ文字列。パス部分はlocation.pathname。
-
問32.keydownイベントはキーを押した瞬間に、keyupイベントはキーを離した瞬間に発火する。
正解:○(正しい)
解説:keydownは押下時、keyupは離す時に発火する。修飾キー等も検出できる。
-
問33.window.postMessage()は、同一オリジンのウィンドウ間でしかデータをやり取りできない。
正解:×(誤り)
解説:誤り。正しくは、postMessageはクロスオリジン(異なるオリジン)のウィンドウ/iframe間でも通信できる。
-
問34.getAttribute()は属性が存在しない場合に空文字列('')を返す。
正解:×(誤り)
解説:誤り。正しくは、getAttribute()は存在しない属性に対してnullを返す。
-
問35.appendChild()で、すでにDOM内に存在するノードを別の親に追加すると、元の位置からは削除され移動する。
正解:○(正しい)
解説:既存ノードをappendChildすると複製ではなく移動になり、元の場所から取り除かれる。
-
問36.history.replaceState()は新しい履歴エントリを追加せず、現在のエントリを置き換える。
正解:○(正しい)
解説:replaceStateは履歴を増やさず現在のURL/状態を上書きする。pushStateは新規エントリを追加する。
-
問37.innerTextはCSSの表示状態を無視し、display:noneで非表示の要素のテキストも取得する。
正解:×(誤り)
解説:誤り。正しくは、innerTextはレンダリング結果に基づき非表示テキストを除外する。表示状態を無視するのはtextContent。
-
問38.DOMのノードタイプで、要素ノードのnodeTypeは1、テキストノードのnodeTypeは3である。
正解:○(正しい)
解説:nodeTypeは要素ノードが1、テキストノードが3、コメントが8、Documentが9である。
-
問39.prompt()はユーザーがキャンセルした場合、空文字列('')を返す。
正解:×(誤り)
解説:誤り。正しくは、prompt()はキャンセル時にnullを返す。入力せずOKしたときは空文字列を返す。
-
問40.mouseoverイベントはバブリングしないが、mouseenterイベントはバブリングする。
正解:×(誤り)
解説:誤り。正しくは、mouseoverはバブリングし、mouseenterはバブリングしない。
-
問41.次のコードの実行後、コンソールに出力される順序として正しいものはどれか。 console.log('A'); setTimeout(()=>console.log('B'),0); console.log('C');
- ア.A → C → B
- イ.A → B → C
- ウ.B → A → C
- エ.C → A → B
正解:ア.A → C → B
解説:同期処理A,Cが先に実行され、setTimeoutのコールバックBはスタックが空になってから実行される。
-
問42.addEventListener()の第2引数に渡すものとして正しいのはどれか。
- ア.イベント発生時に実行する関数(リスナー)
- イ.イベントの種類を表す文字列
- ウ.キャプチャ/バブリングの真偽値
- エ.対象要素のセレクタ文字列
正解:ア.イベント発生時に実行する関数(リスナー)
解説:第2引数はイベント発生時に呼ばれるコールバック関数(リスナー)である。
-
問43.location.pathname の値はどれか。location.href='https://example.com/page?q=1#sec' のとき。
- ア.'/page'
- イ.'/page?q=1'
- ウ.'example.com/page'
- エ.'?q=1'
正解:ア.'/page'
解説:pathnameはドメイン以降のパス部分を返すため'/page'となる。
-
問44.親div→子buttonの構造で親divにclickリスナーを付け、子buttonをクリックすると親のリスナーが動く理由はどれか。
- ア.イベントのバブリングによる
- イ.イベントのキャプチャによる
- ウ.preventDefaultの影響
- エ.イベント委任が無効だから
正解:ア.イベントのバブリングによる
解説:子のクリックイベントがバブリングフェーズで親へ伝播し、親のリスナーが実行される。
-
問45.parent.insertBefore(newNode, null) を実行した場合の挙動はどれか。
- ア.親の子の末尾に挿入される
- イ.エラーになる
- ウ.親の子の先頭に挿入される
- エ.何も起きない
正解:ア.親の子の末尾に挿入される
解説:参照ノードがnullの場合、newNodeは親の子の末尾に挿入される(appendChild相当)。
-
問46.document.getElementById('x') が一致する要素を見つけられなかった場合の戻り値はどれか。
- ア.null
- イ.undefined
- ウ.空のNodeList
- エ.空文字列
正解:ア.null
解説:getElementByIdは未一致時にnullを返す。
-
問47.btnにキャプチャ(true)で'cap'、バブリング(false)で'bub'リスナーを順に登録しbtn自身をクリックした出力順はどれか。
- ア.cap → bub
- イ.bub → cap
- ウ.capのみ
- エ.bubのみ
正解:ア.cap → bub
解説:ターゲット要素自身では登録順に実行される。capが先に登録されているのでcap→bubとなる。
-
問48.parent の全子ノードを取り除く一般的な方法として正しいものはどれか。
- ア.parent.innerHTML = ''
- イ.parent.clear()
- ウ.parent.empty()
- エ.parent.children = []
正解:ア.parent.innerHTML = ''
解説:parent.innerHTML='' で子ノードをまとめて除去できる。clear/emptyメソッドはDOMに存在しない。
-
問49.要素のclass属性に含まれる特定のクラスの有無を真偽値で調べるメソッドはどれか。
- ア.classList.has()
- イ.classList.contains()
- ウ.classList.includes()
- エ.classList.exists()
正解:イ.classList.contains()
解説:classList.contains('x')はクラスxが存在すればtrueを返す。
-
問50.screen.width / screen.height が示すものとして正しいのはどれか。
- ア.ブラウザ表示領域(viewport)のサイズ
- イ.ユーザーの画面(モニタ)のサイズ
- ウ.ドキュメント全体のサイズ
- エ.ウィンドウの内寸
正解:イ.ユーザーの画面(モニタ)のサイズ
解説:screenオブジェクトはユーザーの画面(モニタ)の幅・高さを示す。
-
問51.popstateイベントが発火するのは次のうちどの場合か。
- ア.pushState()を呼んだとき
- イ.ユーザーが戻る/進むボタンを押したとき
- ウ.replaceState()を呼んだとき
- エ.ページを初回ロードしたとき
正解:イ.ユーザーが戻る/進むボタンを押したとき
解説:popstateはback/forward等でアクティブな履歴エントリが変化したときに発火する。pushState自体では発火しない。
-
問52.event.preventDefault() が効果を持つ典型的な場面はどれか。
- ア.親要素への伝播を止めたいとき
- イ.aタグのclickでページ遷移を止めたいとき
- ウ.同一要素の他リスナーを止めたいとき
- エ.イベントを再発火したいとき
正解:イ.aタグのclickでページ遷移を止めたいとき
解説:リンクのclickやフォームのsubmitなど既定動作のあるイベントで、その動作を抑止する。
-
問53.addEventListenerのoptionsで指定でき、スクロール性能向上のためpreventDefaultを呼ばないことを宣言するものはどれか。
- ア.capture
- イ.passive
- ウ.once
- エ.signal
正解:イ.passive
解説:passive:trueはpreventDefaultを呼ばない約束で、ブラウザがスクロールを先行処理でき性能が向上する。
-
問54.querySelectorAll('.item') と getElementsByClassName('item') の違いとして正しいものはどれか。
- ア.前者は動的、後者は静的
- イ.前者は静的NodeList、後者は動的HTMLCollection
- ウ.どちらも動的
- エ.どちらも静的
正解:イ.前者は静的NodeList、後者は動的HTMLCollection
解説:querySelectorAllは静的NodeList、getElementsByClassNameは動的HTMLCollectionを返す。
-
問55.ドラッグ&ドロップでdropイベントを発火させるために必要な処理はどれか。
- ア.dragstartでstopPropagation()
- イ.dragoverでpreventDefault()
- ウ.dropでpreventDefault()
- エ.dragendでreturn false
正解:イ.dragoverでpreventDefault()
解説:dragoverでpreventDefault()しないとドロップが許可されずdropイベントは発火しない。
-
問56.ul に既存のli が3個ある状態で新しく作ったli を ul.appendChild した後の子li の数はどれか。
- ア.3
- イ.4
- ウ.1
- エ.0
正解:イ.4
解説:既存3個に新規1個を末尾追加するので合計4個になる。
-
問57.window.scrollTo(0, 0) の動作として正しいものはどれか。
- ア.ページを1画面分下にスクロール
- イ.ページ最上部へスクロール
- ウ.スクロール位置を取得
- エ.スクロールを禁止する
正解:イ.ページ最上部へスクロール
解説:scrollTo(x,y)はドキュメントを指定座標へスクロールする。(0,0)はページ最上部。
-
問58.querySelectorAll('div')で取得したNodeListをループ処理中にdiv要素を追加した場合の挙動として正しいものはどれか。
- ア.追加された要素もループで処理される
- イ.ループ中にエラーが発生する
- ウ.追加された要素は処理されない
- エ.NodeListが自動的に再評価される
正解:ウ.追加された要素は処理されない
解説:querySelectorAllのNodeListは静的なので、取得後に追加した要素はループ対象に含まれない。
-
問59.同一要素の同じイベントに複数のリスナーが登録されているとき、現在のリスナー以降の実行も止めるメソッドはどれか。
- ア.stopPropagation()
- イ.preventDefault()
- ウ.stopImmediatePropagation()
- エ.cancelBubble()
正解:ウ.stopImmediatePropagation()
解説:stopImmediatePropagation()は伝播に加え、同一要素の後続リスナーの実行も止める。
-
問60.次のうち、HTMLの解析完了(DOM構築完了)時点で発火し、画像等の読み込みを待たないイベントはどれか。
- ア.load
- イ.beforeunload
- ウ.DOMContentLoaded
- エ.readystatechange
正解:ウ.DOMContentLoaded
解説:DOMContentLoadedはDOM構築完了で発火し、画像等の外部リソースを待たない。
-
問61.location.search の値はどれか。location.href='https://example.com/page?q=1#sec' のとき。
- ア.'#sec'
- イ.'/page'
- ウ.'?q=1'
- エ.'q=1#sec'
正解:ウ.'?q=1'
解説:searchは「?」以降のクエリ文字列を返すため'?q=1'となる。
-
問62.data-price='100' 属性を持つ要素 el から値を取得する方法として正しいものはどれか。
- ア.el.data.price
- イ.el.getData('price')
- ウ.el.dataset.price
- エ.el.attr.price
正解:ウ.el.dataset.price
解説:data-*属性はel.dataset.priceでアクセスし、文字列'100'が得られる。
-
問63.setInterval(fn, 1000) の戻り値の用途として正しいものはどれか。
- ア.実行回数のカウント
- イ.コールバックの戻り値
- ウ.clearIntervalで停止するためのタイマーID
- エ.経過ミリ秒
正解:ウ.clearIntervalで停止するためのタイマーID
解説:setIntervalはタイマーIDを返し、clearInterval(id)で停止に使う。
-
問64.box.innerHTML = '<b>Hi</b>' の後に box.textContent を参照したときの値はどれか。
- ア.'<b>Hi</b>'
- イ.''
- ウ.'Hi'
- エ.'<b>Hi</b>'
正解:ウ.'Hi'
解説:innerHTMLで<b>Hi</b>が解釈され、textContentはタグを除いたテキスト'Hi'を返す。
-
問65.box.textContent = '<b>Hi</b>' を実行した場合、画面にはどう表示されるか。
- ア.太字のHi
- イ.Hi(タグは消える)
- ウ.<b>Hi</b> という文字列
- エ.何も表示されない
正解:ウ.<b>Hi</b> という文字列
解説:textContentはHTMLとして解釈せず、'<b>Hi</b>'がそのまま文字として表示される。
-
問66.element.style から取得できるスタイルとして正しいものはどれか。
- ア.外部CSSで指定された全スタイル
- イ.ブラウザのデフォルトスタイル
- ウ.インラインstyle属性で設定された値
- エ.計算済みの最終スタイル
正解:ウ.インラインstyle属性で設定された値
解説:element.styleはインラインstyle属性のみを反映する。計算後の値はgetComputedStyle()を使う。
-
問67.document.createElement('p')の実行直後の状態として正しいものはどれか。
- ア.p要素が生成されbody末尾に挿入される
- イ.文字列'<p></p>'が返される
- ウ.既存のp要素への参照が返される
- エ.p要素が生成されるがDOMツリーには未挿入
正解:エ.p要素が生成されるがDOMツリーには未挿入
解説:createElementはp要素ノードを生成するが、DOMツリーには未挿入で別途追加が必要。
-
問68.history APIで、ページを再読み込みせずに新しい履歴エントリとURLを追加するメソッドはどれか。
- ア.history.go()
- イ.history.forward()
- ウ.location.assign()
- エ.history.pushState()
正解:エ.history.pushState()
解説:pushState(state,title,url)は再読み込みせず履歴とURLを追加する。
-
問69.次のうち、テキスト入力欄で一文字入力するたびにリアルタイムで発火するイベントはどれか。
- ア.change
- イ.focus
- ウ.blur
- エ.input
正解:エ.input
解説:inputイベントは値が変わるたびに即時発火する。changeは確定時のみ。
-
問70.次のうち、バブリングしない(bubblesしない)イベントはどれか。
- ア.click
- イ.mouseover
- ウ.input
- エ.mouseenter
正解:エ.mouseenter
解説:mouseenter/mouseleaveはバブリングしない。mouseover/click/inputはバブリングする。
-
問71.イベント委任を使う主な利点として最も適切なものはどれか。
- ア.キャプチャフェーズを強制できる
- イ.preventDefaultが不要になる
- ウ.イベントの発火が高速化する
- エ.動的に追加される子にも対応でき、リスナー数を減らせる
正解:エ.動的に追加される子にも対応でき、リスナー数を減らせる
解説:親に1つのリスナーを置けば、動的に追加された子要素にも対応でき効率的。
-
問72.window.location.replace('/login') を呼んだ後の挙動として正しいものはどれか。
- ア.新しいタブで開く
- イ.履歴に追加され戻れる
- ウ.ページが再読み込みされるだけ
- エ.履歴を置換し戻るボタンで前ページに戻れない
正解:エ.履歴を置換し戻るボタンで前ページに戻れない
解説:replace()は現在の履歴を置換するため、遷移先で戻るボタンを押しても元のページに戻れない。
-
問73.let n=0; const id=setInterval(()=>{n++; if(n===3) clearInterval(id);},10); 十分時間経過後の n はどれか。
- ア.2
- イ.4
- ウ.無限に増える
- エ.3
正解:エ.3
解説:n===3でclearIntervalするため、nが3に達した時点で停止し最終値は3。
-
問74.次のうち、ページ離脱直前に確認等を行うために使われるイベントはどれか。
- ア.unloaded
- イ.exit
- ウ.pagestop
- エ.beforeunload
正解:エ.beforeunload
解説:beforeunloadはページ離脱前に発火し、確認ダイアログ表示などに使う。
-
問75.btn.addEventListener('click',f,{once:true}); を登録しbtnを2回クリックしたとき f が実行される回数はどれか。
- ア.0回
- イ.2回
- ウ.無限
- エ.1回
正解:エ.1回
解説:once:trueのリスナーは最初の呼び出し後に削除されるため、2回クリックしても1回だけ実行される。
-
問76.Geolocation APIで現在位置を一度だけ取得するには navigator.geolocation.getCurrentPosition() を使用する。
正解:○(正しい)
解説:getCurrentPosition()は現在位置を1回だけ取得する。継続的な監視にはwatchPosition()を使う。
-
問77.watchPosition()は位置が変化するたびにコールバックを呼び出し、戻り値としてwatch IDを返す。
正解:○(正しい)
解説:watchPosition()は監視を開始し識別子(watch ID)を返す。これをclearWatch()に渡して監視を停止する。
-
問78.getCurrentPosition()の成功コールバックには Position オブジェクトが渡され、position.coords.latitude で緯度を取得できる。
正解:○(正しい)
解説:成功時はPositionが渡され、coords.latitude(緯度)coords.longitude(経度)coords.accuracy(精度)を参照できる。
-
問79.Geolocationのエラーコールバックでユーザーがアクセスをきょひした場合のコードは PERMISSION_DENIED である。
正解:○(正しい)
解説:エラー時はPositionErrorが渡され、code=1がPERMISSION_DENIED、2がPOSITION_UNAVAILABLE、3がTIMEOUT。
-
問80.getCurrentPosition()の第3引数のオプションで enableHighAccuracy:true を指定すると、より高精度な位置取得を要求できる。
正解:○(正しい)
解説:オプションには enableHighAccuracy、timeout、maximumAge があり、enableHighAccuracy:true で高精度取得を要求する。
-
問81.coords.accuracy は位置情報の精度をメートル単位で表す。
正解:○(正しい)
解説:accuracyは緯度経度の精度を表す値で単位はメートルである。値が小さいほど高精度。
-
問82.DeviceOrientationEvent の alpha はデバイスのZ軸回りの回転(コンパス方位に相当)を0〜360度で表す。
正解:○(正しい)
解説:alphaはZ軸回り(0〜360度)、betaはX軸回り(前後の傾き)、gammaはY軸回り(左右の傾き)を表す。
-
問83.DeviceMotionEvent はデバイスの加速度(acceleration)や回転速度(rotationRate)を取得できる。
正解:○(正しい)
解説:DeviceMotionEventはacceleration、accelerationIncludingGravity、rotationRate、intervalを提供する。
-
問84.タッチ操作の開始を検知するタッチイベントは touchstart である。
正解:○(正しい)
解説:touchstartは指が画面に触れた時、touchmoveは移動中、touchendは離れた時に発火する。
-
問85.TouchEvent の touches プロパティは、現在画面に触れている全てのタッチ点のリストを表す。
正解:○(正しい)
解説:touchesは画面に触れている全タッチ点、targetTouchesは同一要素上のタッチ点、changedTouchesは変化したタッチ点を表す。
-
問86.Pointer Events はマウス・タッチ・ペンなど複数の入力デバイスを統一的に扱うためのイベントモデルである。
正解:○(正しい)
解説:Pointer Eventsはマウス/タッチ/ペンを抽象化し、pointerdown/pointermove/pointerupで統一的に扱える。
-
問87.Battery Status API でデバイスのバッテリー残量(level)や充電中か(charging)を取得できる。
正解:○(正しい)
解説:Battery Status APIはnavigator.getBattery()でBatteryManagerを取得し、level、charging等を参照できる。
-
問88.Notification API でデスクトップ通知を表示するには、事前にユーザーの許可を得る必要がある。
正解:○(正しい)
解説:通知表示にはユーザー許可が必要で、requestPermission()でgranted/denied/defaultの状態を要求する。
-
問89.requestAnimationFrame() はブラウザの再描画タイミングに合わせてコールバックを実行するため、setTimeoutより滑らかなアニメーションに適する。
正解:○(正しい)
解説:requestAnimationFrameは画面のリフレッシュに同期して呼ばれ、効率的で滑らかなアニメーションを実現する。
-
問90.requestAnimationFrame()で予約したコールバックの実行を取り消すには cancelAnimationFrame(id) を使う。
正解:○(正しい)
解説:requestAnimationFrameは要求IDを返し、cancelAnimationFrame(id)でそのコールバックを取り消せる。
-
問91.performance.now() はページ読み込み開始時点を基準とした高精度(小数ミリ秒)な時刻を返す。
正解:○(正しい)
解説:performance.now()はナビゲーション開始からの経過時間を高精度(小数ミリ秒)で返し計測に適する。
-
問92.Navigation Timing API は、DNS解決・接続・応答などページ読み込みの各段階の時刻を提供する。
正解:○(正しい)
解説:performance.timing(後継PerformanceNavigationTiming)はnavigationStart、domLoading、loadEventEnd等を提供する。
-
問93.User Timing API の performance.mark() は任意のタイミングに名前付きの計測ポイントを記録する。
正解:○(正しい)
解説:mark()で計測ポイントを記録し、measure()で2点間(mark間)の経過時間を計測できる。
-
問94.Resource Timing API は、画像やスクリプトなど個々のリソースの読み込みにかかった時間を取得できる。
正解:○(正しい)
解説:Resource Timing APIはgetEntriesByType('resource')で各リソースのfetchStart〜responseEnd等の詳細を取得する。
-
問95.Web Worker を生成するには new Worker('worker.js') のようにスクリプトのURLを指定する。
正解:○(正しい)
解説:new Worker(URL)でワーカーを生成する。指定したスクリプトが別スレッドで実行される。
-
問96.Geolocation APIで位置情報を取得する際、ユーザーの明示的な許可は不要で、スクリプトから無条件に取得できる。
正解:×(誤り)
解説:誤り。正しくは、Geolocation APIは機微情報を扱うためユーザーの明示的な許可(パーミッション)が必須である。
-
問97.watchPosition()で開始した位置監視を停止するには clearPosition() を呼び出す。
正解:×(誤り)
解説:誤り。正しくは、監視停止には clearWatch(id) を使う。clearPositionというメソッドは存在しない。
-
問98.DeviceOrientationEvent の beta はデバイスのY軸回りの回転を表す。
正解:×(誤り)
解説:誤り。正しくは、betaはX軸回りの回転(前後の傾き、-180〜180度)を表す。Y軸回りはgamma。
-
問99.TouchEvent の changedTouches は、現在画面に触れている全てのタッチ点を表す。
正解:×(誤り)
解説:誤り。正しくは、changedTouchesはそのイベントで状態が変化したタッチ点のリストを表す。全タッチ点はtouches。
-
問100.Vibration API の navigator.vibrate(200) はデバイスを200秒間振動させる。
正解:×(誤り)
解説:誤り。正しくは、vibrate()の引数はミリ秒単位なので200ミリ秒の振動である。配列でパターン指定も可能。
-
問101.performance.now() が返す値は、Date.now() と同じくUNIXエポックからの経過ミリ秒である。
正解:×(誤り)
解説:誤り。正しくは、performance.now()はナビゲーション開始を基準とした相対時間で、単調増加で巻き戻らない高精度値である。
-
問102.Web Worker は別スレッドで動作し、DOMに直接アクセスすることができる。
正解:×(誤り)
解説:誤り。正しくは、Web Workerは別スレッド動作のためDOM(window/document)に直接アクセスできない。重い処理の分離が目的。
-
問103.Web Worker からメインスレッドへ送られるデータは参照渡しであり、同じオブジェクトを共有する。
正解:×(誤り)
解説:誤り。正しくは、postMessageで渡すデータは構造化複製でコピーされる(Transferable除く)。参照共有しない。
-
問104.Service Worker は一度登録すると、イベントの有無に関わらず常にバックグラウンドで動き続ける。
正解:×(誤り)
解説:誤り。正しくは、Service Workerはイベント駆動でイベントがないとブラウザにより停止され、必要時に再起動される。
-
問105.Application Cache(AppCache)は現在も推奨される最新のオフライン技術である。
正解:×(誤り)
解説:誤り。正しくは、Application Cacheは非推奨・廃止されており、後継としてService Worker+Cache APIが推奨される。
-
問106.http://example.com と https://example.com は、ホスト名が同じなので同一オリジンである。
正解:×(誤り)
解説:誤り。正しくは、スキームがhttpとhttpsで異なるため別オリジンである。
-
問107.Cookie の Secure 属性を付けると、HTTP(非暗号化)通信でもCookieが送信される。
正解:×(誤り)
解説:誤り。正しくは、Secure属性を付けるとHTTPS通信時のみCookieが送信され、HTTPでは送られない。
-
問108.Web Worker のスクリプトファイルは、生成元のページと異なるオリジンに置いても同一オリジンポリシーの制約を受けない。
正解:×(誤り)
解説:誤り。正しくは、Web Workerのスクリプトは原則として同一オリジンに置く必要があり、同一オリジンポリシーの制約を受ける。
-
問109.Cache API の caches オブジェクトは Service Worker 専用であり、ウィンドウからは利用できない。
正解:×(誤り)
解説:誤り。正しくは、Cache API(caches)はService Workerだけでなくウィンドウコンテキストからも利用できる。
-
問110.Shared Worker は、生成したひとつのタブからのみアクセスできる専用ワーカーである。
正解:×(誤り)
解説:誤り。正しくは、Shared Workerは同一オリジンの複数のタブやウィンドウから共有してアクセスできる。
-
問111.requestAnimationFrame() のコールバックには、引数として現在時刻(DOMHighResTimeStamp)が渡される。
正解:○(正しい)
解説:requestAnimationFrameのコールバックには高精度な現在時刻が渡され、これを用いて経過時間を計算できる。
-
問112.CORS は、クライアント側のJavaScriptだけで設定でき、サーバ側の対応は一切不要である。
正解:×(誤り)
解説:誤り。正しくは、CORSはサーバがAccess-Control-Allow-Origin等の応答ヘッダを返すことで成立し、サーバ側の対応が必須である。
-
問113.Notification API の許可状態は granted(許可)、denied(拒否)、default(未選択)のいずれかで表される。
正解:○(正しい)
解説:Notification.permissionはgranted/denied/defaultのいずれかを返す。defaultは未だ選択されていない状態。
-
問114.Content Security Policy では、デフォルトでインラインスクリプト(onclick属性や<script>内記述)が許可される。
正解:×(誤り)
解説:誤り。正しくは、CSPを有効にするとデフォルトでインラインスクリプトは禁止され、XSSのリスクを下げる。
-
問115.Service Worker はHTTP(非HTTPS)の通常のページでも問題なく登録できる。
正解:×(誤り)
解説:誤り。正しくは、Service WorkerはHTTPS(localhostを除く)でのみ登録でき、HTTPでは利用できない。
-
問116.DeviceOrientationEventで、デバイスのZ軸回りの回転(コンパス方位に相当)を表すプロパティはどれか。
- ア.alpha
- イ.beta
- ウ.gamma
- エ.theta
正解:ア.alpha
解説:Z軸回りはalpha(0〜360度)。betaはX軸、gammaはY軸。
-
問117.PointerEventで入力デバイスの種類(mouse/touch/pen)を判別できるプロパティはどれか。
- ア.pointerType
- イ.pointerId
- ウ.deviceType
- エ.inputKind
正解:ア.pointerType
解説:pointerTypeが入力種別を示す。pressureは筆圧、pointerIdはポインタ識別子。
-
問118.requestAnimationFrameで予約したコールバックを取り消す関数はどれか。
- ア.cancelAnimationFrame(id)
- イ.clearAnimationFrame(id)
- ウ.clearTimeout(id)
- エ.stopAnimationFrame(id)
正解:ア.cancelAnimationFrame(id)
解説:cancelAnimationFrame(id)で取り消す。clearAnimationFrameは存在しない。
-
問119.Web Workerについて正しい説明はどれか。
- ア.別スレッドで動作しDOMに直接アクセスできない
- イ.UIスレッドと同じスレッドで動作する
- ウ.DOMに直接アクセスできる
- エ.localStorageのみ禁止でDOMは操作できる
正解:ア.別スレッドで動作しDOMに直接アクセスできない
解説:Web Workerは別スレッドで動作しDOMに直接アクセスできない。重い処理の分離が目的。
-
問120.http://example.com:80 に対して別オリジンとなるものはどれか。
- ア.https://example.com
- イ.http://example.com/path
- ウ.http://example.com:80/index.html
- エ.http://example.com
正解:ア.https://example.com
解説:https://example.comはスキームが異なるため別オリジン。http://example.com/pathはパス違いのみで同一。
-
問121.CORSで任意のオリジンからのアクセスを許可するサーバ応答ヘッダはどれか。
- ア.Access-Control-Allow-Origin: *
- イ.Access-Control-Allow-All: true
- ウ.Allow-Cross-Origin: *
- エ.Access-Control-Origin: any
正解:ア.Access-Control-Allow-Origin: *
解説:Access-Control-Allow-Origin: * が任意オリジンを許可する。特定許可はそのオリジンを指定。
-
問122.次のWeb Workerのコードで、ワーカーが受け取ったメッセージへ応答する正しい記述はどれか(ワーカー側スクリプト)。
- ア.self.onmessage = e => self.postMessage(e.data)
- イ.document.onmessage = e => document.postMessage(e.data)
- ウ.window.onmessage = e => window.terminate()
- エ.worker.onmessage = e => worker.send(e.data)
正解:ア.self.onmessage = e => self.postMessage(e.data)
解説:ワーカー側ではself.onmessageで受信し、self.postMessage()で応答する。DOMには触れない。
-
問123.次のうち、Geolocation APIで継続的に位置の変化を監視するメソッドはどれか。
- ア.getCurrentPosition()
- イ.watchPosition()
- ウ.observePosition()
- エ.trackPosition()
正解:イ.watchPosition()
解説:watchPosition()は位置変化を継続監視する。getCurrentPositionは1回のみ。
-
問124.タッチイベントで、そのイベントによって状態が変化したタッチ点だけを取得するプロパティはどれか。
- ア.touches
- イ.changedTouches
- ウ.targetTouches
- エ.activeTouches
正解:イ.changedTouches
解説:changedTouchesはそのイベントで変化したタッチ点。touchesは全点、targetTouchesは同一要素上の点。
-
問125.User Timing APIで任意の計測ポイントに名前を付けて記録するメソッドはどれか。
- ア.performance.measure()
- イ.performance.mark()
- ウ.performance.now()
- エ.performance.record()
正解:イ.performance.mark()
解説:performance.mark(name)で計測ポイントを記録する。measureは2点間の計測。
-
問126.メインスレッドからWeb Workerへデータを送るメソッドはどれか。
- ア.sendMessage()
- イ.postMessage()
- ウ.emit()
- エ.dispatchData()
正解:イ.postMessage()
解説:postMessage()でデータを送り、相手はonmessageで受け取る。データは構造化複製される。
-
問127.複数のタブやウィンドウから共有して利用できるワーカーはどれか。
- ア.Dedicated Worker
- イ.Shared Worker
- ウ.Service Worker
- エ.Inline Worker
正解:イ.Shared Worker
解説:Shared Workerは同一オリジンの複数コンテキストで共有できる。Dedicated Workerは専用。
-
問128.Service Workerがネットワークリクエストを横取りしてキャッシュ応答などを返せるイベントはどれか。
- ア.install
- イ.fetch
- ウ.activate
- エ.message
正解:イ.fetch
解説:fetchイベントでリクエストを横取りし、Cacheからの応答返却などプロキシ動作ができる。
-
問129.CSPで同一オリジンのスクリプトのみ許可する指定はどれか。
- ア.script-src 'none'
- イ.script-src 'self'
- ウ.script-src '*'
- エ.script-src 'unsafe-inline'
正解:イ.script-src 'self'
解説:script-src 'self' は自オリジンのスクリプトのみ許可する。'none'は全禁止。
-
問130.ユーザー入力をHTMLに出力する際のエスケープ漏れが原因で起こる代表的な攻撃はどれか。
- ア.CSRF
- イ.XSS
- ウ.SQLインジェクション
- エ.クリックジャッキング
正解:イ.XSS
解説:XSSは出力エスケープ漏れで任意スクリプトが実行される攻撃。
-
問131.HTTPSページ内でHTTPの非暗号化リソースを読み込む状態を指す用語はどれか。
- ア.Cross Content
- イ.Mixed Content
- ウ.Insecure Origin
- エ.Hybrid Content
正解:イ.Mixed Content
解説:Mixed Contentと呼び、ブラウザがブロックまたは警告する。
-
問132.Geolocationの成功コールバックに渡されるPositionオブジェクトから経度を取得するプロパティはどれか。
- ア.position.longitude
- イ.position.coords.lng
- ウ.position.coords.longitude
- エ.position.geo.longitude
正解:ウ.position.coords.longitude
解説:経度はposition.coords.longitudeで取得する。latitudeは緯度。
-
問133.DeviceOrientationEventで、デバイスのX軸回りの回転(前後の傾き)を表すプロパティはどれか。
- ア.gamma
- イ.alpha
- ウ.beta
- エ.delta
正解:ウ.beta
解説:X軸回りはbeta(-180〜180度)。alphaはZ軸、gammaはY軸。
-
問134.マウス・タッチ・ペンを統一的に扱えるイベントモデルはどれか。
- ア.Touch Events
- イ.Mouse Events
- ウ.Pointer Events
- エ.Gesture Events
正解:ウ.Pointer Events
解説:Pointer Eventsが複数入力デバイスを統一的に扱う。pointerdown等で受ける。
-
問135.ブラウザの再描画に同期してアニメーション用コールバックを実行する関数はどれか。
- ア.setInterval()
- イ.setTimeout()
- ウ.requestAnimationFrame()
- エ.requestIdleCallback()
正解:ウ.requestAnimationFrame()
解説:requestAnimationFrameは再描画タイミングに同期して呼ばれ滑らかなアニメーションに適する。
-
問136.User Timing APIで2つのmark間の経過時間を計測するメソッドはどれか。
- ア.performance.mark()
- イ.performance.diff()
- ウ.performance.measure()
- エ.performance.span()
正解:ウ.performance.measure()
解説:performance.measure(name,start,end)が2点間を計測する。mark()は単一ポイント記録。
-
問137.Service Workerの動作に必須となる条件はどれか。
- ア.HTTP接続であること
- イ.Cookieが有効であること
- ウ.HTTPS(またはlocalhost)であること
- エ.WebSocket接続があること
正解:ウ.HTTPS(またはlocalhost)であること
解説:Service WorkerはHTTPS(セキュアコンテキスト、localhostは例外)が必須。
-
問138.Service Workerのライフサイクルで、登録直後にリソースのキャッシュなどを行うイベントはどれか。
- ア.fetch
- イ.sync
- ウ.install
- エ.push
正解:ウ.install
解説:installイベントで初期リソースのキャッシュを行い、続くactivateで制御を開始する。
-
問139.リクエストとレスポンスのペアを保存し、オフライン対応に利用するAPIはどれか。
- ア.LocalStorage
- イ.IndexedDB
- ウ.Cache API
- エ.Cookie
正解:ウ.Cache API
解説:Cache APIがrequest/responseを保存する。LocalStorageは文字列のkey-valueのみ。
-
問140.現在では非推奨・廃止とされ、Service Workerに置き換えられたオフライン技術はどれか。
- ア.IndexedDB
- イ.Web Storage
- ウ.Application Cache
- エ.Cache API
正解:ウ.Application Cache
解説:Application Cache(AppCache)が非推奨・廃止され、Service Worker+Cache APIが後継。
-
問141.クロスオリジンのリソースアクセスをサーバの許可ヘッダで安全に可能にする仕組みはどれか。
- ア.CSP
- イ.SRI
- ウ.CORS
- エ.JSONP
正解:ウ.CORS
解説:CORSが応答ヘッダ(Access-Control-Allow-Origin等)でクロスオリジンアクセスを許可する。
-
問142.ユーザーが位置情報の取得を拒否した場合、PositionErrorのcodeに対応する定数はどれか。
- ア.TIMEOUT
- イ.POSITION_UNAVAILABLE
- ウ.ACCESS_DENIED
- エ.PERMISSION_DENIED
正解:エ.PERMISSION_DENIED
解説:拒否時はPERMISSION_DENIED(code=1)。POSITION_UNAVAILABLEは取得不能、TIMEOUTは時間切れ。
-
問143.ページのナビゲーション開始からの高精度な経過時間(小数ミリ秒)を返すメソッドはどれか。
- ア.Date.now()
- イ.new Date().getTime()
- ウ.performance.timing.now()
- エ.performance.now()
正解:エ.performance.now()
解説:performance.now()が高精度な相対時刻を返す。Date.now()はエポックからの整数ミリ秒。
-
問144.個々のリソース(画像・CSS・JS)の読み込み時間を取得できるAPIはどれか。
- ア.Navigation Timing API
- イ.User Timing API
- ウ.High Resolution Time API
- エ.Resource Timing API
正解:エ.Resource Timing API
解説:Resource Timing APIがリソース単位の詳細タイミングを提供する。Navigation Timingはページ全体。
-
問145.メインスレッドからWeb Workerを即座に終了させるメソッドはどれか。
- ア.worker.stop()
- イ.worker.close()
- ウ.worker.kill()
- エ.worker.terminate()
正解:エ.worker.terminate()
解説:メイン側はworker.terminate()で終了。ワーカー自身はself.close()で終了する。
-
問146.同一オリジンとみなされるために一致が必要な要素の組み合わせはどれか。
- ア.ホストのみ
- イ.スキームとホスト
- ウ.ホストとパス
- エ.スキーム・ホスト・ポート
正解:エ.スキーム・ホスト・ポート
解説:オリジンはスキーム・ホスト・ポートの三要素で決まり、全て一致が必要。
-
問147.読み込み可能なスクリプトやリソースの出所を制限してXSSを軽減するセキュリティ機構はどれか。
- ア.CORS
- イ.SRI
- ウ.SOP
- エ.CSP(Content Security Policy)
正解:エ.CSP(Content Security Policy)
解説:CSP(Content Security Policy)が許可ソースを宣言しXSSを緩和する。
-
問148.クロスサイトリクエスト時のCookie送信を制御してCSRFを緩和するCookie属性はどれか。
- ア.HttpOnly
- イ.Secure
- ウ.Domain
- エ.SameSite
正解:エ.SameSite
解説:SameSite属性(Strict/Lax)でクロスサイト送信を制限しCSRFを緩和する。
-
問149.Web Worker内から外部スクリプトを同期的に読み込むメソッドはどれか。
- ア.require()
- イ.import()
- ウ.loadScript()
- エ.importScripts()
正解:エ.importScripts()
解説:importScripts(url)でワーカー内に外部スクリプトを読み込む。複数指定可。
-
問150.Cache APIで新しいキャッシュ領域を開く(取得する)メソッドはどれか。
- ア.caches.create(name)
- イ.caches.new(name)
- ウ.cache.init(name)
- エ.caches.open(name)
正解:エ.caches.open(name)
解説:caches.open(name)でCacheオブジェクトを取得する。返り値はPromise。
-
問151.canvas要素から2Dの描画コンテキストを取得するには、要素のgetContext("2d")メソッドを呼び出す。
正解:○(正しい)
解説:getContext("2d")でCanvasRenderingContext2Dオブジェクトを取得し、これを通じて描画を行う。
-
問152.Canvasの座標系は左下を原点(0,0)とし、y軸は上方向に増加する。
正解:×(誤り)
解説:誤り。正しくは、Canvasの原点は左上(0,0)で、x軸は右方向、y軸は下方向に増加する。
-
問153.fillRect(x, y, w, h)は、指定した矩形を現在のfillStyleで塗りつぶす。
正解:○(正しい)
解説:fillRectは指定矩形を現在のfillStyleで塗りつぶす。輪郭線はstrokeRectで描画する。
-
問154.clearRect(x, y, w, h)は、指定した矩形領域を現在のfillStyleで塗りつぶす。
正解:×(誤り)
解説:誤り。正しくは、clearRectは指定矩形を透明(消去)にするメソッドで、塗りつぶしはfillRectが行う。
-
問155.beginPath()でパスを開始し、moveTo/lineToで経路を定義してからfillやstrokeで描画する。
正解:○(正しい)
解説:beginPathでパスをリセットし、moveTo/lineTo等で経路を定義、fill/strokeで描画する。
-
問156.moveTo(x, y)は現在のパスに直線を引きながらペン位置を移動する。
正解:×(誤り)
解説:誤り。正しくは、moveToは線を引かずにペンの開始位置を移動するだけで、線を引くのはlineToである。
-
問157.lineTo(x, y)は、直前のパスの点から指定座標まで直線のパスを追加する。
正解:○(正しい)
解説:lineToは現在の点から指定点まで直線パスを追加する。実際の描画はstroke/fillで行われる。
-
問158.arc(x, y, r, startAngle, endAngle)の角度はラジアンではなく度(degree)で指定する。
正解:×(誤り)
解説:誤り。正しくは、arcの角度はラジアンで指定する。例えば180度はMath.PIである。
-
問159.closePath()は、現在のサブパスの始点と終点を直線で結んでパスを閉じる。
正解:○(正しい)
解説:closePathは現在のサブパスの始点へ直線を引いて閉じる。新たな描画開始ではない。
-
問160.lineWidthは線の太さを指定するプロパティで、初期値は0である。
正解:×(誤り)
解説:誤り。正しくは、lineWidthの初期値は1.0であり、0ではない。
-
問161.arc()の第6引数counterclockwiseにtrueを渡すと、円弧が反時計回りに描かれる。
正解:○(正しい)
解説:arcの第6引数はcounterclockwise(省略時false=時計回り)で、trueで反時計回りになる。
-
問162.lineCapのデフォルト値は"round"であり、線の端が丸く描画される。
正解:×(誤り)
解説:誤り。正しくは、lineCapの初期値は"butt"(端で切る)で、他にroundとsquareがある。
-
問163.完全な円をarc()で描くには、終了角に2*Math.PIを指定すればよい。
正解:○(正しい)
解説:開始角0、終了角2*Math.PI(=360度)で全周の円が描ける。半円ならMath.PI。
-
問164.rotate(angle)の回転角は度数で指定し、回転の中心は常にCanvasの中央である。
正解:×(誤り)
解説:誤り。正しくは、rotateの角度はラジアンで、回転中心は現在の原点(0,0)である。
-
問165.fillStyleには色名やRGB値のほか、グラデーションオブジェクトやパターンも設定できる。
正解:○(正しい)
解説:fillStyleには色文字列、CanvasGradient、CanvasPatternを設定でき、塗りに反映される。
-
問166.setTransform()は現在の変形行列に新しい変形を乗算して累積する。
正解:×(誤り)
解説:誤り。正しくは、setTransformは変形行列をリセットして指定値で置き換える。乗算累積はtransformである。
-
問167.globalAlphaに0.5を設定すると、以降の描画がすべて不透明度50%で描かれる。
正解:○(正しい)
解説:globalAlphaは0.0〜1.0で全体の不透明度を指定し、0.5なら半透明で描画される。
-
問168.textAlignプロパティのデフォルト値は"center"である。
正解:×(誤り)
解説:誤り。正しくは、textAlignの初期値は"start"で、left・right・center・endも指定できる。
-
問169.lineJoinは線分の接続部分の形状を指定し、miter・round・bevelの値を取る。
正解:○(正しい)
解説:lineJoinは線の接合形状を指定し、miter(初期値)・round・bevelが指定できる。
-
問170.ImageDataのdata配列は、各ピクセルがR・G・Bの3要素で構成され、アルファ値は含まれない。
正解:×(誤り)
解説:誤り。正しくは、dataは1ピクセルあたりR・G・B・Aの4要素で構成される。
-
問171.save()で現在の描画状態をスタックに退避し、restore()で直前に保存した状態へ復元できる。
正解:○(正しい)
解説:save/restoreはスタイルや変形行列などの状態をスタックで退避・復元する。
-
問172.createImageData(w, h)は、生成したImageDataの全ピクセルを黒色(不透明)で初期化する。
正解:×(誤り)
解説:誤り。正しくは、createImageDataは全ピクセルが透明な黒(RGBAすべて0)で初期化される。
-
問173.translate(x, y)は座標系の原点を(x, y)だけ平行移動する変形である。
正解:○(正しい)
解説:translateは原点を移動する変形で、以降の描画座標の基準が変わる。
-
問174.quadraticCurveTo()は制御点を2つ指定する3次ベジェ曲線を描くメソッドである。
正解:×(誤り)
解説:誤り。正しくは、quadraticCurveToは制御点1つの2次ベジェ曲線で、制御点2つの3次はbezierCurveTo。
-
問175.scale(2, 2)を適用すると、以降の描画がx・y方向ともに2倍に拡大される。
正解:○(正しい)
解説:scale(2,2)はx・y方向の拡大率を2倍にし、線幅も含めて拡大される。
-
問176.requestAnimationFrameは一度登録すると、明示的に停止しなくても自動で繰り返し呼ばれ続ける。
正解:×(誤り)
解説:誤り。正しくは、requestAnimationFrameは1回限りの呼び出しで、ループにはコールバック内での再登録が必要。
-
問177.fillText(text, x, y)は指定位置にテキストを塗りで描画し、strokeTextは輪郭線で描画する。
正解:○(正しい)
解説:fillTextは塗りつぶし文字、strokeTextは輪郭線文字を描画する。
-
問178.requestAnimationFrameはタブが非アクティブになっても、setIntervalと同様の頻度で動作し続ける。
正解:×(誤り)
解説:誤り。正しくは、タブが非アクティブだとrequestAnimationFrameは停止または間引かれ、無駄な描画を抑える。
-
問179.measureText(text)はTextMetricsオブジェクトを返し、widthプロパティでテキスト幅を取得できる。
正解:○(正しい)
解説:measureTextは描画予定テキストの寸法を返し、widthで横幅を取得できる。
-
問180.audio要素のvolumeプロパティは0(無音)から100(最大)の範囲で音量を指定する。
正解:×(誤り)
解説:誤り。正しくは、volumeは0.0(無音)〜1.0(最大)の範囲で指定する。
-
問181.ctx.fontプロパティはCSSのfontショートハンドと同じ書式で指定する。
正解:○(正しい)
解説:fontは"bold 20px sans-serif"のようにCSSのfontと同じ書式で指定する。
-
問182.メディアの再生が末尾まで達して停止したときに発火するイベントはloadedmetadataである。
正解:×(誤り)
解説:誤り。正しくは、再生終了時はendedイベントが発火する。loadedmetadataはメタデータ読込完了時。
-
問183.drawImage()の引数には、img要素のほか別のcanvas要素やvideo要素も指定できる。
正解:○(正しい)
解説:drawImageはHTMLImageElement・HTMLCanvasElement・HTMLVideoElement等を描画元にできる。
-
問184.video要素のdurationプロパティは負の値を返すことで、メディアの長さが不明であることを示す。
正解:×(誤り)
解説:誤り。正しくは、長さ不明やメタデータ未読込時はNaNを返し、負の値ではない。
-
問185.getImageData(x, y, w, h)は指定領域のピクセル情報をImageDataオブジェクトとして取得する。
正解:○(正しい)
解説:getImageDataは指定矩形のピクセルをImageData(data配列にRGBA)として返す。
-
問186.video要素のplay()メソッドを呼び出すと、メディアの再生が一時停止される。
正解:×(誤り)
解説:誤り。正しくは、play()は再生を開始するメソッドで、一時停止はpause()である。
-
問187.putImageData(imageData, dx, dy)はImageDataの内容を指定位置のCanvasに書き戻す。
正解:○(正しい)
解説:putImageDataはImageDataを指定座標にそのまま描画(書き戻し)する。
-
問188.strokeStyleは塗りつぶしの色を、fillStyleは線(輪郭)の描画色を指定するプロパティである。
正解:×(誤り)
解説:誤り。正しくは、strokeStyleが輪郭線の色、fillStyleが塗りつぶしの色を指定する。
-
問189.createLinearGradient(x0, y0, x1, y1)は二点を結ぶ方向の線形グラデーションを生成する。
正解:○(正しい)
解説:createLinearGradientは始点と終点を結ぶ方向の線形グラデーションを返す。
-
問190.cancelAnimationFrameはsetIntervalが返したIDを渡してタイマーを停止するメソッドである。
正解:×(誤り)
解説:誤り。正しくは、cancelAnimationFrameはrequestAnimationFrameのIDを取り消す。setIntervalの停止はclearInterval。
-
問191.Canvasのctx.translate(50,50)後にctx.fillRect(0,0,10,10)を実行すると、矩形の左上は画面座標(50,50)に描かれる。
- ア.画面座標(50,50)
- イ.画面座標(0,0)
- ウ.画面座標(60,60)
- エ.画面座標(40,40)
正解:ア.画面座標(50,50)
解説:translateで原点が(50,50)へ移動するため、座標(0,0)は画面の(50,50)に対応する。
-
問192.Canvas 2Dコンテキストを取得する正しい記述はどれか。
- ア.canvas.create2DContext()
- イ.canvas.getContext("2d")
- ウ.canvas.context("2d")
- エ.canvas.getCanvas2D()
正解:イ.canvas.getContext("2d")
解説:canvas要素に対してgetContext("2d")を呼ぶことで2D描画コンテキストを取得する。
-
問193.Canvasで半径rの完全な円を描くとき、arc()の終了角に指定する値として正しいのはどれか。
- ア.Math.PI
- イ.Math.PI / 2
- ウ.2 * Math.PI
- エ.360
正解:ウ.2 * Math.PI
解説:全周は360度=2*Math.PIラジアンであり、開始角0から2*Math.PIで完全な円になる。
-
問194.Canvasのctx.rotate()に渡す回転角の単位として正しいのはどれか。
- ア.度(degree)
- イ.パーセント
- ウ.グラード
- エ.ラジアン
正解:エ.ラジアン
解説:Canvasのrotateは角度をラジアンで受け取る。90度はMath.PI/2に相当する。
-
問195.指定した矩形領域を透明に消去するCanvasのメソッドはどれか。
- ア.clearRect
- イ.fillRect
- ウ.strokeRect
- エ.eraseRect
正解:ア.clearRect
解説:clearRectは指定矩形を透明に消去する。fillRect/strokeRectは塗り/線を描く。
-
問196.ImageDataのdata配列で、1ピクセルを表すために使われる要素数はいくつか。
- ア.1
- イ.4
- ウ.3
- エ.2
正解:イ.4
解説:ImageDataは1ピクセルにつきR・G・B・Aの4要素を持つため、要素数は4である。
-
問197.線形グラデーションを生成するCanvasのメソッドはどれか。
- ア.createPattern
- イ.addColorStop
- ウ.createLinearGradient
- エ.fillGradient
正解:ウ.createLinearGradient
解説:createLinearGradientが線形グラデーションを生成する。放射状はcreateRadialGradient。
-
問198.ブラウザの再描画タイミングに同期してアニメーション処理を呼び出すAPIはどれか。
- ア.setTimeout
- イ.setInterval
- ウ.setImmediate
- エ.requestAnimationFrame
正解:エ.requestAnimationFrame
解説:requestAnimationFrameは再描画に同期し、滑らかで効率的なアニメーションを実現する。
-
問199.メディアの再生位置が変化するたびに発火するイベントはどれか。
- ア.timeupdate
- イ.loadedmetadata
- ウ.play
- エ.durationchange
正解:ア.timeupdate
解説:timeupdateは再生位置(currentTime)が更新されるたびに発火する。
-
問200.audio要素のvolumeプロパティで指定できる値の範囲として正しいのはどれか。
- ア.0〜255
- イ.0.0〜1.0
- ウ.0〜100
- エ.-1.0〜1.0
正解:イ.0.0〜1.0
解説:volumeは0.0(無音)〜1.0(最大)の範囲で音量を指定する。
-
問201.制御点を1つだけ指定する2次ベジェ曲線を描くCanvasのメソッドはどれか。
- ア.bezierCurveTo
- イ.arcTo
- ウ.quadraticCurveTo
- エ.curveTo
正解:ウ.quadraticCurveTo
解説:quadraticCurveToは制御点1つの2次ベジェ曲線を描く。制御点2つはbezierCurveTo。
-
問202.Canvasの座標系における原点(0,0)の位置として正しいのはどれか。
- ア.右上
- イ.左下
- ウ.中央
- エ.左上
正解:エ.左上
解説:Canvasの原点は左上で、x軸は右、y軸は下方向に増加する。
-
問203.現在の描画状態(スタイルや変形行列)をスタックに退避するCanvasのメソッドはどれか。
- ア.save
- イ.push
- ウ.store
- エ.begin
正解:ア.save
解説:save()が状態をスタックに退避し、restore()で復元する。
-
問204.Canvasとimg要素(ビットマップ画像)・SVGの違いに関する説明として正しいのはどれか。
- ア.Canvasはベクター、SVGはビットマップである
- イ.Canvasはビットマップで拡大に弱く、SVGはベクターでDOM操作できる
- ウ.CanvasもSVGもDOMで個別図形を操作できる
- エ.SVGはJavaScriptから操作できない
正解:イ.Canvasはビットマップで拡大に弱く、SVGはベクターでDOM操作できる
解説:Canvasはビットマップでスクリプト描画、SVGはベクターでDOM操作可能という違いがある。
-
問205.requestAnimationFrameが返したIDを使ってアニメーションを停止するメソッドはどれか。
- ア.clearAnimationFrame
- イ.stopAnimationFrame
- ウ.cancelAnimationFrame
- エ.clearInterval
正解:ウ.cancelAnimationFrame
解説:cancelAnimationFrameにrequestAnimationFrameの戻り値IDを渡して予約を取り消す。
-
問206.ctx.fillStyle = "red" の後に ctx.fillStyle = "blue" を設定し、fillRectを実行した。描画される塗り色はどれか。
- ア.赤
- イ.黒(初期値)
- ウ.紫(混色)
- エ.青
正解:エ.青
解説:fillStyleは後から設定した値が有効となるため、塗り色は青(blue)になる。
-
問207.ctx.scale(2, 3) を適用した場合の拡大率として正しいのはどれか。
- ア.x方向2倍・y方向3倍
- イ.x方向3倍・y方向2倍
- ウ.x・yともに6倍
- エ.x・yともに2.5倍
正解:ア.x方向2倍・y方向3倍
解説:scale(2,3)はx方向2倍、y方向3倍に拡大する変形である。
-
問208.現在の変形行列をリセットして指定値で完全に置き換えるCanvasのメソッドはどれか。
- ア.transform
- イ.setTransform
- ウ.resetTransform
- エ.applyTransform
正解:イ.setTransform
解説:setTransformは行列をリセットして置換する。transformは既存行列に乗算累積する。
-
問209.JavaScriptからメディアストリームを動的に生成しvideo要素へ供給する仕組みはどれか。
- ア.Web Audio API
- イ.WebRTC
- ウ.Media Source Extensions(MSE)
- エ.WebGL
正解:ウ.Media Source Extensions(MSE)
解説:Media Source Extensions(MSE)はJSでメディアを組み立てて供給し、適応ストリーミングを可能にする。
-
問210.ctx.beginPath(); ctx.moveTo(10,10); ctx.lineTo(50,10); の後、線を実際に表示するために必要な呼び出しはどれか。
- ア.ctx.closePath()
- イ.ctx.show()
- ウ.ctx.draw()
- エ.ctx.stroke()
正解:エ.ctx.stroke()
解説:パスを定義しただけでは描画されず、stroke()を呼ぶことで線が表示される。
-
問211.テキストの水平方向の揃え位置を指定するCanvasのプロパティはどれか。
- ア.textAlign
- イ.textBaseline
- ウ.textPosition
- エ.align
正解:ア.textAlign
解説:textAlignが水平方向の揃え(start/end/left/right/center)を指定する。垂直はtextBaseline。
-
問212.video要素を一時停止状態から再生する正しい記述はどれか。
- ア.video.start()
- イ.video.play()
- ウ.video.resume()
- エ.video.run()
正解:イ.video.play()
解説:video.play()で再生を開始する。pause()は一時停止である。
-
問213.Canvasのctx.globalAlpha = 0.5 を設定した状態で描画した場合の効果として正しいのはどれか。
- ア.描画が2倍の濃さになる
- イ.背景色が変わる
- ウ.以降の描画が不透明度50%になる
- エ.線幅が半分になる
正解:ウ.以降の描画が不透明度50%になる
解説:globalAlpha=0.5は以降の描画を不透明度50%(半透明)にする。
-
問214.AudioContextを起点にノードを接続して音声を合成・加工するAPIはどれか。
- ア.Canvas Audio
- イ.Media Source Extensions
- ウ.HTML Media Capture
- エ.Web Audio API
正解:エ.Web Audio API
解説:Web Audio APIはAudioContext上でノードグラフを組み、音声生成・加工を行う。
-
問215.lineCapプロパティの初期値として正しいのはどれか。
- ア.butt
- イ.square
- ウ.round
- エ.miter
正解:ア.butt
解説:lineCapの初期値はbuttで、線端を切り落とす。他にround・squareがある。
-
問216.drawImageメソッドの引数として指定できないものはどれか。
- ア.HTMLImageElement
- イ.画像URLの文字列
- ウ.HTMLVideoElement
- エ.HTMLCanvasElement
正解:イ.画像URLの文字列
解説:drawImageはimg/canvas/video等を描画元にできるが、文字列(URL)を直接は渡せない。
-
問217.ImageDataの内容を指定座標へCanvasに書き戻すメソッドはどれか。
- ア.getImageData
- イ.drawImageData
- ウ.putImageData
- エ.setImageData
正解:ウ.putImageData
解説:putImageDataはImageDataを指定位置にそのまま描画(書き戻し)する。
-
問218.ctx.rotate(Math.PI) を適用した場合の回転量として正しいのはどれか。
- ア.45度
- イ.90度
- ウ.360度
- エ.180度
正解:エ.180度
解説:Math.PIラジアンは180度に相当するため、180度の回転となる。
-
問219.メディアの長さや寸法などのメタデータが利用可能になった時点で発火するイベントはどれか。
- ア.loadedmetadata
- イ.canplay
- ウ.ended
- エ.timeupdate
正解:ア.loadedmetadata
解説:loadedmetadataはメタデータ読込完了で発火し、この時点でdurationが取得可能になる。
-
問220.描画予定テキストの幅を取得するために使うCanvasのメソッドはどれか。
- ア.getTextWidth
- イ.measureText
- ウ.textWidth
- エ.calcText
正解:イ.measureText
解説:measureTextはTextMetricsを返し、そのwidthでテキスト幅を取得できる。
-
問221.新しい描画と既存内容の合成方法を指定するCanvasのプロパティはどれか。
- ア.globalAlpha
- イ.blendMode
- ウ.globalCompositeOperation
- エ.compositeStyle
正解:ウ.globalCompositeOperation
解説:globalCompositeOperationがsource-over等の合成モードを指定する。
-
問222.メディアの音量設定値を保持したまま無音にするために使うプロパティはどれか。
- ア.volume = 0
- イ.pause()
- ウ.silent = true
- エ.muted = true
正解:エ.muted = true
解説:mutedをtrueにするとvolumeの値を保持したままミュートできる。
-
問223.drawImageの9引数形式 drawImage(img, sx, sy, sw, sh, dx, dy, dw, dh) における sx, sy, sw, sh が表すものはどれか。
- ア.元画像の切り出し矩形
- イ.描画先の矩形
- ウ.拡大率
- エ.回転角度
正解:ア.元画像の切り出し矩形
解説:9引数版の前半sx,sy,sw,shは元画像からの切り出し(ソース)矩形、後半が描画先矩形。
-
問224.createImageData(w, h) で生成されるImageDataの初期状態として正しいのはどれか。
- ア.全ピクセルが不透明な黒
- イ.全ピクセルが透明(RGBA全て0)
- ウ.全ピクセルが不透明な白
- エ.全ピクセルがランダム色
正解:イ.全ピクセルが透明(RGBA全て0)
解説:createImageDataは全ピクセルが透明な黒(RGBAすべて0)で初期化される。
-
問225.ctx.strokeRect(10, 10, 100, 50) を実行したときの描画結果として正しいのはどれか。
- ア.幅100・高さ50の矩形を塗りつぶす
- イ.矩形領域を消去する
- ウ.幅100・高さ50の矩形の輪郭線を描く
- エ.幅50・高さ100の矩形の輪郭線を描く
正解:ウ.幅100・高さ50の矩形の輪郭線を描く
解説:strokeRectは指定矩形の輪郭線のみを描く。塗りつぶしはfillRectが行う。
-
問226.JavaScriptのプリミティブ型は、string・number・boolean・null・undefined・symbol・bigintの7種類である。
正解:○(正しい)
解説:ES2020以降、上記7種類がプリミティブ型。これ以外(配列・関数等)はオブジェクト型である。
-
問227.constで宣言した変数は再代入できないが、その変数が参照するオブジェクトのプロパティは変更できる。
正解:○(正しい)
解説:constは束縛(再代入)を禁止するだけで、参照先オブジェクトの中身は変更可能である。
-
問228.===演算子は型変換を行わずに値と型の両方を比較する厳密等価演算子である。
正解:○(正しい)
解説:===は型変換せず、型も値も等しい場合のみtrueを返す。==は型変換(型強制)を行う。
-
問229.varで宣言された変数は関数スコープを持つが、letとconstはブロックスコープを持つ。
正解:○(正しい)
解説:varは関数スコープ(またはグローバル)、let/constは波括弧単位のブロックスコープを持つ。
-
問230.アロー関数は自身のthisを持たず、定義された場所の外側のthisを継承する。
正解:○(正しい)
解説:アロー関数はthisを束縛せず、レキシカルスコープ(定義時の外側)のthisを参照する。
-
問231.JavaScriptの関数宣言(function文)は巻き上げ(hoisting)により定義より前で呼び出せる。
正解:○(正しい)
解説:関数宣言は定義全体が巻き上げられるため、宣言より前のコードからでも呼び出せる。
-
問232.letで宣言された変数も巻き上げられるが、宣言前にアクセスするとTDZ(一時的死帯)によりエラーになる。
正解:○(正しい)
解説:let/constも巻き上げられるが初期化前はTDZにあり、参照するとReferenceErrorになる。
-
問233.クロージャとは、関数が自身の外側のスコープの変数を保持し続ける仕組みである。
正解:○(正しい)
解説:クロージャは関数とそれを囲むレキシカル環境の組み合わせで、外側変数を参照保持する。
-
問234.Promiseは非同期処理の結果を表すオブジェクトで、pending・fulfilled・rejectedの3状態を持つ。
正解:○(正しい)
解説:Promiseは保留(pending)・成功(fulfilled)・失敗(rejected)の3状態を持つ。
-
問235.Mapはキーに任意の型(オブジェクトを含む)を使用でき、挿入順を保持する。
正解:○(正しい)
解説:Mapはオブジェクトを含む任意の型をキーにでき、挿入順を保持する点が通常のオブジェクトと異なる。
-
問236.Setは重複しない値のコレクションで、同じ値を追加しても1つしか保持しない。
正解:○(正しい)
解説:Setは一意な値のみを保持し、重複した値の追加は無視される。
-
問237.async関数は常にPromiseを返し、await式はPromiseの解決を待つ。
正解:○(正しい)
解説:async関数の戻り値は必ずPromiseでラップされ、awaitはPromiseの解決値を取り出す。
-
問238.JSON.stringify()はJavaScriptのオブジェクトをJSON文字列に変換する。
正解:○(正しい)
解説:JSON.stringify()はオブジェクトをJSON文字列に変換し、JSON.parse()は逆を行う。
-
問239.rest引数(...args)は関数に渡された残りの引数を配列としてまとめる。
正解:○(正しい)
解説:rest構文...argsは可変長の引数を配列にまとめる。spread構文は逆に展開する。
-
問240.instanceof演算子はオブジェクトが特定のコンストラクタのインスタンスかを判定する。
正解:○(正しい)
解説:instanceofはプロトタイプチェーンを辿り、指定コンストラクタのインスタンスか判定する。
-
問241.Symbol()で生成された値は、引数の説明が同じでも常に一意で互いに等しくない。
正解:○(正しい)
解説:説明が同じSymbol同士も===で比較するとfalse。Symbolは常に一意な値を生成する。
-
問242.strictモードは use strict; を記述することで有効になり、未宣言変数への代入などをエラーにする。
正解:○(正しい)
解説:strictモードは厳格な構文チェックを行い、暗黙のグローバル変数生成などを禁止する。
-
問243.try-catch-finally文のfinallyブロックは、例外の有無にかかわらず必ず実行される。
正解:○(正しい)
解説:finallyは正常終了・例外発生・returnのいずれの場合でも必ず実行される。
-
問244.spliceメソッドは元の配列を変更(破壊的操作)するが、sliceは元の配列を変更しない。
正解:○(正しい)
解説:spliceは元配列を直接変更する破壊的メソッド、sliceは新配列を返す非破壊的メソッド。
-
問245.プロトタイプチェーンにより、オブジェクトは自身にないプロパティを親(プロトタイプ)から継承して参照できる。
正解:○(正しい)
解説:プロパティ参照時、自身→prototype→…と連鎖を辿る。これがプロトタイプベース継承である。
-
問246.NaN === NaN はtrueを返す。
正解:×(誤り)
解説:誤り。正しくは、NaNは自分自身を含むいかなる値とも等しくないためfalse。判定にはNumber.isNaN()を使う。
-
問247.テンプレートリテラルはシングルクォートで囲み、その中で式を埋め込む。
正解:×(誤り)
解説:誤り。正しくは、テンプレートリテラルはバッククォートで囲む。シングルクォートでは式は展開されない。
-
問248.delete演算子で配列の要素を削除すると、その配列の長さ(length)も自動的に1減る。
正解:×(誤り)
解説:誤り。正しくは、deleteは要素をemptyにするだけでlengthは変わらない。長さを詰めるにはspliceを使う。
-
問249.argumentsオブジェクトはアロー関数内でも通常関数と同様に自身の引数を参照できる。
正解:×(誤り)
解説:誤り。正しくは、アロー関数は自身のargumentsを持たず、外側のargumentsを参照する。
-
問250.typeof演算子で配列を調べると array という文字列が返る。
正解:×(誤り)
解説:誤り。正しくは、配列はオブジェクト型なのでtypeof []は object を返す。判定はArray.isArray。
-
問251.bind()メソッドは指定したthisを束縛した関数を即座に実行する。
正解:×(誤り)
解説:誤り。正しくは、bindはthisを束縛した新しい関数を返すだけで即実行はしない。即実行はcall/apply。
-
問252.空でない文字列 false を Boolean() で変換すると false になる。
正解:×(誤り)
解説:誤り。正しくは、空でない文字列は全てtruthyなので、Boolean('false')はtrueになる。
-
問253.typeof演算子は未宣言の変数に対して使用するとReferenceErrorになる。
正解:×(誤り)
解説:誤り。正しくは、typeofは未宣言変数に対してもエラーを出さず undefined を返す例外的な演算子。
-
問254.==演算子では、数値の0と空文字は型が違うため等しくないと評価される。
正解:×(誤り)
解説:誤り。正しくは、==は型変換するため空文字は0に変換され、0 == '' はtrueになる。
-
問255.forEach()メソッドは各要素を処理した結果を集めた新しい配列を返す。
正解:×(誤り)
解説:誤り。正しくは、forEachは戻り値がundefinedで新配列を返さない。新配列を作るのはmap。
-
問256.let で同じスコープに同名変数を再宣言しても、エラーにならず上書きされる。
正解:×(誤り)
解説:誤り。正しくは、let/constは同一スコープでの再宣言を禁止しSyntaxErrorになる。varは再宣言可。
-
問257.Promise.all() は1つでもPromiseが失敗しても、残りの成功結果を返して解決する。
正解:×(誤り)
解説:誤り。正しくは、Promise.allは1つでもrejectされると即座にreject(失敗)する。
-
問258.スプレッド構文 {...obj} はオブジェクトのディープコピー(深い複製)を作成する。
正解:×(誤り)
解説:誤り。正しくは、スプレッドは浅いコピーで、ネストしたオブジェクトは参照が共有される。
-
問259.プリミティブ型は参照型であり、変数同士の代入では同じ実体を共有する。
正解:×(誤り)
解説:誤り。正しくは、プリミティブは値型で代入時に値そのものがコピーされる。参照型はオブジェクト。
-
問260.for-in文は配列の要素の値を順番に取り出すために使うのが推奨される。
正解:×(誤り)
解説:誤り。正しくは、for-inはキー(インデックス)を反復する。値の反復にはfor-ofが推奨される。
-
問261.Number('10px') を実行すると数値10が返る。
正解:×(誤り)
解説:誤り。正しくは、Number は文字列全体が数値でないとNaNを返す。先頭部分を取るのはparseInt。
-
問262.map・filter・reduce はいずれも元の配列を破壊的に変更する。
正解:×(誤り)
解説:誤り。正しくは、map/filter/reduceは非破壊的で新しい値を返し、元配列は変更しない。
-
問263.console.log(typeof null) の結果は文字列 null である。
正解:×(誤り)
解説:誤り。正しくは、typeof nullは歴史的経緯から object を返す。仕様上のバグだが互換性のため未修正。
-
問264.アロー関数は new 演算子でインスタンス化できるコンストラクタとして使える。
正解:×(誤り)
解説:誤り。正しくは、アロー関数はコンストラクタにできず、newで呼ぶとTypeErrorになる。
-
問265.import / export の export default は1つのモジュールに複数定義できる。
正解:×(誤り)
解説:誤り。正しくは、default exportはモジュールにつき1つのみ。名前付きexportは複数定義できる。
-
問266.次のコードの出力は? console.log(typeof undefined);
- ア."undefined"
- イ."object"
- ウ."null"
- エ."none"
正解:ア."undefined"
解説:typeof undefinedは undefined を返す。undefinedは値であり型でもある。
-
問267.次のコードの出力は? console.log(0 == '');
- ア.true
- イ.false
- ウ.0
- エ.NaN
正解:ア.true
解説:==では空文字は数値0に変換され、0 == 0 となりtrueになる。
-
問268.次のコードの出力は? console.log(typeof NaN);
- ア."number"
- イ."NaN"
- ウ."undefined"
- エ."object"
正解:ア."number"
解説:NaNはnumber型の特殊な値であり、typeofは number を返す。
-
問269.次のコードの出力は? console.log(1 + '2' + 3);
- ア."123"
- イ.6
- ウ."15"
- エ."33"
正解:ア."123"
解説:1+'2'は文字列連結で'12'、さらに'12'+3で'123'となる。+は左から評価される。
-
問270.次のコードの出力は? console.log([1,2,3].map(x => x * 2));
- ア.[2, 4, 6]
- イ.[1, 2, 3]
- ウ.[1, 4, 9]
- エ.6
正解:ア.[2, 4, 6]
解説:mapは各要素に関数を適用した新配列を返す。各要素を2倍にして[2,4,6]となる。
-
問271.次のコードの出力は? console.log(2 ** 3);
- ア.8
- イ.6
- ウ.9
- エ.5
正解:ア.8
解説:**はべき乗演算子(ES2016)で、2の3乗=8を返す。
-
問272.次のコードの出力は? console.log([1,2,3].reduce((a,b)=>a+b,0));
- ア.6
- イ.0
- ウ.3
- エ.[1,2,3]
正解:ア.6
解説:reduceは累積値を計算する。初期値0に1,2,3を順に加算し6になる。
-
問273.次のコードの出力は? console.log(typeof function(){});
- ア."function"
- イ."object"
- ウ."undefined"
- エ."Function"
正解:ア."function"
解説:関数はオブジェクトの一種だが、typeofは特別に function を返す。
-
問274.次のコードの出力は? console.log(Array.from('abc'));
- ア.['a', 'b', 'c']
- イ."abc"
- ウ.['abc']
- エ.[a, b, c]
正解:ア.['a', 'b', 'c']
解説:Array.fromはイテラブル等から配列を生成する。'abc'から要素3つの配列になる。
-
問275.次のコードの出力は? console.log(typeof typeof 1);
- ア."number"
- イ."string"
- ウ."object"
- エ."undefined"
正解:イ."string"
解説:typeof 1は number(文字列)、さらにその typeof は string を返す。
-
問276.次のコードの出力は? console.log('5' - 3);
- ア."53"
- イ.2
- ウ."2"
- エ.NaN
正解:イ.2
解説:-演算子は文字列を数値に変換するため、'5'は5となり5-3=2が出力される。
-
問277.次のコードの出力は? console.log([1,2,3,4].filter(x => x % 2 === 0));
- ア.[1, 3]
- イ.[2, 4]
- ウ.[1, 2, 3, 4]
- エ.2
正解:イ.[2, 4]
解説:filterは条件を満たす要素のみの新配列を返す。偶数の[2,4]となる。
-
問278.次のコードの出力は? console.log(Boolean(''));
- ア.true
- イ.false
- ウ.空文字
- エ.undefined
正解:イ.false
解説:空文字はfalsyな値なので、Boolean('')はfalseを返す。
-
問279.次のコードの出力は? console.log([1,2,3].includes(2));
- ア.false
- イ.true
- ウ.1
- エ.2
正解:イ.true
解説:includesは指定値が配列に含まれるかをbooleanで返す。2は含まれるのでtrue。
-
問280.次のコードの出力は? console.log(Math.floor(4.7));
- ア.5
- イ.4
- ウ.4.7
- エ.3
正解:イ.4
解説:Math.floorは引数以下の最大の整数(切り捨て)を返す。4.7は4になる。
-
問281.次のコードの出力は? console.log(typeof Symbol());
- ア."object"
- イ."symbol"
- ウ."Symbol"
- エ."string"
正解:イ."symbol"
解説:Symbol()はsymbol型の一意な値を生成する。typeofは symbol を返す。
-
問282.次のコードの出力は? console.log(JSON.parse('{"x": 5}').x);
- ア."5"
- イ.5
- ウ.undefined
- エ.{x:5}
正解:イ.5
解説:JSON.parseはJSON文字列をオブジェクトに変換し、.xで数値5を取得する。
-
問283.次のコードの出力は? console.log(0 || 'a' || 'b');
- ア.0
- イ."a"
- ウ."b"
- エ.true
正解:イ."a"
解説:||は最初のtruthyな値を返す。0はfalsyなので'a'が返される。
-
問284.次のコードの出力は? console.log([1,2,3].indexOf(2));
- ア.0
- イ.1
- ウ.2
- エ.-1
正解:イ.1
解説:indexOfは指定値が最初に現れるインデックスを返す。2はインデックス1にある。
-
問285.次のコードの出力は? console.log(null ?? 'default');
- ア.null
- イ.undefined
- ウ."default"
- エ.false
正解:ウ."default"
解説:??は左辺がnullまたはundefinedの時のみ右辺を返す。'default'となる。
-
問286.次のコードの出力は? console.log(typeof null);
- ア."null"
- イ."undefined"
- ウ."object"
- エ."number"
正解:ウ."object"
解説:typeof nullは歴史的な仕様上のバグにより object を返す。互換性のため未修正。
-
問287.次のコードの出力は? console.log([1,2,3].find(x => x > 1));
- ア.1
- イ.[2, 3]
- ウ.2
- エ.3
正解:ウ.2
解説:findは条件を満たす最初の要素を返す。1より大きい最初の要素は2である。
-
問288.次のコードの出力は? console.log('abc'.length);
- ア.2
- イ.4
- ウ.3
- エ.undefined
正解:ウ.3
解説:文字列のlengthプロパティは文字数を返す。'abc'は3文字である。
-
問289.次のコードの出力は? console.log(Number('12a'));
- ア.12
- イ."12a"
- ウ.NaN
- エ.0
正解:ウ.NaN
解説:Number()は文字列全体が数値でないとNaNを返す。'12a'は変換できずNaN。
-
問290.次のコードの出力は? console.log(5 / 0);
- ア.0
- イ.NaN
- ウ.Infinity
- エ.エラー
正解:ウ.Infinity
解説:正の数を0で割るとInfinity(無限大)を返す。例外は発生しない。
-
問291.次のコードの出力は? console.log(Math.max(1, 5, 3));
- ア.1
- イ.3
- ウ.5
- エ.9
正解:ウ.5
解説:Math.maxは引数の中の最大値を返す。1,5,3の最大は5である。
-
問292.次のコードの出力は? const a = {x:1}; const b = a; b.x = 2; console.log(a.x);
- ア.1
- イ.undefined
- ウ.2
- エ.エラー
正解:ウ.2
解説:bはaと同じオブジェクトを参照するため、b.x変更でa.xも2になる(参照型)。
-
問293.次のコードの出力は? const s = new Set([1,2,2,3]); console.log(s.size);
- ア.4
- イ.1
- ウ.3
- エ.2
正解:ウ.3
解説:Setは重複を除くため、[1,2,2,3]からは要素3つとなりsizeは3。
-
問294.次のコードの出力は? console.log(['1','2','3'].map(Number));
- ア.['1','2','3']
- イ.[NaN, NaN, NaN]
- ウ.[1, 2, 3]
- エ.6
正解:ウ.[1, 2, 3]
解説:map(Number)で各文字列を数値に変換し[1,2,3]を返す。
-
問295.次のコードの出力は? const [a, b] = [10, 20]; console.log(a + b);
- ア.10
- イ.20
- ウ.[10, 20]
- エ.30
正解:エ.30
解説:配列の分割代入でa=10、b=20が代入され、a+b=30が出力される。
-
問296.次のコードの出力は? console.log(parseFloat('3.14abc'));
- ア.3
- イ.NaN
- ウ."3.14"
- エ.3.14
正解:エ.3.14
解説:parseFloatは先頭から浮動小数点として解釈できる部分を返す。3.14となる。
-
問297.次のコードの出力は? console.log([1,2,3].reverse());
- ア.[1, 2, 3]
- イ.[2, 1, 3]
- ウ.[1, 3, 2]
- エ.[3, 2, 1]
正解:エ.[3, 2, 1]
解説:reverseは配列を逆順にする(破壊的)。[3,2,1]を返す。
-
問298.次のコードの出力は? let x; console.log(x);
- ア.null
- イ.0
- ウ.エラー
- エ.undefined
正解:エ.undefined
解説:宣言のみで初期化されていない変数の値はundefinedである。
-
問299.次のコードの出力は? const f = (a, b = 5) => a + b; console.log(f(3));
- ア.3
- イ.5
- ウ.NaN
- エ.8
正解:エ.8
解説:デフォルト引数によりb=5が使われ、a=3との和8が出力される。
-
問300.次のコードの出力は? console.log(10 % 3);
- ア.3
- イ.0
- ウ.3.33
- エ.1
正解:エ.1
解説:%は剰余演算子で、10を3で割った余り1を返す。
-
問301.localStorageに保存したデータは、ブラウザを閉じても明示的に削除するまで永続的に保持される。
正解:○(正しい)
解説:localStorageは永続ストレージで、削除しない限りブラウザ再起動後も残り続ける。
-
問302.sessionStorageに保存したデータは、そのタブ(ブラウジングコンテキスト)を閉じると破棄される。
正解:○(正しい)
解説:sessionStorageはタブ単位の生存期間を持ち、タブを閉じると自動的に消去される。
-
問303.Web Storageに保存できる値は文字列型のみであり、オブジェクトはJSON.stringifyで文字列化して保存する必要がある。
正解:○(正しい)
解説:setItemの値は文字列に変換されるため、オブジェクトはJSON.stringifyで文字列化して保存する。
-
問304.localStorage.getItem()で存在しないキーを指定した場合、nullが返る。
正解:○(正しい)
解説:getItemは該当するキーが存在しなければnullを返す(undefinedではない)。
-
問305.localStorage.removeItem()は引数を省略すると、そのオリジンの全データを削除する。
正解:×(誤り)
解説:誤り。正しくは、全削除はclear()であり、removeItemはキー指定で1件のみ削除する。
-
問306.localStorage.lengthは、現在保存されているキーと値のペアの数を返す。
正解:○(正しい)
解説:lengthプロパティはそのオリジンに保存されている項目数を整数で返す。
-
問307.localStorage.setItem('n', 100)の後、typeof localStorage.getItem('n')は'number'を返す。
正解:×(誤り)
解説:誤り。正しくは、数値100は文字列'100'として保存されるため、取り出すと'string'になる。
-
問308.Web Storageの内容は、Cookieと同様にHTTPリクエストごとにサーバーへ自動送信される。
正解:×(誤り)
解説:誤り。正しくは、Web Storageはサーバーへ自動送信されず、自動送信されるのはCookieである。
-
問309.IndexedDBは大容量の構造化データを保存でき、APIは基本的に非同期で動作する。
正解:○(正しい)
解説:IndexedDBは大容量・構造化データ向けで、操作は非同期APIで実行される。
-
問310.IndexedDBでオブジェクトストアを作成するのはonupgradeneededイベントハンドラの中である。
正解:○(正しい)
解説:スキーマ変更(ストア作成)はバージョン更新時のonupgradeneeded内で行う。
-
問311.IndexedDBのobjectStore.put()は、キーが存在すれば更新、なければ追加を行う。
正解:○(正しい)
解説:put()は既存キーなら値を更新し、キーが未存在なら新規に追加する。
-
問312.IndexedDBで多数のレコードを順に処理するにはカーソル(cursor)を利用できる。
正解:○(正しい)
解説:openCursor()で取得したカーソルにより複数レコードを順次走査して処理できる。
-
問313.IndexedDBのkeyPathは、オブジェクトのどのプロパティを主キーにするかを指定する。
正解:○(正しい)
解説:keyPathで指定したプロパティがレコードの主キー(キー)として使われる。
-
問314.XMLHttpRequestのsend()メソッドはリクエストを実際にサーバーへ送信する。
正解:○(正しい)
解説:send()はopenで構成したリクエストを実際にサーバーへ送信するメソッドである。
-
問315.XMLHttpRequestのreadyStateが4のとき、リクエストは完了しレスポンスを受信済みである。
正解:○(正しい)
解説:readyState=4(DONE)はリクエスト完了かつレスポンス受信完了を表す状態である。
-
問316.XMLHttpRequestのonreadystatechangeは、readyStateが変化するたびに呼び出される。
正解:○(正しい)
解説:readyStateの値が変わるたびにonreadystatechangeハンドラが実行される。
-
問317.XMLHttpRequestのopen()で第3引数にfalseを指定すると、同期リクエストになる。
正解:○(正しい)
解説:open(method,url,false)は同期通信となり、応答が返るまで処理がブロックされる。
-
問318.fetch()はコールバック関数ではなくPromiseを返す。
正解:○(正しい)
解説:fetch()はResponseオブジェクトに解決されるPromiseを返すAPIである。
-
問319.fetchのResponseオブジェクトでは、ステータスが404でもokプロパティはtrueになる。
正解:×(誤り)
解説:誤り。正しくは、response.okは200番台のときだけtrueで、404などではfalseになる。
-
問320.fetchはネットワーク障害などでリクエスト自体が失敗した場合はPromiseがrejectされる。
正解:○(正しい)
解説:ネットワークエラーなど通信そのものが失敗した場合はfetchのPromiseがrejectされる。
-
問321.WebSocketはクライアントとサーバー間の双方向・全二重通信を可能にする。
正解:○(正しい)
解説:WebSocketは接続確立後、双方向(全二重)でメッセージを送受信できる仕組みである。
-
問322.WebSocketで接続が確立されるとonopenイベントが発火する。
正解:○(正しい)
解説:WebSocketの接続が成功して確立されるとonopenイベントハンドラが呼ばれる。
-
問323.Server-Sent EventsはEventSourceオブジェクトを使って実装する。
正解:○(正しい)
解説:SSEはnew EventSource(url)でEventSourceを生成して接続を確立する。
-
問324.Server-Sent Eventsは接続が切れると再接続せず、開発者が手動で再接続を実装する必要がある。
正解:×(誤り)
解説:誤り。正しくは、SSEは接続断時にブラウザが自動で再接続を試みる仕組みを標準で備えている。
-
問325.同一オリジンとは、スキーム(プロトコル)・ホスト・ポートがすべて一致することを指す。
正解:○(正しい)
解説:オリジンはスキーム・ホスト・ポートの3要素で定義され、すべて一致で同一オリジン。
-
問326.localStorageは異なるオリジン間でもデータを共有できる。
正解:×(誤り)
解説:誤り。正しくは、Web Storageは同一オリジンポリシーに従い、オリジンが異なると共有できない。
-
問327.localStorage.setItem('key','value')は値を保存し、戻り値として保存した値を返す。
正解:×(誤り)
解説:誤り。正しくは、setItemは値の保存を行うが戻り値はundefinedである。
-
問328.localStorage.clear()は、指定した1つのキーのみを削除する。
正解:×(誤り)
解説:誤り。正しくは、clear()はそのオリジンの全データを削除し、1件削除はremoveItem()である。
-
問329.localStorageの値が変更されると、変更を行ったそのタブ自身でstorageイベントが発火する。
正解:×(誤り)
解説:誤り。正しくは、storageイベントは変更を起こしたページ自身では発火せず、同一オリジンの他タブで発火する。
-
問330.sessionStorageの変更は、同一オリジンの別タブにstorageイベントとして伝播する。
正解:×(誤り)
解説:誤り。正しくは、sessionStorageはタブ単位で隔離されており、他タブへは伝播しない。
-
問331.IndexedDBのトランザクションでデータを書き込むにはモードをreadonlyにする必要がある。
正解:×(誤り)
解説:誤り。正しくは、書き込み(add/put/delete)にはreadwriteモードのトランザクションが必要である。
-
問332.IndexedDBのobjectStore.add()は、同じキーが既に存在しても上書き保存に成功する。
正解:×(誤り)
解説:誤り。正しくは、add()は既存キーがあるとエラーになり、上書きはput()を用いる。
-
問333.IndexedDBはキーと値のペアを保存できるが、値にJavaScriptオブジェクトを直接格納することはできない。
正解:×(誤り)
解説:誤り。正しくは、IndexedDBは構造化複製によりJavaScriptオブジェクトを直接格納できる。
-
問334.XMLHttpRequestのreadyStateの初期値(open前)は4である。
正解:×(誤り)
解説:誤り。正しくは、openを呼ぶ前の初期状態はreadyState=0(UNSENT)である。
-
問335.fetch()はサーバーが404や500などのHTTPエラーステータスを返すと、Promiseがrejectされる。
正解:×(誤り)
解説:誤り。正しくは、fetchはHTTPエラーステータスでもrejectせずresolveし、response.okで判定する。
-
問336.WebSocketの接続URLにはhttp://またはhttps://スキームを使用する。
正解:×(誤り)
解説:誤り。正しくは、WebSocketはws://(非暗号)またはwss://(暗号)スキームを使用する。
-
問337.WebSocketのsend()は送信専用で、サーバーからの受信にはonsendイベントを用いる。
正解:×(誤り)
解説:誤り。正しくは、受信時に発火するのはonmessageイベントであり、onsendは存在しない。
-
問338.Server-Sent Events(SSE)は、クライアントからサーバーへの一方向通信を行う仕組みである。
正解:×(誤り)
解説:誤り。正しくは、SSEはサーバーからクライアントへの一方向プッシュ通信である。
-
問339.CORSのプリフライトリクエストはGETメソッドで送信される。
正解:×(誤り)
解説:誤り。正しくは、プリフライトリクエストはOPTIONSメソッドで事前送信される。
-
問340.XMLHttpRequestのresponseTextは、レスポンス本文をJSONオブジェクトとして返す。
正解:×(誤り)
解説:誤り。正しくは、responseTextはレスポンス本文を文字列として返す。
-
問341.次のコードで完了時にconsoleへ出力されるreadyStateの値はいくつか。 var xhr = new XMLHttpRequest(); xhr.open('GET','/data'); xhr.onreadystatechange = function(){ if(xhr.readyState===4){ console.log(xhr.readyState); } }; xhr.send();
- ア.4
- イ.3
- ウ.2
- エ.1
正解:ア.4
解説:readyState=4はDONE(リクエスト完了)を表す状態である。
-
問342.Web Storageで「現在保存されている項目数」を取得するプロパティはどれか。
- ア.length
- イ.size
- ウ.count
- エ.items
正解:ア.length
解説:lengthプロパティが保存済みの項目数を返す。
-
問343.fetch()が返すものはどれか。
- ア.Promise
- イ.Responseオブジェクト(同期)
- ウ.XMLHttpRequest
- エ.コールバックID
正解:ア.Promise
解説:fetchはResponseに解決されるPromiseを返す。
-
問344.WebSocketの暗号化された接続に用いるURLスキームはどれか。
- ア.wss://
- イ.ws://
- ウ.https://
- エ.sock://
正解:ア.wss://
解説:wss://が暗号化WebSocket。ws://は非暗号化である。
-
問345.CORSのプリフライトリクエストで使用されるHTTPメソッドはどれか。
- ア.OPTIONS
- イ.GET
- ウ.POST
- エ.HEAD
正解:ア.OPTIONS
解説:プリフライトはOPTIONSメソッドで送信される。
-
問346.IndexedDBでスキーマ(オブジェクトストア)を作成・変更するために利用するイベントはどれか。
- ア.onupgradeneeded
- イ.onsuccess
- ウ.onload
- エ.oncomplete
正解:ア.onupgradeneeded
解説:onupgradeneededはバージョン更新時に発火し、ストア作成を行う場所である。
-
問347.Responseオブジェクトのメソッドで、本文をJSONとして解析するものはどれか。
- ア.json()
- イ.parse()
- ウ.toJSON()
- エ.data()
正解:ア.json()
解説:json()が本文をJSONにパースしPromiseを返す。
-
問348.XMLHttpRequestのreadyStateで「リクエスト未初期化(open未実行)」を表す値はどれか。
- ア.0
- イ.1
- ウ.3
- エ.4
正解:ア.0
解説:readyState=0がUNSENT(未初期化)を表す。
-
問349.XMLHttpRequestで非同期通信を行う場合、open()の第3引数に指定する値はどれか。
- ア.true
- イ.false
- ウ.'async'
- エ.0
正解:ア.true
解説:第3引数trueで非同期、falseで同期となる(既定はtrue)。
-
問350.localStorage.setItem('count', 5); の後、localStorage.getItem('count') + 1 の結果はどれか。
- ア.6
- イ.'51'
- ウ.51(数値)
- エ.エラー
正解:イ.'51'
解説:保存値は文字列'5'になり、'5'+1は文字列連結で'51'となる。
-
問351.localStorageから1件のキーだけを削除するメソッドはどれか。
- ア.clear()
- イ.removeItem()
- ウ.delete()
- エ.unset()
正解:イ.removeItem()
解説:removeItem(key)が指定キーを削除する。clearは全件削除。
-
問352.WebSocketでサーバーからメッセージを受信したときに発火するイベントハンドラはどれか。
- ア.onreceive
- イ.onmessage
- ウ.onopen
- エ.ondata
正解:イ.onmessage
解説:onmessageが受信イベントのハンドラである。
-
問353.クロスオリジンアクセスを許可するためサーバーが返すレスポンスヘッダーはどれか。
- ア.X-Frame-Options
- イ.Access-Control-Allow-Origin
- ウ.Content-Security-Policy
- エ.Origin
正解:イ.Access-Control-Allow-Origin
解説:Access-Control-Allow-Originが許可オリジンを示す。
-
問354.Server-Sent Eventsの通信方向として正しいものはどれか。
- ア.双方向
- イ.サーバー→クライアントのみ
- ウ.クライアント→サーバーのみ
- エ.通信しない
正解:イ.サーバー→クライアントのみ
解説:SSEはサーバーからクライアントへの単方向プッシュである。
-
問355.Web Storageのオリジンあたりの保存容量の目安として一般的なものはどれか。
- ア.約4KB
- イ.約5MB
- ウ.約500MB
- エ.無制限
正解:イ.約5MB
解説:多くのブラウザで約5MBが目安とされる。
-
問356.次のコードで出力される内容として正しいものはどれか。 localStorage.setItem('x','hello'); console.log(localStorage.getItem('y'));
- ア.''(空文字)
- イ.null
- ウ.undefined
- エ.エラー
正解:イ.null
解説:存在しないキーyの取得はnullを返す。
-
問357.Server-Sent Eventsを開始するために生成するオブジェクトはどれか。
- ア.WebSocket
- イ.EventSource
- ウ.XMLHttpRequest
- エ.ServerEvent
正解:イ.EventSource
解説:new EventSource(url)でSSE接続を開始する。
-
問358.IndexedDBで書き込み(追加・更新)を行うトランザクションのモードはどれか。
- ア.readonly
- イ.versionchange
- ウ.readwrite
- エ.writeonly
正解:ウ.readwrite
解説:書き込みにはreadwriteモードが必要。readonlyは読み取り専用。
-
問359.fetchで取得したResponseが成功(HTTP 200番台)かどうかを判定する適切な方法はどれか。
- ア.catchで捕捉される
- イ.response.errorを見る
- ウ.response.okを確認する
- エ.fetchがfalseを返す
正解:ウ.response.okを確認する
解説:response.okで200番台かを判定できる。fetchはエラーステータスでrejectしない。
-
問360.サーバーからクライアントへの単方向プッシュを行い、自動再接続機能を持つAPIはどれか。
- ア.WebSocket
- イ.XMLHttpRequest
- ウ.Server-Sent Events
- エ.WebRTC
正解:ウ.Server-Sent Events
解説:Server-Sent Events(EventSource)が単方向プッシュと自動再接続を提供する。
-
問361.XMLHttpRequestでリクエストを送信するメソッドはどれか。
- ア.open()
- イ.start()
- ウ.send()
- エ.fetch()
正解:ウ.send()
解説:send()が実際の送信を行う。openは初期化のみ。
-
問362.IndexedDBで既存キーがあれば更新、なければ追加するメソッドはどれか。
- ア.add()
- イ.insert()
- ウ.put()
- エ.set()
正解:ウ.put()
解説:put()は更新も追加も行う。add()は既存キーでエラーになる。
-
問363.オリジンの構成要素として正しい組み合わせはどれか。
- ア.パス・クエリ・フラグメント
- イ.ドメイン・Cookie・パス
- ウ.スキーム・ホスト・ポート
- エ.ユーザー・パスワード・ホスト
正解:ウ.スキーム・ホスト・ポート
解説:オリジンはスキーム・ホスト・ポートで構成される。
-
問364.複数のタブ間でlocalStorageの変更を検知するために利用するイベントはどれか。
- ア.changeイベント
- イ.updateイベント
- ウ.storageイベント
- エ.syncイベント
正解:ウ.storageイベント
解説:storageイベントが他タブでの変更検知に使われる。
-
問365.sessionStorageの特徴として正しいものはどれか。
- ア.全タブで共有され永続
- イ.サーバーに自動送信される
- ウ.タブを閉じると破棄される
- エ.容量無制限
正解:ウ.タブを閉じると破棄される
解説:sessionStorageはタブ単位で、タブを閉じると消える。
-
問366.オブジェクトをlocalStorageに保存する際に必要な処理はどれか。
- ア.JSON.parse()
- イ.そのまま保存できる
- ウ.toStringは不要
- エ.JSON.stringify()
正解:エ.JSON.stringify()
解説:値は文字列のみ保存可能なのでJSON.stringifyで文字列化する。
-
問367.localStorageに数値を保存し取り出したときの型として正しいものはどれか。
- ア.number
- イ.object
- ウ.boolean
- エ.string
正解:エ.string
解説:値は文字列に変換されるため取り出すとstring型になる。
-
問368.WebSocketで接続を閉じるメソッドはどれか。
- ア.disconnect()
- イ.end()
- ウ.abort()
- エ.close()
正解:エ.close()
解説:close()メソッドがWebSocket接続を終了させる。
-
問369.IndexedDBで主キー以外のプロパティで検索できるようにする仕組みはどれか。
- ア.keyPath
- イ.cursor
- ウ.transaction
- エ.index
正解:エ.index
解説:createIndexで作るindexにより主キー以外で検索できる。
-
問370.fetchのレスポンスからHTTPステータスコードを取得するプロパティはどれか。
- ア.response.code
- イ.response.httpStatus
- ウ.response.state
- エ.response.status
正解:エ.response.status
解説:response.statusがHTTPステータスコードを返す。
-
問371.XMLHttpRequestでリクエストヘッダーを追加するメソッドはどれか。
- ア.setHeader()
- イ.addHeader()
- ウ.header()
- エ.setRequestHeader()
正解:エ.setRequestHeader()
解説:setRequestHeader()がリクエストヘッダーを設定する。
-
問372.次のコードの結果として正しいものはどれか。 localStorage.setItem('a','1'); localStorage.setItem('b','2'); localStorage.removeItem('a'); console.log(localStorage.length);
- ア.0
- イ.2
- ウ.undefined
- エ.1
正解:エ.1
解説:2件保存後にaを削除するため残りは1件、length=1。
-
問373.XMLHttpRequestでタイムアウト発生時に呼ばれるイベントハンドラはどれか。
- ア.onerror
- イ.onabort
- ウ.onload
- エ.ontimeout
正解:エ.ontimeout
解説:ontimeoutがtimeout超過時に呼ばれる。
-
問374.IndexedDBで複数レコードを順に走査するために用いるものはどれか。
- ア.index
- イ.keyPath
- ウ.transaction
- エ.cursor
正解:エ.cursor
解説:openCursorで取得するカーソルで順次走査する。
-
問375.IndexedDBのデータベースを開くために使うメソッドはどれか。
- ア.indexedDB.create()
- イ.indexedDB.connect()
- ウ.indexedDB.new()
- エ.indexedDB.open()
正解:エ.indexedDB.open()
解説:indexedDB.open(name, version)でデータベースを開く。