Would this enable "use strict" globally?

Question

Similar, but not the same as, How to enable ECMAScript "use strict" globally?

I have bought JavaScript Patterns and it recommends enabling use strict. Adding it to the two dozen javascript files would be a bit of a chore, so enabling it globally would be nice. I originally thought about adding to the top of my main.js like this:

"use strict" 
require({
    priority: ["jquery", "raphael", "myapp"] 
});

However I then thought that it maybe would only enable it for that file. I then thought about this:

<script data-main="lib/main" src="lib/require.js">"use strict"</script>

Would either of these enable ECMAScript 5 strict mode globally?

Answer 1

TL;DR:

No, a "use strict" in one script element does not impose "use strict" on code in other script elements. It applies only to the source text it's part of.

(Separately, re the script tag at the end of the question: If a script element has a src, any inline text it has is considered "documentation" and is ignored.)

---

Update:

It's clearer in the specification now (maybe it was clear in ES5, but just not to me) that yes, separate script elements are separate for the purposes of "use strict". The quote below in the original answer has been changed slightly to say "source text" rather than "code unit", and the Scripts and Modules section goes into more detail.

---

Original answer:

The specification says:

Because strict mode is selected at the level of a syntactic code unit, strict mode only imposes restrictions that have local effect within such a code unit. Strict mode does not restrict or modify any aspect of the ECMAScript semantics that must operate consistently across multiple code units.

(Section 4.2.2)

So the question is: Are different script tags different syntactic code units?

V8 (the JavaScript engine inside Chrome) appears to believe that they are separate and so putting a single "use strict"; in global scope at the top of your page would not work. Perhaps it's specified somewhere I haven't found yet, but in any case, it's a reasonable interpretation.

Assuming no declaration for foo that isn't shown, this code falls prey to The Horror of Implicit Globals in normal mode:

function test() {
    try {
      foo = "bar";
      display("foo = " + foo);
    }
    catch (e) {
      display("Exception: " + e);
    }
}

In normal mode, that creates a new global variable foo with the value "bar" and shows the "foo = bar" message. In strict mode, an exception is thrown because foo is undefined.

If I put this script tag in a page:

<script>
"use strict";
function test() {
    try {
      foo = "bar";
      display("foo = " + foo);
    }
    catch (e) {
      display("Exception: " + e);
    }
}
</script>

...I get the exception as expected (live example). If I put them in separate script tags, though:

<script>
"use strict";
</script>
<script>
function test() {
    try {
      foo = "bar";
      display("foo = " + foo);
    }
    catch (e) {
      display("Exception: " + e);
    }
}
</script>

I don't get the exception (on V8) (example). And that's reasonable if you think about how the browser and the JavaScript engine are interacting.

And similarly, if the function is off in another file and I do this:

<script>
"use strict";
</script>
<script src="/inatoq"></script>

I don't get the exception (example), presumably for the same reason.

Note that your example tag here:

<script data-main="lib/main" src="lib/require.js">"use strict"</script>

is invalid. A script tag may either have a src attribute or content, but not both. (Well, basically; details here [HTML5] and here [HTML 4.01].) If it has a src element, the browser is supposed to disregard the content, and most do. Most. :-)

Answer 2

JSLint is suddenly reporting: Use the function form of "use strict"

(function () {
    "use strict";
    // put all of your strict code here


}());