javascript - JavaScript とオブジェクトの初期化

Question

私は javascript を「深く掘り下げる」ことを決意し、ECMA6 の前に ECMA5 のスキルを習得しようとしましたが、現在はオブジェクトの作成と初期化、どのバージョンがより優れているか、より実用的であるか、読みやすいかなどに悩まされています。どれにこだわってファンデーションとして使うか。だから私が試したこと：

バージョン 1であり、グーグルで見つけたガイドで最も人気があります

;(function() {
    var magic = magic || {};

    magic.doStuff = function() {
        alert('Magic');
    };

    window.magic = magic;
    document.addEventListener('DOMContentLoaded', function() {
        magic.doStuff();
    }, false);

})();

バージョン 2、バージョン 1 とまったく同じですが、構文が少し異なります

(function () {
    var magic = {
        doStuff: function() {
            alert('Magic');
        }
    };

    document.addEventListener('DOMContentLoaded', function () {
        magic.doStuff();
    }, false);
})();

バージョン 3、これは私にとって最悪で、構文が難しく、間違いの余地があり、正しく書かれているかどうかさえわかりません

(function () {
    var magic = (function () {
        magic.doStuff = function () {
            alert('Wow!');
        };

        return magic;
    });

    document.addEventListener('DOMContentLoaded', function () {
        (new magic()).doStuff();
    }, false);
})();

バージョン 4、これはシニア開発者によって私に示されましたが、ガイドではあまり人気がありませんでした.

(function() {
    var magic = (function () {
        function publicDoStuff() {
            alert('Magic');
        }

        return {
            doStuff: publicDoStuff
        };
    })();

    document.addEventListener('DOMContentLoaded', function () {
        magic.doStuff();
    }, false);
})();