JSFiddle - React, Tailwind, and code Playground
JavaScript
// Pattern from https://github.com/HumanDesign/mithril-modal/blob/master/modal/modal.js
var Modal_1 = new function() {
var Modal_1 = { foo: 'bar' }
return Modal_1
}
// Above pattern, but as a real constructor
var Modal_1b = new function() {
this.foo = 'bar';
}
// Classic IIFE
var Modal_2 = (function() {
var Modal_2 = { foo: 'bar' }
return Modal_2
}())
// IIFE using "this" (bad idea)
var Modal_2b = (function () {
// "this" is actually window!
this.foo = 'bar';
// result:
// window.foo is 'bar'
// Modal_2b is undefined
}())
// All equivalent at first... (except Model_2b)
console.log(Modal_1, Modal_1b, Modal_2, Modal_2b)
// What about prototypes?
Modal_1.constructor.prototype.whoAmI = 'I am Modal 1.'; // <-- WE NEVER SEE THIS
Modal_1b.constructor.prototype.whoAmI = 'I am Modal 1b';
Modal_2.constructor.prototype.whoAmI = 'I am Modal 2';
console.log(
Modal_1.whoAmI, // 2
Modal_1b.whoAmI, // 1b
Modal_2.whoAmI, // 2
{ unrelated: 'item' }.whoAmI // ALSO 2
)
// Modal_1 and Modal_2 share Object.prototype. Modal_1b has its own prototype.