JavaScript

JavaScriptにおけるプリミティブ型とはJavaScriptには、undefined・null・boolean（真偽値）・string（文字列）・number（数値）の5つのプリミティブ型が存在します。これら以外の値は、すべてオブジェクトとして扱われます。boolean、string、numberの各プリミティブ型は、それぞれBoolean、String、Numberというコンストラクタから生成される「ラッパーオブジェクト」で包む（ラップする）ことが可能です。そして、ラッパーオブジェクトから元のプリミティブ値を取り出したい場合には、そのオブジェクトに対してvalueOf()メソッドを呼び

JavaScriptにおけるイベントフローは、主に次の3つの概念によって成り立っています。イベントターゲット（Event Target） … イベントが実際に発生したDOMオブジェクト。イベントバブリング（Event Bubbling） … 詳細は後述します。イベントキャプチャリング（Event Capturing） … 詳細は後述します。イベントバブリングとは、ある要素が別の要素の中に入れ子になっており、両方の要素に同じ種類のイベント（クリックなど）に対するリスナーが登録されている場合の、イベントハンドラーが呼び出される順序のことです。バブリングでは、イベントはまず最も内側の要素で受け取られ

ScreenオブジェクトとはJavaScriptにおける window.screen プロパティは、現在のウィンドウに関連付けられた screen オブジェクトへの参照を返します。screen オブジェクトは Screen インターフェースを実装した特殊なオブジェクトで、現在のウィンドウが表示されている画面（ディスプレイ）の情報を調査するためのものです。このオブジェクトには多数のプロパティが用意されており、ユーザーの画面サイズや色深度などの情報を取得できます。主なプロパティ一覧Screen.availTop永続的・半永続的なOSのUI要素（タスクバーなど）に割り当てられていない最初のピクセルの

プログラミング言語を問わず、メモリのライフサイクルはほぼ共通しており、次の3つの段階で構成されます。必要なメモリを割り当てる（アロケーション）割り当てられたメモリを使用する（読み書き）不要になったメモリを解放する言語による違い：明示的か暗黙的かこのうち2番目の「メモリの使用」は、すべての言語において開発者が明示的に行う必要があります。一方、1番目の「割り当て」と3番目の「解放」については、C言語のような低レベル言語では明示的に記述する必要がありますが、JavaScriptのような高レベル言語では主に暗黙的に処理されます。JavaScriptでは明示的なメモリ管理ができないそのため、JavaSc

プログラミング言語を問わず、メモリのライフサイクルはほぼ共通しており、次の3つの段階で構成されます。必要なメモリを割り当てる（アロケート）割り当てたメモリを使用する（読み取り・書き込み）不要になったメモリを解放するこのうち2番目の「使用する」段階は、すべての言語において開発者が明示的に行う必要があります。一方、1番目の「割り当て」と3番目の「解放」については、Cのような低レベル言語では開発者が明示的に制御しますが、JavaScriptのような高レベル言語ではほぼ暗黙的に処理されます。そのため、JavaScriptにはメモリを明示的に確保したり解放したりするための構文が存在しません。オブジェクト

JavaScriptでは、数値クラスが持つ toString メソッドを使うことで、10進数の数値を簡単に16進数の文字列へ変換できます。toString メソッドは基数（base）を引数として受け取るため、基数に「16」を指定すれば、その数値を16進数表記の文字列として取得できます。toStringメソッドで10進数から16進数へ変換する例console.log(Number(255).toString(16)) console.log(Number(17).toString(16))出力結果ff 11このように、255 は ff、17 は 11 という16進数の文字列に変換されます。par

URLを新しいタブで開くかどうかは、ブラウザの種類やユーザーのブラウザ設定によって決まります。そのため、コード側からリンクを厳密に「新しいタブ」で強制的に開くことはできません。 target=_blank 属性を使う方法 ただし、ユーザーの環境設定に応じて「新しいタブまたは新しいウィンドウ」で開かせたい場合は、アンカー（<a>）タグに target=_blank 属性を追加します。 <a href=https://example.com target=_blank>リンクテキスト</a> この属性を指定すると、ブラウザは現在のページをそのまま維持し、リンク

JavaScriptでfor...inによる配列の反復が推奨されない理由JavaScriptでは、for...inループを使って配列を反復処理することは避けるべきだとされています。その主な理由は、予期しない挙動を引き起こす可能性があるためです。具体的な例を見てみましょう。通常のforループを使用した場合まず、一般的なforループで配列を反復処理した例です。let arr = [] arr[4] = 5 for (let i = 0; i < arr.length; i++) {     console.log(arr[i]) }出力結果undefi

結論：標準関数は存在しないJavaScriptには、null・undefined・空文字（ブランク値）などを一括でチェックするための標準関数は用意されていません。その代わり、JavaScriptには「truthy（真とみなされる値）」と「falsy（偽とみなされる値）」という重要な概念があります。この仕組みを理解すれば、条件分岐による柔軟な値の判定が可能になります。truthyとfalsyとは何かif文などの条件式の中でtrueに変換（型強制）される値をtruthy、falseに変換される値をfalsyと呼びます。JavaScriptでは、ブール値以外の値も条件文の中で自動的にtrueかfal

キャメルケースとは？キャメルケース（camel case）とは、フレーズ内の各単語や略語の先頭を大文字で表記し、単語間にスペースや区切り文字を一切入れない書き方のことです。たとえば「Concurrent hash maps」という文字列をキャメルケースに変換すると、次のようになります。ConcurrentHashMapsこの形式は、JavaやJavaScriptなどのプログラミングにおいて、クラス名や変数名の命名規則として広く使われています。JavaScriptでキャメルケース変換を実装するJavaScriptでは、文字列を受け取ってキャメルケースに変換する関数を、以下のようにシンプルに実装で

