JavaScript

JavaScriptのクラスと関数と連想配列は同じものなのか

JavaScriptにはJSオブジェクトというものがあるが、これはJavaScriptにおける構造体だ。
そしてこれはJavaScriptの連想配列としても使うことができる。
つまり、下のコードの変数「map」は構造体としても連想配列としてもアクセスできる。

let map = {
    i:100,
    f:23.45,
    s:'hello'
}

console.log(map.i); // => 100
console.log(map.f); // => 23.45
console.log(map.s); // => hello

console.log(map['i']); // => 100
console.log(map['f']); // => 23.45
console.log(map['s']); // => hello

関数もオブジェクトなので、newすれば構造体や連想配列として使うことができる。
JSON.stringifyメソッドで文字列にすることも可能だ。

let fun = new function() {
    this.i = 100;
    this.f = 23.45;
    this.s = 'hello';
}

console.log(fun.i); // => 100
console.log(fun.f); // => 23.45
console.log(fun.s); // => hello

console.log(fun['i']); // => 100
console.log(fun['f']); // => 23.45
console.log(fun['s']); // => hello

jstr = JSON.stringify(fun);
console.log(jstr); // => {"i":100,"f":23.45,"s":"hello"}

逆に、連想配列に関数を格納して、メソッドとして呼び出すこともできる。

map['sum'] = function(a, b) {
    return a + b;
}

console.log(map.sum(2, 3)); // => 5
console.log(map['sum'](2, 3)); // => 5

もちろん関数内に関数を格納して、それを連想配列内の関数として呼び出すこともできる。

fun['sum'] = function(a, b) {
    return a + b;
}

console.log(fun.sum(2, 3)); // => 5
console.log(fun['sum'](2, 3)); // => 5

最近ではclass構文が追加されたが、もともとプロトタイプベースのJavaScriptはクラスを作れないはずだ。
コード上には「class」と書くものの、中身はfunctionと同等になっているようで、やはり構造体としても連想配列としても使える。

class Cls {
    get i() { return this._i; }
    set i(v) { this._i = v; }
    get f() { return this._f; }
    set f(v) { this._f = v; }
    get s() { return this._s; }
    set s(v) { this._s = v; }

    constructor() {
        this.i = 100;
        this.f = 23.45;
        this.s = 'hello';
    }

    sum(a, b) {
        return a + b;
    }
}

let ins = new Cls();

console.log(ins.i); // => 100
console.log(ins.f); // => 23.45
console.log(ins.s); // => hello

console.log(ins['i']); // => 100
console.log(ins['f']); // => 23.45
console.log(ins['s']); // => hello

console.log(ins.sum(2, 3)); // => 5
console.log(ins['sum'](2, 3)); // => 5

配列に関数を格納して、それを呼び出すことも可能だ。
ただ、配列はメソッドチェーンでのアクセスはできない。

let ary = [];

ary[0] = function(a, b) {
    return a + b;
}

console.log(ary[0](2, 3)); // => 5
// console.log(ary.0(2,3)); // これは無理

[ 戻る ]