Why is undefined not writable in JavaScript?

JavascriptTypeof

Javascript Problem Overview


According to MDN's documentation on undefined:

> In modern browsers (JavaScript 1.8.5 / Firefox 4+), undefined is a non-configurable, non-writable property per the ECMAScript 5 specification. Even when this is not the case, avoid overriding it.

One of the property attributes of undefined is that is not writable.

But if I do:

var undefined = 'hello';
var test = undefined;
console.log(typeof test);
//string

Does that mean that I can overwrite the value of undefined? What happens if someone does that? Should JavaScript warn about that?

Javascript Solutions


Solution 1 - Javascript

A removed comment by Amy gives the solution. You are creating a variable named undefined, and it doesn't work if you do your snippets in the global scope:

var undefined = 'hello';
var test = undefined;
console.log(typeof test);

But it effectively works if you do it in a local scope where undefined doesn't refer to the global variable anymore:

(()=>{
  var undefined = 'hello';
  var test = undefined;
  console.log(typeof test);
})()

To prevent this mistake, you can use the 'use strict'; directive:

'use strict';
var undefined = 'hello';
var test = undefined;
console.log(typeof test);

If you are writing code where you can't control where it will be executed (e.g. library, embed, etc) it is a good pattern to use a IIFE which makes it so you can guarantee that undefined will always be correct/usable. Here is an example:

(function(undefined){
  // undefined will equal `undefined` because we didn't pass in an argument to the IIFE
  
  console.log(undefined); // always `undefined`, even if undefined !== `undefined`outside of the IIFE scope
})(); // No argument supplied


All my tests were made using Firefox 72.0b10 (64 bits) on Ubuntu, and the result for the first snippet may differ on an older browser.

Solution 2 - Javascript

> While it is possible to use it as an identifier (variable name) in any > scope other than the global scope (because undefined is not a reserved > word), doing so is a very bad idea that will make your code difficult > to maintain and debug.

Source https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined

undefined is not reserved hence it is possible to assign it a new value.

When you are not using strict mode you are essentially creating a variable called undefined in local scope and assigning a string value to it.

undefined is a property of the global object. The initial value of undefined is the primitive value undefined.

use strict will help prevent this mistake in global scope while it can still be overwritten in local scope.

If you want to be more safe you should use void 0 instead of undefined which always returns undefined.

'use strict'

const test = (() => {
  let undefined = "test"
  console.log(typeof undefined)
  console.log(typeof void 0)
})()

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionpmirandaView Question on Stackoverflow
Solution 1 - JavascriptjonatjanoView Answer on Stackoverflow
Solution 2 - JavascriptkooskoosView Answer on Stackoverflow