mksios mksios - 1 month ago 17
jQuery Question

"use strict"; + jQuery.getScript() = script can't export to global namespace

Suppose I have the following script, called

include_strict.js
. After it executes I should have
window.global1
defined:

"use strict";

var globalVar = {};
alert(typeof window.globalVar);


But if I include it from a block of javascript with

$.getScript("include_strict.js");


The alert says
undefined
. Why? What is going on here?

FYI, that's not what happens if I include the file using a script tag:

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


Here, I see the expected alert,
object
. And if I remove
"use strict";
, then both
jQuery.getScript()
and
<script>;
have the same effect of displaying
object
.

I've created an example (https://docs.google.com/file/d/0B-XXu97sL1Ckb0x0OHptTmVMY00/edit) to demonstrate this.

Answer

It uses $.getScript() which uses eval to execute the script which cannot modify the global scope in strict mode:

Second, eval of strict mode code does not introduce new variables into the surrounding scope. In normal code eval("var x;") introduces a variable x into the surrounding function or the global scope. This means that, in general, in a function containing a call to eval every name not referring to an argument or local variable must be mapped to a particular definition at runtime (because that eval might have introduced a new variable that would hide the outer variable). In strict mode eval creates variables only for the code being evaluated, so eval can't affect whether a name refers to an outer variable or some local variable:

Source: https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Functions_and_function_scope/Strict_mode

The solution is not using jQuery to load the script but appending a script element to the DOM. Note that you cannot even use jQuery to append the element; it will automatically use $.getScript() for it.

Comments