var g = function(id) { return document.getElementById(id); } var button = function(id, clickFn) { var btn = document.createElement('button'); btn.id = id; btn.onclick = clickFn; btn.innerHTML = 'call ' + id; return btn; } var container = g('container'); var buttons = { 'say1': function(){ alert(say1())}, 'say2': function(){ alert(say2())}, 'say3': function(){ alert(say3('Budi'))}, 'say4': function(){ alert(say4())}, 'say5': function(){ alert(say5())}, 'getCustom1': function(){ alert(getCustom1())}, 'getCustom2': function(){ alert(getCustom2())} } for (var id in buttons) { container.appendChild(button(id, buttons[id])); } //================================================================== // ketika suatu variable didefinisikan secara langsung // akan membuat variable tersebut otomatis menjadi property dari object window s = 'hello'; // sama juga ketika mendaftarkan sebuah property pada object window window['t'] = 'world'; function say1() { // s dan t akan diambil dari window // karena tidak didefinisikan dalam function return 'fn say1 = ' + s + ' ' + t; } function say2() { var t = 'universe'; // meskipun dalam function ini ada mendifinisikan variable t, // namun variable tersebut didefinisikan dengan keyword var // menjadikan akses ke variable tersebut hanya dalam scope function // sedangkan dalam kasus ini, secara eksplisit, kita mengambil nilai t dari object window return 'fn say2 = ' + window.s + ' ' + window.t; } // deklarasi say3 adalah dianggap sebagai variable // tanpa keyword var, maka akan otomatis menjadi property dari window say3 = function(t){ // pada fungsi ini, variable t tidak akan diambil dari object window, // karena scope function, juga memiliki properti t // bandingkan dengan say2 di atas return 'fn say3: hello ' + t; } function say4(){ // di javascript, function pun adalah sebuah properti object // dalam kasus ini, say3 adalah sebuah variable, dengan tipe ada function // sehingga dapat diakses langsung pada object window, dan dieksekusi return 'say 4: ' + window['say3']('Toni') } // variable custom1 dideklarasikan secara langsung menjadi properti dari window window.custom1 = 'rajin'; function getCustom1(){ // variable custom1 otomatis diambil dari object window // karena tidak ada variable custom1 dalam scope ini return 'sifat budi: ' + custom1 } function getCustom2(){ var custom1 = 'budi'; // karena variable custom1 dideklarasikan dalam scope function ini, // maka untuk mengakses custom1 milik window, harus ditulis secara lengkap return custom1 + ' ' + window.custom1 } // variable ini didefinisikan dengan keyword var // menjadikan variable ini hanya berjalan scope saat ini, dan bukan global // dengan demikian, variable itu tidak menjadi property dari object window // say5 akan menghasilkan undefined, karena tidak dapat mengakses variable notInWindow var notInWindow = 'variable bukan dalam window'; function say5(){ return window.notInWindow; }
<div id='container'> </div>
button { display: block; margin: 10px; }