Skip to content

Instantly share code, notes, and snippets.

@mfdj

mfdj/javascript-undefined.html

Last active June 20, 2021 22:12
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save mfdj/08938f77dd6f6c578e7e78d4af2a5af9 to your computer and use it in GitHub Desktop.
Save mfdj/08938f77dd6f6c578e7e78d4af2a5af9 to your computer and use it in GitHub Desktop.
Download ZIP
In ES5 undefined is protected at the global level but it's not quite bulletproof
Raw
javascript-undefined.html
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"></head>
<!-- Normal script -->
<script>
// starting in ES5 window.undefined is read-only
undefined = 'NOT UNDEFINED'
console.log(undefined === window.undefined) // prove that we are scoped to window object (global object in node)
console.log(undefined !== 'NOT UNDEFINED')
console.log(undefined === void 0) // the symbol window.undefined will always map to the undefined value-literal (the void operator allows consistent access to the undefined value-literal)
;(function() {
var undefined = 'CAN SHADOW' // variable shadowing allows us to redfine the undefined symbol locally
console.log(undefined === 'CAN SHADOW')
;(function() {
console.log(undefined === 'CAN SHADOW') // effects all nested contexts
console.log(window.undefined === void 0) // but recall that the explicit global scope is available to us
})()
})()
;(function() {
let undefined = 'SHADOWING WORKS WITH LET'
console.log(undefined === 'SHADOWING WORKS WITH LET')
;(function() {
console.log(undefined === 'SHADOWING WORKS WITH LET')
})()
})()
;(function() {
const undefined = 'SHADOWING WORKS WITH CONST'
console.log(undefined === 'SHADOWING WORKS WITH CONST')
;(function() {
console.log(undefined === 'SHADOWING WORKS WITH CONST')
})()
})()
;(function() {
var undefined = 'STILL SHADOWING'
window.undefined = 'SILENTLY FAILS'
console.log(window.undefined !== undefined)
})()
;(function() {
'use strict'
var undefined = 'STILL SHADOWING EVEN IN STRICT MODE'
console.log(window.undefined !== undefined)
})()
;(function() {
'use strict'
try {
window.undefined = 'THIS WILL THROW TypeError'
} catch (e) {
console.warn(e)
}
})()
</script>
<!-- Module script https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#attr-type -->
<script type="module">
// In a module "use strict" is implict, so attempting to write to window.undefined throws
try {
window.undefined = 'THIS WILL THROW TypeError'
} catch (e) {
console.warn(e)
}
;(function() {
const undefined = 'CAN SHADOW' // variable shadowing allows us to redfine the undefined symbol locally
console.log(undefined === 'CAN SHADOW')
;(function() {
console.log(undefined === 'CAN SHADOW') // effects all nested contexts
console.log(window.undefined === void 0) // but recall that the explicit global scope is available to us
})()
})()
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment