JSFiddle - React, Tailwind, and code Playground

JavaScript

var outer = 42;
window.addEventListener('load', function() {
    var inner = 42;
    function magic() {
       var in_magic = inner + outer;
       console.log(in_magic);
    }
    magic();
}, false);
    
// Would compile to

var constructScopeWrapper = function(Scope, f) {
    return function __intersect__() {
        return f.apply(this, [new __ScopeObject__(Scope)].concat(arguments));    
    };
};

var __ScopeObject__ = function(outerscope) {
    var objects = {};
    
    this.get = function(name) {
        if (objects.hasOwnProperty(name)) {
            return objects[name];
        }
        return outerscope.get(name);
    };
    
    this.set = function(name, value) {
        objects[name] = value;    
    }
};

var __Scope__ = new __ScopeObject__({
    get: function(name) { throw new ReferenceError(name + ' is not defined'); }    
});
    
__Scope__.set('outer', 42);
__Scope__.set('console', console);
window.addEventListener('load', constructScopeWrapper(__Scope__, function(__Scope__) {
    __Scope__.set('inner', 42);
    __Scope__.set('magic',constructScopeWrapper(__Scope__, function _magic(__Scope__) {
        __Scope__.set('in_magic', __Scope__.get('inner') + __Scope__.get('outer'));
        __Scope__.get('console').log(__Scope__.get('in_magic'));
    }));
    __Scope__.get('magic')();
}), false);