Is it possible to change function runtime scope in JavaScript?

Question

I am working on a JavaScript library while I need to load different modules accordingly, I use the callback to load different scripts:

Just add the main script in the page:

<script type="text/javascript" src="main.js"></script>

main.js:

(function () {
    var actionForT2 = function (fun) {
        fun && fun.apply(this);
    }
    var loadCallback = function (name, obj) {
        if (name == "t2") {
            actionForT2(obj);
        }
    }
    window.__jsload = loadCallback;
    var loadJs = function (js) {
        var head = document.head || document.getElementsByTagName('head')[0];
        var script = document.createElement("script");
        script.setAttribute("src", js);
        script.setAttribute("type", "text/javascript");
        head.appendChild(script);
    }
    loadJs("js/t2.js");
})();

t2.js:

__jsload('t2', function () {
    console.info("t2 loaded");
    console.info(loadJs);
})

Now the t2.js will be loaded as expected. And I got the output:

t2 loaded
ReferenceError: loadJs is not defined

That's to say, the loadJs function is not accessed for the function defined in t2.js, then I wonder if I can change the Runtime context of the loaded function, for example, when the loaded function is being called:

fun && fun.apply(this);

Is it possible to make the call of fun under the context of current anonymous function, then all the defined variables, functions like the loadJs and etc can be accessed by fun without export them to the window?

Why I am interested in this kinds of solution is that I found google map use the callback, for example, when using google map v3, the following script will be loaded to the page:

https://maps.gstatic.com/maps-api-v3/api/js/18/3/main.js

Then another module map will be loaded:

https://maps.gstatic.com/cat_js/maps-api-v3/api/js/18/3/{map}.js

While when deep in to the codes, I found that the {map}.js can access the variables defined in the main.js. But I can not find the how the magic happen.

loadjs only exists in scope, of the function, so you can either attach loadjs to a global object, like window — Ryan
– Ryan, Commented Sep 17, 2014 at 1:01
You should look at how this module loading functionality is achieved through require.js. Or better yet, don't reinvent the wheel and just use require.js if possible. — mricci
– mricci, Commented Sep 17, 2014 at 1:21

RobG · Accepted Answer · 2014-09-17 01:26:43Z

2

Is it possible to change function runtime scope…I wonder if I can change the Runtime context of the loaded function, for example, when the loaded function is being called

No. Javascript is lexically scoped, so scope is entirely dependent on where functions are created in the code, not where they called from or how they are called

> fun && fun.apply(this);

That will only set one parameter of the function's execution context, its this parameter.

There is general confusion about the term context. In ECMA-262 (the standard for the language underpinning javascript) context is used exclusively in execution context, which is the entire environment inside a function and includes its this parameter.

The call and apply methods allow you to specify the value of a function's this, that's it, they have no other effect on the execution context (which is why this should never be called "context"). They do not have any effect on identifier resolution, which proceeds based on scope regardless of the value of this or where a function has been called from.

You might find the following article interseting: Identifier Resolution, Execution Contexts and scope chains.

edited Sep 17, 2014 at 1:26

answered Sep 17, 2014 at 1:19

RobG

148k32 gold badges180 silver badges216 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

hguser Over a year ago

"fun.apply(obj) only set the this in side the function rather than the context" I never realize that. Thanks. Could you spare some time to check my update about why I am looking for.

Thilo · Accepted Answer · 2014-09-17 01:04:51Z

0

You could make it global. Since you already have window.__jsload you could attach it there.

__jsload.loadJs = loadJs;

 // // access like this  :
 // console.info(__jsload.loadJS);

Or you could pass it to your callback when you call it from __jsload.

__jsload('t2', function (loadJs) {
   console.info("t2 loaded");
   console.info(loadJs);
}

answered Sep 17, 2014 at 1:04

Thilo

264k107 gold badges527 silver badges674 bronze badges

1 Comment

hguser Over a year ago

Yes, this is a solution, I never thought that, however it seems that only the loadJs is exported while the other variables,functions should be exported which is not sure.

Collectives™ on Stack Overflow

Is it possible to change function runtime scope in JavaScript?

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related