2015-01-01から1年間の記事一覧

LocationオブジェクトとHistoryオブジェクト

WebページのURL情報(Location) Locationオブジェクトは、WebページのURLを情報としてもつオブジェクトです hrefプロパティの値を変更することで、別のWebページへ移動できます location.href = 移動先URL; <html lang="ja"> <head> <meta charset="utf-8"> <title>JavaScriptの練習</title> </head> <body> <h1>現在のページ</h1> <p></p></body></html>

ブラウザオブジェクト

ブラウザオブジェクトとは ブラウザオブジェクトは、ブラウザに組み込まれているオブジェクトです ブラウザ上の情報は、すべてオブジェクトとして扱うことができます これらのオブジェクトを総称して「ブラウザオブジェクト」と呼びます 《主なブラウザオブ…

チェックテスト(5)

Q1 以下はイベントに関する説明です空欄を埋めなさい Webページ上でボタンのクリックなどのイベントが起こると、(A)がイベントの発生を検知し、関連付けられた任意の処理を呼び出す。 このような仕組みを(B)と呼ぶ。 Q2 onloadイベントハンドラは、一般的…

チェックテスト(4)

Q1 以下のオブジェクトが持つメソッドを実行するときには、どのような命令を記述しますか? <script> var obj = { x: function() { console.log( 'こんにちは' );} }; </script> Q2 メソッドの中で記述すると、オブジェクト自身を表すキーワードはなんですか? Q3 配列はなん…

連想配列の利用

連想配列 配列の場合「0」から始まる添字で要素を指定しましたが意味的な関連性はありません その添字の代わりに、「キー」と呼ばれる文字列で要素を指定します 連想配列は、「Objectオブジェクト」というオブジェクトとして扱います 連想配列の生成 new演…

配列を操作する

Arrayオブジェクトのメソッド 配列は、Arrayオブジェクトのインスタンスです 配列をオブジェクトとして扱うと、あらかじめ用意された便利なメソッドを利用できます 要素を joinメソッドで連結 要素の増減にかかわらず、そのまま連結して表示します <html lang="ja"> <head> <meta charset="UTF-8"> <title>Array</title></meta></head></html>…

配列の添字を活用する

曜日を日本語で表示する 曜日の文字列は、「days配列」に格納しておきます <script> var days = new Array('日', '月' ,'火', '水', '木', '金', '土'); </script> Dateオブジェクトを作成 曜日は、getDayメソッドを利用する1 getDayメソッドの戻り値は「日曜日〜土曜日」を「…

Arrayオブジェクト

配列とは リストのこと いくつかの情報を番号と一緒に保管するためのもの 「配列」とは、添字(そえじ)と呼ばれる番号を用いて、1つの変数名で複数のデータをまとめて管理できるようにしたもの 配列 - マンガで分かる JavaScriptプログラミング講座 配列は…

random関数

乱数の発生 「random()」は、「0以上1未満の乱数を生成する」メソッド 「floor()」は、「小数点以下を切り捨てる」メソッド ランダムな「整数」を生成する rnd = Math.floor(Math.random() * (MAX + 1)); <html lang="ja"> <head> <meta charset="UTF-8"> <title>乱数の発生</title> </head> <body> <h1>乱数の発生</h1> <script> MAX = 10; var num; </body></html>…

Mathオブジェクト

Mathオブジェクト Mathとは「数学(Mathematics)」の意味 数値演算に便利なメソッドやプロパティが利用できるオブジェクト まえもってインスタンスを生成する必要はありません スタティックメソッド(インスタンスを生成しないで関数のように使用できる) M…

Dateオブジェクト - 状況に応じた処理

Dateオブジェクト JavaScriptに用意されている組み込みオブジェクト Dateコンストラクタを引数なしで実行すると、現在の日付時刻を管理する「Dateオブジェクト」が生成される 現在の日付時刻を管理するDateオブジェクトを生成 指定した時点で日付時刻を管理…

組み込みオブジェクト

組み込みオブジェクトとは 関数と同じくオブジェクトの場合も、JavaScriptがあらかじめ用意しているオブジェクトがあります これを「組み込みオブジェクト」と呼びます 《主な組み込みオブジェクト一覧》 オブジェクト名 説明 Object すべてのオブジェクトの…

オブジェクト・メソッド・プロパティ

オブジェクトとは オブジェクトというモノ 文字列や数値、関数などJavaScriptで扱うデータは、すべてオブジェクトです オブジェクトは「プロパティ」と「メソッド」を持っている JavaScriptのオブジェクトとは、キーと値の集合体のことです 連想配列は、オブ…

チェックテスト(3)

関数まとめ クリックなどのイベント処理は、functionに書く functionは、呼び出さなければ動作しない 似たような処理は引数を使って、同じfunctionにまとめる 引数はなくてもよい、必要ならいくつでも指定できる ブラウザの構造 通信ソフトウエア レンダリン…

関数の応用

