0
0

More than 3 years have passed since last update.

What's "JavaScript" ?

Last updated at Posted at 2019-11-05

よく使い方を忘れるので、必要な時にサッと読み返せるように超完結にまとめておきます。

勉強中の関連記事まとめ
自分用の勉強記事をまとめた目次 ~擬似知識体系~

JavaScriptとは

簡単な歴史メモ

いろいろあってprototype.jsによってライブラリを使うクロスプラットフォーム言語としてシェアを獲得しました。

インタプリタ言語

C言語などのコンパイル型言語のようにソースコードを一旦コンパイルして実行可能な形式に変換する必要のない言語。つまりブラウザなどの実行環境で直接ソースコードを動かすことができるということ。

CやJavaに似た構文

根本的な書き方は異なるが、if文やwhile文といった一般的な構文が使えるため習得しやすい。

動的型言語

よくわからん。変数や関数の返り値に型指定がないとか。

プロトタイプベースのオブジェクト指向

よくわからん。クラスベースではないということ。

リテラル表記の表現力

ソースコードの表記方法が良いということ。

関数型プログラミング

functionなどの関数をオブジェクトとして捉えられるため複雑な処理を一括して呼び出すことができる。

JavaScriptの基礎部分

  • 変数
  • 定数
  • 関数の宣言と呼び出し
  • プロパティは名前と値のペア
  • プロパティ値に関数を指定できる
  • プロトタイプチェーン
  • プロパティアクセスとドット演算子とブラケット演算子
  • メソッドとはオブジェクトのプロパティ値に関数を持たせたもの
  • newで宣言するのはコンストラクタ呼び出しの関数オブジェクト(実質クラスと同義)
  • クラスとインスタンス
  • オブジェクトと型
  • 配列

JavaScriptの応用部分

  • クライアントサイドjs
  • ライブラリ
  • WEBアプリとは
  • Socket
  • WEB API
  • サーバーサイドjs
  • Node.js

言語仕様

文字列

テキストを値として扱う型。""で囲むことで文字列型となる。

var t = "テキスト";

足し算でテキスト連結できる。ブラウザ画面に状況に合わせて見出しやメッセージを表示させるのに使う。

var t1 = "テキスト";
var t2 = "123";
var t3 = t1 + t2;
dcuument.write(t3);

 テキスト123

比較演算子で五十音順のソートなどができる。おそらくブーリアン演算結果によってどう処理するかというプログラムに使う。

var a = "";
var b = "";
document.write(a < b);

 true    // aの方がNoが小さいから

document.write(a > b);

 false

文字列クラス名はString。lengthプロパティで文字数を取得する。

document.write(t3.length);

 7

文の種類

  • 制御分
    • if else文
    • switch case文
  • 繰り返し文
    • while文
    • do while文
    • for文
    • for in文
    • for each in
    • break文
    • continue文
    • return文
  • その他
    • throw文
    • with文

演算子の種類

  • 算術演算子
  • 文字列連結演算子
  • 同値演算子
  • 比較演算子
  • in演算子
  • instanceof演算子
  • 論理演算子
  • ビット演算子
  • 代入演算子
  • 算術代入演算子
  • 条件演算子(3項演算子)
  • typeof演算子
  • new演算子
  • delete演算子
  • void演算子
  • カンマ演算子(,)
  • ブラケット演算子([])
  • 関数呼び出し演算子

参照

変数もプロパティも名前を付けて管理する。元は同じ概念。

グローバル変数とローカル変数

スコープの違い。関数の中で宣言したらローカル。

グローバル変数はグローバルオブジェクトのプロパティ。

このあたり、変数とプロパティの考え方が重要になる。あるオブジェクトに与えられた値のことをプロパティと呼ぶ。あるスコープの中で宣言されたものを変数と呼ぶ。

オブジェクトとはプロパティの集合体。プロパティとは名前と値のペア。よくやるオブジェクトの定義はデータと操作(手続き)を一体化させたもの。

new式・コンストラクタ(クラス)呼び出し・インスタンス生成

メソッド

JavaScriptにメソッドは存在しない。便宜上、オブジェクトのプロパティに関数をセットしたものをメソッドと読んでいる。

実際には、this参照によって呼び出された関数の中でオブジェクトのプロパティにアクセスしたものをメソッドと呼ぶ。

this参照は読み込み専用の変数。

プロトタイプ継承

プロトタイプチェーンという機能で他のオブジェクトのプロパティを引き継ぐ。

コールバック関数

コールバック関数とは、別の関数に呼び出してもらうための関数。つまり、ある関数に渡す値としてコールバック関数を渡すということ。高階関数に渡すための関数。自分で直接実行するのではなく、相手に実行してもらうもの。

最も分かりやすい例としてsetTimeout()がよく挙げられる。

setTimeout(処理内容, 実行タイミング);

このとき、第一引数の処理内容として関数を渡した場合、下のようなコードになる。

setTimeout(function() {
    console.log('Hello World');
}, 3000);

このコードだとsetTimeoutによって3秒後にfunctionが実行されることになる。これがコールバック関数というらしいが、これがノンブロッキング処理というのはどう解釈すればいいか。

ノンブロッキング処理とは、後続する処理をブロックしないように書かれたもの。上の例では、

値として渡すか、処理するか

関数を値として扱うときは()をつけず関数名のみを変数に渡す。この場合、関数は処理が実行されることなく関数のコードのみが渡される。()をつけることは実行することを意味する。

そして関数を渡した変数の()に引数を渡すことで中身の関数、すなわちコールバック関数に引数を渡すことができる。

function f(a, b) {
    return a + b; 
}

var ff = f;    // f(a, b)の()はつけない

console.log(ff(1, 2));

> 3

参考文献
JavaScriptの「コールバック関数」とは一体なんなのか

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0