これだけ覚えてJavaScript

変数

変数の宣言はvar。

var x = 100;

無くても動くけど必ずつけましょう。

x = 100;

関数

function add(x, y){
  return x + y;
}

add(1, 2); // 3

「add」という名前の関数を定義していますが、これは下記とほとんど同じ意味です。

var add = function(x, y){
  return x + y;
};

このとき、addはひとかたまりの処理をまとめた関数になっていて、かっこをつけるとその処理を呼び出せます。

add;       // 関数
add(1, 2); // 関数を実行している

関数も代入できます。

var x = add;
x(1, 2);

変数に一度とらなくても関数は呼び出せます。

(function(x, y){
  return x + y;
}); // これを無名関数と呼んだりします

(function(x, y){
  return x + y;
})(1, 2); // カッコをつけて引数を渡せば呼び出せます

(function(){
  return 100;
})(); // 引数が無ければこう。

JavaScriptの変数のスコープは関数の中で閉じているので、変数はなるべく関数の中で定義するとよいです。

var x = 1;

var addOne = function(y){
  return x + y;
};

addOne(2); // 3

x = 100;

addOne(2); // 102になっちゃう！

var f = function(y){
  var x = 1;
  return x + y;
};

addOne(2); // 3

x = 100;

addOne(2); // 3

オブジェクト

他の言語では連想配列とか辞書とかハッシュとか呼ばれてるものに近い存在がオブジェクトです。

var x = {}; // 空のオブジェクト

x.hoge = 123;

x.hoge + 1; // 124
x["hoge"] + 1; // 124

var x = {"hoge": 123}; // こういう定義もできる

x.hoge + 1; // 124
x["hoge"] + 1; // 124

オブジェクトに関数を入れることもできます。

var x = {
  "hoge": 123,
  "add": function(x, y){
    return x + y;
  }
};

x.hoge;
x.add(1, 2);

コールバック

JavaScriptの世界は非同期で進みます。たとえばファイルの読み込み。

# Rubyだとこう

s = open("log.txt") {|f| f.read}
print s # ここでファイルの内容が出力されます。

// JavaScriptだとこう

var s;
var fs = require('fs');
fs.readFile('./log.txt', 'utf8', function (err, text) {
  s = text;
});

console.log(s); // ファイルの内容が出力されません。

JavaScriptはファイルの読み込み終わりを待たずに処理を継続し、読み込めたときにあらかじめ設定しておいた関数を呼び出すというつくりになっています。その関数をコールバック関数と呼びます。

fs.readFile('./log.txt', 'utf8', function (err, data) {
  // この関数がコールバック
});

関数は代入できるので、このようにも書けます。

var callback = function(err, data){
  console.log(data);
};

fs.readFile('./log.txt', 'utf8', callback); // readFileに関数を渡しています

fs.readFile('./log.txt', 'utf8', callback()); // これだと関数を実行した結果をreadFileに渡していることに注意