JavaScript

 Computer >> コンピューター >  >> プログラミング >> JavaScript
  1. JavaScriptで指定した間隔ごとにマウスの位置をキャプチャする方法【サンプルコード解説】

    Webアプリケーション開発では、一定間隔でマウスカーソルの現在位置（座標）を取得したいケースがあります。例えば、トラッキングツールやインタラクティブなアニメーション、ユーザー行動の分析などが挙げられます。本記事では、setInterval() を使って、指定した間隔（この例では3秒）ごとにマウスの位置を自動的にキャプチャして画面に表示するJavaScriptの実装方法を紹介します。実装のポイントこのサンプルでは、以下の仕組みを使っています。mousemoveイベント：document.bodyにリスナーを登録し、マウスが動くたびに最新のX・Y座標を変数に保存します。clientX / clie

  2. JavaScriptで特定の年がうるう年かどうかを判定するプログラムの作成方法

    JavaScriptで特定の年がうるう年かどうかを確認する方法 JavaScriptである年がうるう年かどうかを判定するには、その年を「4」で割った余りが0になるかどうかを調べます。ここでは、ユーザーが入力した年をもとに、うるう年かどうかを判定するシンプルなプログラムを紹介します。 サンプルコード <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" conten

  3. JavaScriptのarray.toLocaleString()関数の使い方｜配列をロケール形式の文字列に変換する方法

    array.toLocaleString()関数とはJavaScriptのarray.toLocaleString()関数は、配列の要素を文字列として返し、各要素をカンマなどロケール固有の区切り文字で連結します。引数としてロケール（言語タグ）を指定することもでき、指定した言語・地域の書式に従って文字列へ変換されます。例えば、日付オブジェクトが含まれる配列に対してこの関数を使用すると、「en-GB」や「ja-JP」などのロケールに応じた形式で日付が表示されます。ロケールを省略した場合は、実行環境のデフォルトのロケールが使用されます。主な特徴配列のすべての要素を文字列化し、区切り文字で連結して返す

  4. JavaScriptのArray.values()メソッドとは？使い方とサンプルコードを徹底解説

    JavaScriptのArray.values()メソッドとは？ JavaScriptのArray.values()メソッドは、対象の配列に含まれるすべての値を格納したイテレーターオブジェクトを返します。ES2015（ES6）以降で利用可能なこのメソッドは、for...ofループやスプレッド構文（[...arr]）と組み合わせることで、配列の各要素を効率的に取り出せます。 なお、keys()やentries()がインデックス情報も一緒に返すのに対し、values()は純粋に「値」だけを順番に提供する点が大きな特徴です。 基本構文 arr.values() 引数は不要で、戻り値として新しいArr

  5. JavaScriptのArrayBufferオブジェクトとは？基本的な使い方を解説

    JavaScriptのArrayBufferオブジェクトは、汎用的で固定長の生（ロー）バイナリデータバッファを表現するために使用されます。ArrayBufferの内容には直接アクセスして操作することができないため、データを読み書きするにはDataViewオブジェクトを作成する必要があります。DataViewを介することで、バッファ内のデータの読み取りと書き込みの両方が可能になります。 ArrayBufferは、ファイル操作やネットワーク通信（WebSocketでのバイナリ送受信）、WebGLによる画像処理など、バイナリデータを扱うさまざまな場面で活用されています。 構文 new ArrayBu

  6. JavaScriptでさまざまな日付形式を扱う方法｜サンプルコード付きで解説

    JavaScriptで日付を扱う際は、組み込みのDateオブジェクトを使用します。Dateコンストラクタにさまざまな形式の文字列を渡すことで、それぞれの形式に応じた日付オブジェクトを生成できます。ここでは、複数の日付形式を実際にページへ表示するサンプルコードを紹介します。コード例<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="wi

  7. JavaScriptのArrayBuffer.byteLengthプロパティとは？使い方をサンプルコードで解説

    ArrayBuffer.byteLengthプロパティは、ArrayBufferオブジェクトが確保しているメモリのサイズをバイト単位で返す読み取り専用のプロパティです。バッファーにどれだけのデータを格納できるかを確認したい場合に便利で、一度作成したArrayBufferのサイズは後から変更できないため、このプロパティで取得できる値は固定となります。 構文 arraybuffer.byteLength 戻り値 ArrayBufferのサイズを表す数値（バイト数）を返します。 サンプルコード 以下は、ArrayBuffer.byteLengthプロパティを使ってバッファーのサイズを画面に表示する

  8. JavaScriptのArrayBuffer.isView()メソッドとは？使い方をサンプルコードで解説

    ArrayBuffer.isView()メソッドとは ArrayBuffer.isView()は、引数として渡された値がArrayBufferのビュー（TypedArrayやDataViewなど）であるかどうかを判定する静的メソッドです。判定結果はブール値（true / false）として返されます。 JavaScriptでは、ArrayBufferは生のバイナリデータを格納するための領域ですが、その内容に直接アクセスすることはできません。そこで、DataViewやInt8Array、Uint16Arrayなどの「ビュー」オブジェクトを通じてデータを読み書きします。このメソッドを使えば、あるオ

  9. JavaScript RegExp test()メソッドとは？文字列マッチ判定の使い方を解説

    RegExpオブジェクトのtest()メソッドは、指定した文字列の中に正規表現パターンと一致する部分（マッチ）が存在するかどうかを調べるためのメソッドです。マッチが見つかった場合は true を返し、見つからなかった場合は false を返します。このシンプルな仕組みにより、文字列の検証や条件分岐を手軽に行うことができます。基本的な構文regex.test(str)引数： 検索対象となる文字列を指定します。戻り値： マッチすれば true、しなければ false。実装例以下は、RegExp test()メソッドを使った具体的なコード例です。ボタンをクリックすると、表示中の文字列に「fox」とい

  10. 【初心者向け】JavaScriptのRegExp toString()メソッドで正規表現を文字列として取得する方法

    RegExp toString()メソッドとは JavaScriptのRegExp toString()メソッドは、正規表現オブジェクト（RegExpオブジェクト）の文字列値を返すためのメソッドです。このメソッドを呼び出すと、パターンとフラグを含んだ正規表現リテラル形式（例： /fox/g）の文字列が取得できます。 デバッグ時や、正規表現の内容を画面に表示して確認したい場合などに便利なメソッドです。 以下は、RegExp toString()メソッドを使用した具体的なコード例です。 サンプルコード <!DOCTYPE html> <html lang="ja&qu

  11. JavaScriptのDate.@@toPrimitive()関数とは？日付オブジェクトをプリミティブ値に変換する方法

    JavaScriptのDate.@@toPrimitive()関数は、Dateオブジェクトをプリミティブ値に変換するために使用されます。このメソッドはSymbol.toPrimitiveプロパティを通じて呼び出され、引数に指定したヒント（hint）に応じて、文字列や数値など適切なプリミティブ値を返します。 ヒントの種類と戻り値 「default」：日付を表す文字列が返されます。 「number」：1970年1月1日00:00:00 UTCからの経過ミリ秒数（タイムスタンプ）が数値で返されます。 「string」：「default」と同様に、日付を表す文字列が返されます。 サンプルコード 以

  12. JavaScriptでモバイルブラウザを検出する方法【サンプルコード付き】

    WebサイトやWebアプリを開発していると、アクセスしてきたユーザーがスマートフォンやタブレットといったモバイルデバイスを使っているのか、それともPCから閲覧しているのかを判別したい場面があります。JavaScriptでは、navigator.userAgent(ユーザーエージェント)と正規表現を組み合わせることで、モバイルブラウザを簡単に検出できます。 モバイルブラウザ検出の仕組み すべてのブラウザは、自分自身の情報を「ユーザーエージェント(UA)」という文字列として持っています。この文字列にはOSやデバイスの種類に関する情報が含まれるため、「iPhone」「iPad」「iPod」「Andr

  13. JavaScriptで押された矢印キーを検出する方法【初心者向けサンプルコード付き】

    JavaScriptで押された矢印キー（方向キー）を検出するには、keydownイベントを利用します。キーボードのキーが押されるたびに発生するこのイベントのkeyCodeプロパティを参照することで、どの矢印キーが押されたのかを簡単に判別できます。 矢印キーに対応するkeyCodeの値は以下のとおりです。 37：左矢印キー 38：上矢印キー 39：右矢印キー 40：下矢印キー サンプルコード <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8&quo

  14. JavaScriptのダイアログボックス3種類（alert・confirm・prompt）の使い方

    JavaScriptのダイアログボックスとは？ JavaScriptには、ブラウザに標準で組み込まれた3種類のダイアログボックスが用意されています。これらを活用することで、ユーザーへの警告表示、操作前の確認、簡単なテキスト入力の受け付けなどを、追加ライブラリなしで実現できます。 この記事では、それぞれのダイアログボックスの特徴と使い方を、サンプルコードと実行結果をもとに順番に解説していきます。 1. alert：警告・通知を表示する メッセージと「OK」ボタンのみを表示する、最もシンプルなダイアログです。処理完了の通知やエラーの告知などに適しています。 2. confirm：処理の確認を行う

  15. JavaScriptのFile.sizeプロパティとは？Web APIでファイルサイズを取得する方法

    File.sizeプロパティとは JavaScriptのFile.sizeプロパティは、File Web APIに含まれる読み取り専用のプロパティで、選択されたファイルのサイズをバイト単位で返します。 ユーザーが要素やドラッグ＆ドロップでアップロードしたファイルに対して使用でき、ファイルサイズのバリデーション（例：アップロード容量の上限チェック）などに活用できます。 基本構文 file.size; 戻り値は64ビット整数（バイト数）として返されます。空のファイルの場合は「0」が返ります。 実装サンプルコード 以下は、ファイルを選択するとそのファイル名とサイズ（バイト数）を画面に表示するシンプル

  16. JavaScript Web APIのFile.typeプロパティとは？ファイルのMIMEタイプを取得する方法

    JavaScriptのWeb APIに含まれるFile.typeプロパティは、対象となるファイルのメディアタイプ（MIMEタイプ）を示す文字列を返します。本記事では、File.typeプロパティの基本から実際の使い方まで、サンプルコードと実行結果をもとにわかりやすく解説します。 File.typeプロパティの基本 File.typeプロパティは、<input type=file>などでユーザーが選択したファイルの種類を「image/jpeg」「text/plain」「application/pdf」といった形式の文字列として取得できる、読み取り専用のプロパティです。 戻り値：

  17. JavaScript の ArrayBuffer.slice() メソッドの使い方を解説

    JavaScript の arrayBuffer.slice() メソッドは、既存の ArrayBuffer の一部をコピーして、新しい ArrayBuffer オブジェクトを返すメソッドです。コピー範囲は「開始位置（begin）」から「終了位置（end）」までで、開始位置は含まれ、終了位置は含まれません（begin 以上 end 未満）。基本構文arrayBuffer.slice(begin, end)begin：コピーを開始するインデックス（この位置は含まれます）。負の値を指定すると、バッファ末尾からの相対位置として扱われます。end：コピーを終了するインデックス（この位置自体は含まれませ

  18. JavaScriptの基本配列メソッド解説！push・pop・shift・unshift・spliceの使い方を実例付きで紹介

    JavaScriptには、配列を操作するための便利な組み込みメソッドが数多く用意されています。その中でも特によく使われるのが、要素の追加や削除を行う以下の5つの基本メソッドです。 JavaScriptの主要な配列メソッド一覧 メソッド説明 Array.push()配列の末尾に要素を追加します。 Array.pop()配列の末尾から要素を取り除きます。 Array.unshift()配列の先頭に要素を追加します。 Array.shift()配列の先頭から要素を取り除きます。 Array.splice()配列内の任意の位置で要素の追加・削除を行います。 これらのメソッドは、配列の

  19. JavaScriptのBOM（window.screen）でユーザーの画面情報を取得する方法

    JavaScriptのBOM（Browser Object Model）には、ブラウザウィンドウやユーザー環境の情報を扱うためのさまざまなオブジェクトが用意されています。その中でもwindow.screenオブジェクトは、クライアント（ユーザー）の画面に関する情報を取得するために使用され、画面の幅・高さや色深度などをプログラムから参照できます。レスポンシブ対応やデバイスごとの表示最適化などにも役立ちます。 window.screenの主なプロパティ一覧 プロパティ説明 screen.widthユーザーの画面の幅をピクセル単位で返します。 screen.heightユーザーの画面の高さを

  20. JavaScriptのprompt()メソッドとは？使い方とサンプルコードをわかりやすく解説

    prompt()メソッドによるダイアログボックスは、テキスト入力欄をポップアップ表示してユーザーから入力を受け取りたい場合に非常に便利な機能です。これにより、Webページ上でユーザーとの対話的なやり取りが可能になります。ユーザーは表示された入力欄に文字を入力し、「OK」ボタンをクリックすることで値を送信できます。 このダイアログボックスは、JavaScriptのprompt()メソッドを呼び出すことで表示されます。戻り値としてユーザーが入力した文字列が返され、キャンセルボタンが押された場合はnullが返される点がポイントです。 サンプルコード 以下は、JavaScriptでプロンプトダイアログ

Total 5937 -コンピューター  FirstPage PreviousPage NextPage LastPage CurrentPage:151/297  20-コンピューター/Page Goto:1 145 146 147 148 149 150 151 152 153 154 155 156 157