生JS javascript の 匿名名前空間、クラス宣言、継承、ajax、Django-csrf 自分用

全部インターネットから拾ったやつだけど探すの大変だったからまとめてまとめる

```js

(function (global) { // 全体を無名の名前空間にぶち込む
// djangoのcsrf用
function csrfValue(){
    return document.getElementsByName('csrfmiddlewaretoken')[0].value;
}
function csrf(){
    return 'csrfmiddlewaretoken=' + csrfValue();
}
// ajaxの簡易実装
var ajax = function (url, params, ajaxResponseHandler) {
    var req = new XMLHttpRequest();
    req.onreadystatechange = function () {
        if (req.readyState === 4) {
            if (req.status === 200 || req.status === 304) {
                ajaxResponseHandler(req.responseText);
            }
        }
    };
    req.open('POST', url, true);
    if (params instanceof FormData === false) {
        req.setRequestHeader('content-type', 'application/x-www-form-urlencoded;charset=UTF-8');
    }
    req.send(params);
};
// 静的なオブジェクト
var StaticObject = {
    isValid: false,
    staticFunction: function () {
    }
};
// クラスっぽいオブジェクト
var ClassLikeObject = function (id, evaluate) {
    this.id = id;
    this.evaluate = evaluate;
    this.isValid = false;
    this.registerOnChange(this);
};
(function () {
    // イベントリスナへの登録
    this.registerOnChange = function (self) {
        document.getElementById(this.id).addEventListener(
            'change',
            function () {
                self.changed();
            },
            false
        );
    };
    this.changed = function () {
        dosomething();
    };
    // データをバリデートして何かをアップデート
    this.validate = function () {
        var thisElement = document.getElementById(this.id);
        this.isValid = this.evaluate(thisElement);
        this.applyElement(thisElement);
        return this.isValid;
    };
    this.applyElement = function (element) {
        var attr = this.isValid ? 'valid' : 'invalid';
        element.setAttribute('class', attr);
    }
}).call(ClassLikeObject.prototype);  // prototyepにまとめて登録したいときはこう書くとカッコイイ

// 継承っぽい事をするなら
var ChildClassLikeObject = function (id, evaluate, someArgs) {
    ClassLikeObject.call(this, id, evaluate);
    this.someArgs = someArgs
};
(function () {
    this.changed = function () {
        dosomething();
    };
    this.update = function () {
        var self = this;
        return function (json) { // [(key, value), (key, value),,,,]形式のjson受け取ってセレクトボックスの中身にぶち込む
            var selectBox = document.getElementById(self.id);
            while (selectBox.firstChild) {
                selectBox.removeChild(selectBox.firstChild);
            }
            var options = JSON.parse(json);

            for (var i = 0; i < options.length; i++) {
                var element = document.createElement('option');
                element.value = options[i][0];
                element.innerHTML = options[i][1];
                selectBox.appendChild(element);
            }
            self.changed();
        };
    };
}).call(ChildClassLikeObject.prototype);
inherits(ChildClassLikeObject, ClassLikeObject);

// window.onloadの書き方
window.addEventListener('load', function () {

});

// 互換性の高い継承の実装
function inherits(ctor, superCtor) {
    if (ctor === undefined || ctor === null)
        throw new TypeError('The constructor to `inherits` must not be ' +
            'null or undefined.');

    if (superCtor === undefined || superCtor === null)
        throw new TypeError('The super constructor to `inherits` must not ' +
            'be null or undefined.');

    if (superCtor.prototype === undefined)
        throw new TypeError('The super constructor to `inherits` must ' +
            'have a prototype.');

    ctor.super_ = superCtor;
    Object.setPrototypeOf(ctor.prototype, superCtor.prototype);
}
}(window)); // 全体を無名の名前空間にぶち込む
```