如何在另一个函数中访问对象函数

Question

In my buildEstat function , I build up my script element, and then I wait for it to load...then I call eSloaded(), which will create an Object on var contentStreamTag.

Object {} 
    - notifyPlayer: function()
    - post: function()
    - set: function()

My question is, in my bindEvents() function , I have some play/pause/mute functions. In those play/pause/mute functions, I need to use some object functions inside the var contentStreamTag, such as the post/set function

I am having a hard time figuring this out. Please let me know if my question is confusing or does not make sense.

     buildEstat: function() {

        var eS = document.createElement('script');
        eS.type = 'text/javascript';
        eS.async = true;
        eS.src = ('https:' === document.location.protocol ? 'https://' : 'http://') + 'prof.estat.com/js/mu-5.1.js';

        var s = document.getElementsByTagName('script')[0];
        s.parentNode.insertBefore(eS, s);

        if (eS.addEventListener) {
            eS.addEventListener('load', function() {
                eSloaded();
            }, false);
        } else {
            console.log('something not working')
        }

        function eSloaded() {
            var contentStreamTag = new eStatTag(confStreamingAnalytics);    
            // console.log(contentStreamTag);            
        }
    },

    bindEvents: function() {
        var self = this;

        this.buildEstat(function(){

        });

        this.dom.play.click(function() {
            $(this).css('display', 'none');
            $('.gp_pause').css('display', 'block');
            self.sound.play();

        });
        this.dom.pause.click(function() {
            $(this).css('display', 'none');
            $('.gp_play').css('display', 'block');
            self.sound.unload();
            self.sound.stop();

        });

        this.dom.mute.click(function() {
            self.sound.toggleMute();
            $(this).toggleClass('muted');
        });

        $('#goomplayer').addClass('animated bounceInUp');

    },

Answer 1

contentStreamTag is a var inside the eSloaded function. Which means once that function has finished, that variable will no longer exist. If you wish for it to be more persistent, you will need to store it at a more global level, either as a global variable or maybe in localStorage.

Answer 2

Javascript variables are scoped in the function where it is defined.

To access the variable in a parent scope, you can move declaration to parent scope:

function parent(){
    var foo;
    function innerScope(){
        foo = 'bar';
    }
    innerScope();
    console.log(foo);
}

This adds a complexity to your code, because the variable will exist in the parent scope but will not be initialized until the innerScope is called. This can be addressed, for example turning innerScope into an object and foo a property of it. But exactly how to address this depends on more info on how your code works and how it's going to be used.