GUID（Globally Unique Identifier）やUUID（Universally Unique Identifier）は、重複しない一意な識別子を生成するための128ビットの値です。データベースのレコードIDやセッション管理など、さまざまな場面で活用されます。ここでは、JavaScriptでUUID/GUIDを生成する主な方法を3つ紹介します。 1. Math.random()関数を使う方法 もっとも手軽なのは、Math.random()関数を利用する方法です。以下のコードでは、ランダムな16進数の文字列を「xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxx

JavaScriptで文字列の中に特定の文字が何回出現するかを調べる最もシンプルな方法は、文字列を1文字ずつ反復処理し、該当する文字が見つかるたびにカウントを増やしていくことです。 実装例 let s = "hello world!"; let searchChar = "l"; let count = 0; for(let i = 0; i < s.length; i++) {     if(s[i] == searchChar) {       

split()メソッドとはJavaScriptのsplit([separator, [limit]])メソッドは、文字列（Stringオブジェクト）を指定した区切り文字列（セパレータ）に基づいて複数の部分文字列に分割し、その結果を文字列の配列として返すメソッドです。CSV形式のデータ処理やユーザー入力の解析など、文字列を扱う場面で非常によく使われる基本的なメソッドの一つです。splitメソッドの基本的な使い方まずは、カンマで区切られた文字列を配列に変換する最も一般的な例を見てみましょう。let a = hello,hi,bonjour,namaste; let greetings = a.sp

JavaScriptのStringオブジェクトは、一連の文字（文字列）を扱うためのオブジェクトであり、文字列プリミティブ型に対して多数のヘルパーメソッドを提供しています。JavaScriptでは文字列プリミティブとStringオブジェクトの間で自動的に変換が行われるため、文字列プリミティブの値に対しても、Stringオブジェクトのヘルパーメソッドをそのまま呼び出すことができます。ここでは、JavaScriptの文字列で利用できる主なメソッドをご紹介します。主な文字列メソッドの一覧文字列の連結concat() ― 2つの文字列を結合し、新しい文字列を返します。文字列の検索indexOf() ―

JavaScriptには、「値が存在しないこと」を表す特別な値が2つあります。それが null と undefined です。この2つは似ているようでまったく性質の異なるものなので、それぞれの違いを理解し、適切に使い分けることが重要です。 undefined（未定義）とは 値が一度も代入されていない変数は undefined 型になります。また、評価しようとした変数に値が割り当てられていない場合や、関数が明示的に値を返さなかった場合にも、undefined が返されます。 サンプルコード let a; console.log(a); function b() {} console.log(

はじめに：非同期処理の結果を受け取るには？JavaScriptには、非同期呼び出しから応答（結果）を受け取る方法が複数存在します。まず、問題の本質を整理してみましょう。たとえば、fooという非同期関数があり、しばらく時間が経ってからデータを返すとします。このとき、結果を受け取る方法は主に2つあります。コールバック方式： 準備ができた時点で実行されるコールバック関数を引数として渡すPromise方式： 非同期処理の完了を表すPromiseオブジェクトを返す方法1：コールバック関数を使う例として、setTimeout関数はコールバックを受け取り、指定した時間の経過後にそれを実行します。コールバック

Promiseが確定（settle）したとき、つまり履行（fulfilled）または拒否（rejected）のいずれかになったときに、finally()メソッドに指定されたコールバック関数が呼び出されます。また、finally()メソッド自体も新しいPromiseを返します。 この仕組みにより、Promiseが成功したか失敗したかにかかわらず、処理が完了した後に必ず実行したいコードを簡潔に記述できます。それでは、具体的な例を見ていきましょう。 例1：Promiseが成功する場合 new Promise(    (resolve) => setTimeout(reso

JavaScriptで配列に要素を追加する場合、挿入する位置によって使い分けられる便利なメソッドが3つあります。 push()：配列の末尾に要素を追加する unshift()：配列の先頭に要素を追加する splice()：配列の任意のインデックス（途中の位置）に要素を挿入する それぞれのメソッドについて、具体的なコード例を見ていきましょう。 1. push() — 配列の末尾に追加する push() メソッドは、引数に渡した要素を配列の最後尾に追加します。複数の要素を一度に渡すことも可能です。 コード例 let arr = [test, 1, 2, hello, 23.5]; arr.pu

JavaScriptでは、オブジェクトや配列の中に特定のキーや値が存在するかどうかを確認する方法がいくつかあります。まずはオブジェクトの場合から見ていきましょう。in演算子を使ってオブジェクトのキーを確認するオブジェクトに特定のキーが存在するかどうかを調べるには、in 演算子を使用します。例let obj = { name: John, age: 22 } console.log(name in obj); console.log(address in obj);出力結果true false注意： in 演算子は、指定されたプロパティがそのオブジェクト自身、またはプロトタイプチ

JSONとは「JavaScript Object Notation（JavaScriptオブジェクト表記）」の略です。そのため、JSON.stringify()には整形表示（pretty-print）機能が標準で組み込まれています。第3引数にインデントとして使用するスペースの数を指定するだけで、読みやすい形式で出力できます。 例：JavaScriptオブジェクトを整形表示する let a = { name: A, age: 35, address: { street: 32, Baker Street, city: Chicago