Namespaced Objects

Video

JavaScript Notes

JavaScript
    // Namespaces (wrapping variables and functions in objects)
    
    // namespace1 
    let STEVE = {
        colorDiv: function(ev) {
            let target = ev.currentTarget;
            target.style.backgroundColor = 'purple'; 
            target.style.color = 'white';
        },

        init: function( ) {
            let divA = document.getElementById('output');
            divA.addEventListener('mouseout', STEVE.colorDiv);
        }
    }
    STEVE.init( );
    
    // namespace2 
    let TONY = {
        colorDiv: function(ev) {
            let target = ev.currentTarget;
            target.style.backgroundColor = 'olive'; 
            target.style.color = '#333';
        },
        init: function( ) {
            let divB = document.getElementById('output');
            divB.addEventListener('mouseout', this.colorDiv);	
            // “this” keyword represents the object that called this function
        }
    }
    TONY.init( );