CODEWITHSUNDEEP
javascriptundefined
AL-zami
AL-zami

Reputation: 9066

undefined as a valid variable name in local scope

I've given some thoughts on declaring a variable called undefined and evaluating a truthy if-else expression with it. I found out that it is not possible in global scope. But in MDN I've found some interesting insight about the undefined datatype. I am directly quoting from MDN

undefined is a property of the global object; i.e., it is a variable in global scope.

It doesn't say anything about local scope. That means i can create one in local scope. So, I move on to put this insight to test. I have created an object and assign a method to it 

var person = {
   method : function(){

       var undefined = 2

       if(undefined){
          console.log("undefined works as a variable")
       }

   }
}

person.method()

And guess what! the if statement passes the test and the string inside the console.log() gets printed on the console.This might be a dangerous thing and of course a bad practice. Is there any way to prevent the declaration of a variable named after undefined keyword in javascript's local scope ? Thanks!

Upvotes: 2

Views: 105

Answers (3)

Scott Marcus
Scott Marcus

Reputation: 65806

Welcome to the wonderful world of JavaScript!

There is no way to prevent someone from doing this, but there is a way to ensure that undefined will mean undefined if you set up your functions as follows (not that you should really have to do this because it would be very bad practice for anyone to actually set up a variable named undefined). Essentially smaller scoped functions could hide a higher scoped undefined variable.

// This is just a way to get a variable called "undefined"
function wrapper(){
  var undefined = 10;
  console.log("wrapper says undefined is: " + undefined);

  // This function declared a parameter called "undefined",
  // but if the function gets called with no argument, then
  // the value of this, more local, argument will truly be
  // undefined. If arguments are needed, just add "undefined" 
  // to the end of the list.
  function foo(undefined){
    // Formal test to ensure that undefined is what we believe it to be:
    if(typeof undefined === "undefined"){
      console.log("foo says undefined is: " + undefined);
    }
  }
  
  // When foo is called with no arguments passed in, the parameter
  // "undefined" will take on a value of undefined within the scope
  // of that function.
  foo();
}

wrapper();

Now, that's a bit contrived as you're not going to set up all your functions with a "fake" argument, but you could test to see if undefined has been altered with:

function wrapper(){
  var undefined = 10;
  console.log(undefined);
  
  function foo(){
  
    if(typeof undefined === "undefined"){
       // undefined has not been altered
    } else {
       // undefined has been altered, so reset it for this scope:
       let undefined;
       console.log(undefined);
    }
 
  }
  
  foo();
}

wrapper();

In the end though, you could simply prevent this from affecting your functions by adding var undefined in your functions. Hoisting will make sure that this kicks in at the top of your function, no matter where you declare it.

Upvotes: 2

ideaboxer
ideaboxer

Reputation: 4101

To work around accidental modification of undefined, you should not write this dangerous word in your code at all.

Since you only need read access to undefined, it is recommended to always use void 0 instead, which returns undefined.

var person = {
   method: function() {

       var undefined = 2

       if(void 0) {
          console.log("this should never be printed")
       } else {
          console.log("void 0 is always undefined, no matter what you do")
       }

   }
}

person.method()

How to work with void 0 and completely get rid of the word "undefined"?

// Turn
if(myVariable === undefined) { ... }
if(typeof myVariable === "undefined") { ... }
// into
if(myVariable === void 0) { ... }

// Turn
if((myVariable === undefined) || (myVariable === null)) { ... }
// into
if(myVariable == null) { ... }

// Turn
myObject.someKey = undefined
// into
myObject.someKey = void 0

Upvotes: 3

Pranshu Jain
Pranshu Jain

Reputation: 570

I can't see any way to stop it, but yes, You can restrict it passing the yes inside If you can make the scope local using ES6.

You will find how scope if changed now and it's not the same thing. 

var person = {
   method : function(){

   let undefined = 2

   if(undefined){
      console.log("undefined works as a variable")
   }

   }
}

Upvotes: 1

Related Questions