関数の代入と匿名関数 関数は、数値や文字列のように変数に入れて扱うことができます この方法を使うと、条件に応じて異なる関数を変数に設定したり、関数を引数として別の関数に渡したりと、より柔軟に関数を利用できます 変数名 = 定義済みの関数名; 《関…

変数のスコープ

スコープとは 変数には、スコープ(有効範囲)が設定されています スコープは、その変数がスクリプト中のどこからどこまでの範囲で利用できるかを表します 《JavaScriptのスコープ》 種類 説明 対象 グローバルスコープ スクリプト全体で変数を参照できる ・…

組み込み関数

組み込み関数とは JavaScriptがすでに備えている関数 《組み込み関数一覧》 関数名 説明 parseInt 文字列型の数字列を数値型(整数)に変換する parseFloat 文字列型の数字列を数値型(実数)に変換する isNaN 指定された値がNaNであるかどうか調べる encode…

関数

関数とは 一連の処理をひとまとめにして、名前をつけたものを「関数」と呼びます 手間のかかる処理を関数として定義しておけば、必要なときに何度も呼び出すことができます 関数は処理の材料となる「引数」を受け取ります 処理が終了すると「戻り値」と呼ば…

チェックテスト(2)

Q1 以下のスクリプトで実行をすると、どのような結果が表示されますか? <script> var x = 'ABC'; if (x != 'ABC') { console.log('OK'); } else { console.log('NG'); } </script> Q2 以下のスクリプトで実行をすると、どのような結果が表示されますか? <script> var x = 10; if (x </script>…

繰り返しの制御

繰り返しの中のbreak文 switch文でのbreak文は、ブロックの外へ抜けるための構文でした break文をwhile文やfor文のブロック内に記述することで、継続条件式がtrueであっても強制的にブロックの外へ抜けることができます 《for文とbreak文》 <html lang="ja"> <head> <meta charset="utf-8"> <title>for文とbreak</title></meta></head></html>…

指定した回数だけ処理を繰り返す - for文

for文 指定した回数だけ処理を繰り返す 変数「i」の初期値(「i」は、indexの意) 処理を1回実行するたびに、変数「i」の値をどのように変更するか for ( 変数の初期値; 繰り返し条件; 変数の変更 ) { 実行される処理 } 変数の値を1ずつ増やす演算子 「+…

while文

while文とは 反復処理(繰り返し)を行います 同じ事を繰り返すことを「ループ」と呼びます while文は繰り返し回数が決まっていない場合に使われる場合が多い 変数の初期値; while ( 繰り返し条件; ) { 実行される処理 変数の変更 ; } 継続条件式には、if…

チェックテスト(1)

演習課題 Q1 同一ディレクトリ内のJavaScriptファイル「sample.js」をHTMLファイルに読み込むには、どのように記述すればよいか書きなさい Q2 以下のスクリプトを実行した結果、コンソールに表示される値はなんですか? <script> var x = 10, y = 20; x = y; y = x; </script>…

連想配列の基礎

連想配列とは 連想配列は、数値の代わりに意味のある文字列をインデックスとすることで、各要素を識別しやすくすることができます 連想配列の場合、インデックスのことを「キー」と呼びます 連想配列の宣言と初期化 連想配列の要素は、キーと値のセットで1…

配列の基礎

配列とは 配列とは、同じ用途で用いる複数の変数を1つにまとめたもの 配列は要素の集合体 配列は変数の集まりによって構成されます 個々の変数のことを「要素」と呼びます 各要素を識別するために「インデックス」と呼ばれる番号(0から始まる整数値)が割…

確認テスト(1)

JavaScript基礎まとめ ステートメント(命令文)の終わりはセミコロン「;」 ステートメントは、上から順に実行される 命令に与える値を、引数(ひきすう)という 文字列と数値の扱いの違いに注意する メソッドはオブジェクトに対する処理 メソッドは、「オ…

イベント発生元の特定

thisキーワードの利用 1つの関数を複数のイベントから呼び出すとき、呼び出された関数内でどの部品から発生したイベントなのかを知りたい場合があります そのようなときには、thisキーワードを利用します イベントハンドラに関連づけた処理の中で、thisキー…

イベント駆動型モデル

イベントとは 何かのきっかけで処理を行うことを「イベント」と呼びます イベントが発生したときに対応する処理を呼び出す仕組みを「イベント駆動型モデル」と呼びます それぞれのイベントと任意の処理をあらかじめ関連付けておくと、「イベントハンドラ」と…

条件分岐 - switch文

switchとは if文と同様に分岐処理を行います if文を簡略化してよりすっきり記述するための構文です ある変数の中身が一致するかという判断を行います switch(変数) { case 値1: 変数の中身が値1に一致した場合の処理 case 値2: 変数の中身が値2に一致した…

条件分岐 - if文

スクリプトには3通りの進み方がある(実行する流れ) 順次 分岐 反復 if文 条件によって、ある処理を実行するかしないか選択して、処理の流れを分岐させたいときに使う構文 条件がtrueのときは処理を実行する 条件が成り立たないとき(falseのとき)は、処…