とあるコアJavaScriptの算譜基礎
JavaScriptの基本的なことを解説するコンテンツです
第１回 JavaScriptとは何か
JavaScriptを学習中なのでせっかくだから、コンテンツを立ち上げてみました。 学習中というのもあるので、誤った情報があるかもしれません。 誤り等がありましたら、コメントなどを頂けると幸いです。 定番すぎますが、まずは、JavaScriptとは何なのか説明をします。 目次 [1] JavaScriptとは何か [2] JavaScriptのよくある勘違い [3] JavaScriptの特徴 ...
第２回 JavaScriptの環境設定
プログラミング言語を使用する上で必要なのは環境設定です。 JavaScriptでは他の言語に比べて特に知識がなくても準備が可能です。 そもそも設定すら必要はありません。 目次 [1] 開発環境の設定について [2] 実行環境の設定について [3] エラーを確認する設定をする [4] 更新履歴 [1] 開発環境の設定について JavaScriptの開発環境は特にインストールなどしなくても可能です。...
第３回 JavaScriptを書いてみる
JavaScriptの最も基本的な文法について説明をします。 C言語でいう、最初に学ぶHello Worldみたいなプログラムです。 JavaScriptプログラムの基本となりますので確実に抑えておくポイントになります。 目次 [1] 最も簡単なプログラム [2] 画面に出力する [3] JavaScriptプログラムの注意点 [4] 更新履歴 [1] 最も簡単なプログラム C言語でいうHel...
第４回 JavaScriptの変数
プログラムでまず、重要なのは変数です。 この回では、まず基本的な変数について説明をします。 変数というものは、データを入れる入れもののようなものと解釈すればよいです。 目次 [1] 変数はvar宣言する [2] 変数には型がない [3] 変数の宣言の仕方はいろいろある [4] 変数はどこでも宣言できる [5] 変数の命名規則 [6] 更新履歴 [1] 変数を宣言する 変数はデータを格納する入れ物...
第５回 JavaScriptのコメント
コメントは、プログラムを読みやすくするときに使用したり 一度記述したソースコードを残すために使用したりと様々な用途があります コメントの書き方は様々ありますので抑えておきましょう 目次 [1] 単一行コメント [2] 複数行コメント [3] 更新履歴 [1] 単一行コメント // これはコメントです。 この方法を使用すると行末までコメントとします。 // 以降がコメントになります [2] 複数行...
第６回 データ型
JavaScriptの変数には様々な値を設定して使用できます。 データ型とは、変数に格納できるデータの種類のことをいいます。 JavaScriptで使用できるデータの種類は２つあります。基本型と参照型です。 JavaScriptを始めたころですと、意味がわからないと思うので、２種類あると理解しておけばよいです。 目次 [1] 基本型 [2] 参照型 [3] 基本型と参照型の違い [4] 更新履歴...
第７回 オブジェクトの基礎
オブジェクトも変数の一種です。 オブジェクトとは、名前の付けられた値を集めたものです。 オブジェクトはプロパティとメソッドを持ちます。 プロパティはオブジェクトが持つ値のこと、メソッドは、オブジェクトを操作するもののことです ここでは、オブジェクトに関する基本的なことについて説明をします。 目次 [1] オブジェクトの作成方法 [2] プロパティの使用方法 [3] メソッドの使用方法 [4] 組...
第８回 配列
配列とは、名前の付けられたデータの集合です。 配列では、ひとつの変数に対して複数の値を設定することができます。 目次 [1] 配列の作成方法 [2] 配列の使用方法 [3] 更新履歴 [1] 配列の作成方法 配列を生成する方法には様々な方法があります。 プログラムを見てください。 // 空の配列を生成 var array1 = new Array(); // 10個の要素を持つ配列を生成 va...
第９回 算術演算子
算術演算子は計算に関する演算子です。 演算子について使用時の注意点がありましたら、補足します。 目次 [1] 加算演算子(+) [2] 減算演算子(-) [3] 乗算演算子(*) [4] 除算演算子(/) [5] 剰余演算子(%) [6] インクリメント演算子(++) [7] デクリメント演算子(--) [8] 更新履歴 [1] 加算演算子(+) +の演算子を使うと、足し算の計算を行います。 ...
第１０回 比較演算子
比較演算子は左辺と右辺を比較した結果を返す演算子です。 比較演算子は、条件文や繰り返し文で使用します。 演算子について気をつけないといけないところは補足します。 目次 [1] 等値演算子(==) [2] 不等演算子(!=) [3] 小なり演算子( [4] 大なり演算子(>) [5] 小なりイコール演算子( [6] 大なりイコール演算子(>=) [7] 同値演算子(===) [8] 非同値演算...
第１１回 論理演算子
論理演算子は論理型で使用される演算子です。 プログラムでは、比較演算子と組み合わせて使用されるのが一般的です。 その場合に複数の条件を満たしたときなどの条件になります。 目次 [1] 論理積演算子(&&) [2] 論理和演算子(||) [3] 論理否定演算子(!) [4] 更新履歴 [1] 論理積演算子(&&) 複数の式がtrueの場合にtrueを返します var a = 10; var b =...
第１２回 ビット演算子
ビット演算子は整数値を２進数にして論理演算結果を返す演算子です。 目次 [1] ビット積演算子(&) [2] ビット和演算子(|) [3] ビット排他論理和演算子(^) [4] ビット否定演算子(~) [5] 左シフト演算子( [6] 符号付き右シフト演算子(>>) [7] 符号なし右シフト演算子(>>>) [8] 更新履歴 [1] ビット積演算子(&) 比較したデータの各桁のビットが1のとき...
第１３回 代入演算子
代入演算子は変数に値を格納したりします。 また、算術演算子やビット演算子等を組み合わせた演算子もあります。 たとえば、足し算をしてから代入するなどの処理ができます 目次 [1] 代入演算子(=) [2] 加算代入演算子(-=) [3] 減算代入演算子(-=) [4] 乗算代入演算子(*=) [5] 除算代入演算子(/=) [6] 剰余代入演算子(%=) [7] 左シフト代入演算子( [8] 右シ...
第１４回 特殊な演算子
この回ではJavaScriptの特殊な演算子の説明をします。 特殊な演算子は算術演算子、比較演算子、代入演算子などに分類できない演算子です。 目次 [1] カンマ(,)演算子 [2] delete演算子 [3] instanceof演算子 [4] new演算子 [5] typeof演算子 [6] void演算子 [7] in演算子 [8] 更新履歴 [1] カンマ(,)演算子 まとめて変数の宣...
第１５回 if文
ここでは、JavaScriptで使用できる分岐命令について解説します。 分岐命令の基本はif文です。if文は「もし～だったら～～する」という意味のプログラムです。 条件に該当した場合、対象となるプログラムが実行されます。 if文は書き方によっては実行されない場合もあるので注意してください。 目次 [1] if文の構文 [2] ２分岐の方法(if文～else文) [3] 多分岐の方法(if～els...
第１６回 switch文
ここでは、JavaScriptで使用できる分岐命令について解説します。 if文でも様々な条件を記述することはできました。しかし、毎回条件式を書く必要がありました。 特定の条件に限り、このswitch文を使用したほうが簡潔に書くことができます。 switch文はbreakと組み合わせて使用します。 目次 [1] switch文の構文 [2] switch文のプログラム(breakあり) [3] s...
第１７回 for文
ここでは、JavaScriptの繰り返し文について説明をします。 繰り返し文も何種類がありますが、for文は指定した回数だけ処理するのに便利な機能です。 配列を操作したり、オブジェクトを操作するときに有効に使用できます。 JavaScriptのfor文には2種類あります。 目次 [1] for文の構文 [2] for～in文の構文 [3] 更新履歴 [1] for文の構文 初期化された値からルー...
第１８回 while文
ここでは、JavaScriptの繰り返し文について説明をします。 繰り返し文も何種類がありますが、while文は指定した回数がわからない時に処理するのに便利な機能です。 JavaScriptのwhile文は2種類あります。 目次 [1] while文の構文 [2] do～while文の構文 [3] 2つのwhileの違い [4] 更新履歴 [1] while文の構文 条件式が満たされるまでループ...
第１９回 break文
ここでは、JavaScriptの繰り返し文やswitch文で使用するちょっと特殊な構文を説明します。 繰り返し文は指定した回数が満たすまで実行されますが、意図的にとめたい場合があると思います。 たとえば、配列の中から探したいデータを発見したときなどです。 目次 [1] break文の構文 [2] ラベル付break文の構文 [3] 更新履歴 [1] break文の構文 ループ文などで意図的に中断...
第２０回 continue文
ここでは、JavaScriptの繰り返し文やswitch文で使用するちょっと特殊な構文を説明します。 繰り返し文は指定した回数が満たすまで実行されますが、特定条件を無視したとき時があると思います。 目次 [1] continue文の構文 [2] ラベル付continue文の構文 [3] 更新履歴 [1] continue文の構文 ループ文などで意図的に中断します。 continue; var...
第２１回 try～catch～finally文
エラーが発生したとしてもスクリプト全体がとまってもらっては困ることがあります。 ここでは、そういう種類のエラー(例外)に対する強化を行います。 目次 [1] try～catch～finally文 [2] throw文 [3] 更新履歴 [1] try～catch～finally文 例外処理の基本文法を説明します。 try { 例外が発生する可能性があるプログラム }cat...
第２２回 with文
制御構文の中でも特殊はwith文を説明したいと思います。 目次 [1] with文の構文 [2] with文は実用性があるのか [3] 更新履歴 [1] with文の構文 オブジェクトを省略して記述することができる構文です。 with(オブジェクト){ ここに処理を記述する } // オブジェクトを生成 var obj = {x:10,y:20,z:"ほぷしぃ"}; //...
第２３回 正規表現
ここでは、正規表現について説明をします。 目次 [1] 正規表現の基礎 [2] 文字関係の正規表現 [3] 繰り返しの正規表現 [4] 正規表現のオプション [5] その他の正規表現 [6] 複雑な正規表現 [7] 更新履歴 [1] 正規表現の基礎 あいまいな文字列パターンを表現できる機能です。 正規表現の基本的な構文を説明します。 正規表現を利用する際にはRegExpオブジェクトを生成する必...
第２４回 関数の定義
ここでは、関数の説明をします。 関数は引数というデータを受け取り、処理をし、戻り値として処理結果を渡してくれます。 関数はまとまった処理を何度も繰り返したいときに使用します。 JavaScriptの関数を理解するのは大変重要です。今後様々な場面において使われます。 ここでは、実際に関数の定義について説明をします。定義方法は３種類あります 目次 [1] functionで定義する [2] Func...
第２５回 関数の戻り値
関数は引数と受け取り、処理を実行したと戻り値として結果を返します。 そのうちの実行した結果を渡す、関数の戻り値を説明します。 関数に戻り値にはデータ型に該当するものを返すことができます。 また、意図的に処理を中断したりといった用法にも使用されます。 目次 [1] 処理を途中で中断する [2] returnがある場合とそうでない場合 [3] return文の記述時の注意点 [4] 更新履歴 [1]...
第２６回 関数の引数
ここでは、関数の引数について説明をします。 引数(ひきすう)とは、関数を実行する際に渡す値のことです。 関数の引数で、気をつけておく点がいくつかあります。 目次 [1] 引数のデータ型をチェックしない [2] 引数の個数をチェックしない [3] 基本型と参照型で動作が異なる [4] 名前つき引数 [5] 更新履歴 [1] 引数のデータ型をチェックしない JavaScriptの関数の引数に定義した...
第２７回 変数のスコープ
変数のスコープとはどの場所から参照することができるかどうかのことです。 C言語やJava言語などを学習してあると引っかかりやすい点もあります。 目次 [1] 変数のスコープは主に２種類ある [2] グローバル変数(var宣言しない) [3] ローカル変数(var宣言する) [4] 引数のスコープはデータ型により違う [5] ブロックのスコープは存在しない [6] 更新履歴 [1] 変数のスコープ...
第２８回 argumentsオブジェクト
JavaScriptの引数にはちょっとした秘密があります。 引数の数が指定した数と合わなくてもエラーにならず、プログラムが実行されます。 これは、引数にはargumentsオブジェクトというものに値がわたっているからなのです。 目次 [1] argumentsオブジェクトとは [2] 再帰関数専用の機能 [3] 更新履歴 [1] argumentsオブジェクトとは 関数の引数はarguments...
第２９回 高階関数
関数はデータ型のひとつです。そのため、関数の引数として又は関数の戻り値として扱うことができます。 この関数を引数、戻り値として扱う関数のことを高階関数(こうかいかんすう)といいます。 高階関数の利点は、大枠の機能を定義して詳細な機能を自由に作成することができることにあります。 他にも様々な場面において応用されている技術なため理解しておくべきでしょう。 目次 [1] 引数に関数を渡す [2] 関数...
第３０回 スコープチェーン
スコープチェーンとは、変数を参照するときの方法です。 どういった方法で該当の変数が参照されているのか説明をします。 スコープチェーンの説明する前に抑えておきたいポイントが３つありますので先に説明します。 それは、関数内関数、Globalオブジェクト、Callオブジェクトです。 目次 [1] 関数内関数 [2] Globalオブジェクト [3] Callオブジェクト [4] スコープチェイン [5...
第３１回 クロージャ
クロージャとは関数が定義された環境への参照を持った関数のことです。 最初にこのような説明を見たときは正直言って意味不明でした。 ある程度調べたり、実際に組んでいてようやく理解ができたくらいです。 クロージャを理解するためには、以下のことを先に理解している必要があります。 関数はデータ型の１つであること、関数の中に関数が定義できること、スコープチェーンの存在 これらのことがわかっている前提で説明を...
第３２回 即時関数
即時関数とは定義してすぐに実行される関数のことです。 聞きなれない言葉ではないかと思います。 目次 [1] 即時関数の構文 [2] 即時関数の目的 [3] 更新履歴 [1] 即時関数の構文 即時関数の構文は以下のようなものがあります。 (function(){ ここに処理を記述する }()); (function(){ ここに処理を記述する })(...
第３３回 クラス
JavaScriptでもオブジェクト指向のプログラミングが可能です。 ただし、注意してほしいのはJavaScriptのオブジェクト指向はプロトタイプベースなので 一般的に言われるクラスによるオブジェクト指向ではありません。 またここに記載されている情報はECMAScript3なので最新のECMAScript5で使えるかは微妙です。 ECMAScript5になるとclass定義が追加されるとかされ...
第３４回 プロパティ
クラスにはデータという値を設定することができます。 ここではプロパティに関しての説明を行います。 目次 [1] プロパティ [2] プロパティを使ってみよう [3] クラスプロパティ(静的プロパティ) [4] プロトタイププロパティ [5] プロパティの使用時の注意点 [6] 更新履歴 [1] プロパティ プロパティはクラスが持つデータのことです。 Javaでいうとメンバ変数に該当します。 Ja...
第３５回 メソッド
今回はJavaScriptのオブジェクト指向のうちメソッドについて解説をします。 Javaなんかを知っている方には紛らわしい機能がありますので注意してください。 目次 [1] メソッド [2] メソッドを使ってみよう [3] プロトタイプメソッドで定義する [4] コンストラクタにメソッドで定義する [5] クラスメソッド(静的メソッド) [6] 更新履歴 [1] メソッド 最初に解説しておきた...
第３６回 プロトタイプオブジェクト
今回はJavaScriptのオブジェクト指向のうちプロトタイプオブジェクトの解説をします。 JavaScriptのオブジェクト指向で動作の違和感は私が思うにこれが要因だと考えています。 目次 [1] プロトタイプオブジェクトとは [2] プロトタイプオブジェクトを使うとメモリの削減ができる [3] プロトタイプオブジェクトは参照するときだけ使われる [4] プロトタイプオブジェクトの書き方のい...
第３７回 継承
今回はJavaScriptのオブジェクト指向のうち継承を解説します。 目次 [1] 継承とは [2] 継承を試してみる [3] 継承は途中で変更ができる [4] プロトタイプチェーン [5] 更新履歴 [1] 継承とは オブジェクト指向の概念で継承は重要な項目です。 継承とは元になるオブジェクト(スーパークラス)を引き継いで新しいクラス(サブクラス)を作成します。 引き継いだ際にスーパークラスの...
第３８回 オブジェクト指向のその他
今回はオブジェクト指向におけるちょっとしたプログラムごとについて解説をします。 目次 [1] カプセル化をしてみる [2] 更新履歴 [1] カプセル化をしてみる カプセル化とは、オブジェクトのデータ(プロパティ)、振る舞い(メソッド)の機能を隠すことです。 JavaScriptでは擬似的にこのカプセル化をすることができます。 プライベートプロパティを定義してみる function Human(...
第３９回 Stringオブジェクト
今回はJavaScriptの組み込みオブジェクトの１つについて解説をします。 ブラウザに実装されているECMAScriptによっては実行できないものがあります。 文字列型のデータを扱い方法を説明します。 目次 [1] ECMAScript v1 対応 [2] ECMAScript v3 対応 [3] ECMAScript v5 対応 [4] 更新履歴 [1] ECMAScript v1 対応 E...
第４０回 Numberオブジェクト
今回はJavaScriptの組み込みオブジェクトの１つについて解説をします。 ブラウザに実装されているECMAScriptによっては実行できないものがあります。 数字型のデータを扱い方法を説明します。 目次 [1] ECMAScript v1 対応 [2] ECMAScript v3 対応 [3] 更新履歴 [1] ECMAScript v1 対応 ECMAScript v1 に対応している機能...
第４１回 Mathオブジェクト
今回はJavaScriptの組み込みオブジェクトの１つについて解説をします。 実行されているECMAScriptによっては実行できないものがありますので注意しましょう 数学関連の機能を持つオブジェクトです。 Mathオブジェクトはインスタンス化せずにそのまま使用します。 目次 [1] ECMAScript v1 対応 [2] ECMAScript v3 対応 [3] 更新履歴 [1] ECMAS...
第４２回 Arrayオブジェクト
今回はJavaScriptの組み込みオブジェクトの１つについて解説をします。 実行されているECMAScriptによっては実行できないものがありますので注意しましょう 配列関連の機能を持つオブジェクトです。 目次 [1] ECMAScript v1 対応 [2] ECMAScript v3 対応 [3] ECMAScript v5 対応 [4] 更新履歴 [1] ECMAScript v1 対応...
第４３回 Dateオブジェクト
今回はJavaScriptの組み込みオブジェクトの１つについて解説をします。 実行されているECMAScriptによっては実行できないものがありますので注意しましょう 日付関連の機能を持つオブジェクトです。 目次 [1] ECMAScript v1 対応 [2] ECMAScript v3 対応 [3] ECMAScript v5 対応 [4] 更新履歴 [1] ECMAScript v1 対応...
第４４回 RegExpオブジェクト
今回はJavaScriptの組み込みオブジェクトの１つについて解説をします。 実行されているECMAScriptによっては実行できないものがありますので注意しましょう ここでは、正規表現のオブジェクトの使用方法について説明をします。 正規表現については別の機会に説明をします。 目次 [1] ECMAScript v3 対応 [2] 更新履歴 [1] ECMAScript v3 対応 ECMASc...
このページの先頭へ戻る