Object destructing in if-condition results in global variable?

Question

Can someone explain to me why I can access "m" in global scope in the following scenario:

const a = {m: 'beeb'};


const magic = function topLevel () {
   function lowerLevel() {
    if ({m} = a ) { 
      console.log('in lowerLevel-func: ', m);
    }
  }

  lowerLevel();
}


magic();

console.log('in global', m);

and here is JSFiddle

Edit: Just to clarify, I am not using this anywhere, I was just wondering how it was possible. Now I know, thanks!

Because you're *assigning* instead of *comparing* by using a single `=` in your `if` — haim770, Feb 26 '18 at 12:29
What was this statement even supposed to do? Did you mean `if (m)`, or `if (m.a)`, or something else? — Bergi, Feb 26 '18 at 12:37
`whatever=a` returns `a`, so `{m}=a` doesn't say you anything about `a.m`, even if you declare `m` properly. — georg, Feb 26 '18 at 12:40

score 1 · Accepted Answer · answered Feb 26 '18 at 12:33

If you assign a value to a variable that has not been declared, it will automatically become a GLOBAL variable. And since you are doing =(Assigning) instead of ==(compairing)

<!DOCTYPE html>
<html>

<body>

  <p>
    If you assign a value to a variable that has not been declared, it will automatically become a GLOBAL variable:
  </p>

  <p id="demo"></p>

  <script>
    myFunction();

    // code here can use carName as a global variable
    document.getElementById("demo").innerHTML = "I can display " + carName;

    function myFunction() {
      carName = "Volvo";
    }
  </script>

</body>

</html>

References

Also Read What is the scope of variables in JavaScript?

This states a general rule of the language, it doesn't answer this specific question. — axiac, Feb 26 '18 at 12:34
Yeah, I am aware of scopes etc. I just did not know that undeclared variable becomes part of global scope automatically. Thanks. — Yellowhill, Feb 26 '18 at 12:42

oniondomes · Answer 2 · 2018-02-26T12:42:04.043

1

It happens because you never explicitly declared (with var, let or const statements) m variable, so it becomes a property of the global Window object (that's why you can access it from anywhere in your code). It would be the explanation if you intended to assign a value to m inside if statement and not to compare.

Note that if you do the same in strict mode, you won't get such behaviour as it doesn't allow to use variables that have never been declared.

edited Feb 26 '18 at 12:42

answered Feb 26 '18 at 12:34

oniondomes

2,034
13
22

Ahh, that explains it...I was not aware that undeclared variable goes automatically to global. Thanks! – Yellowhill Feb 26 '18 at 12:41

score 1 · Answer 3 · answered Feb 26 '18 at 12:43

You observe this behaviour because you are making an assignment to a previously non declared variable and you are executing your code in non-strict mode.

The line:

if ({m} = a ) {

Is effectively an assignment of the m field of the variable a to a variable m. Now because m has not been previously declared nor exists in the global scope two things can happen:

in non strict mode this degenerate into an assignement to window['m'] which makes it available globally
in strict mode you get a reference error.

Imo the last behaviour should be the behaviour you should be targeting as it is (imo) the least "surprising" one.

Object destructing in if-condition results in global variable?

3 Answers3