javascript - Access variable in if block - Stack Overflow

admin管理员组

文章数量:1312906

var func = function () {
   var i: number = 0;
   if (i == 0) {
      var y: number = 1;
   }

   document.body.innerHTML = y.toString(); // js/ts should plain me in this line
};

func(); // output: 1

As you can see, I've declared variable y inside if block. So, I think it couldn't be referenced outside the scope.

But, when I've tried to run the code, the output is 1.

Is it an issue in typescript/javascript?

var func = function () {
   var i: number = 0;
   if (i == 0) {
      var y: number = 1;
   }

   document.body.innerHTML = y.toString(); // js/ts should plain me in this line
};

func(); // output: 1

As you can see, I've declared variable y inside if block. So, I think it couldn't be referenced outside the scope.

But, when I've tried to run the code, the output is 1.

Is it an issue in typescript/javascript?

• javascript
• typescript

Share Improve this question Follow asked Jan 27, 2016 at 6:40 TânTân 1 5

• 2 No, it is by design. – Hamlet Hakobyan Commented Jan 27, 2016 at 6:44
• 3 var in if is scoped to the function not the if. – Sam Commented Jan 27, 2016 at 6:44
• 3 I don't think typescript differs from javascript here, and var has function scope. Use let instead. – Bergi Commented Jan 27, 2016 at 6:44
• Possible duplicate of Understanding JavaScript hoisting and truthy & falsy – Harpreet Singh Commented Jan 27, 2016 at 6:57
• @HarpreetSingh How duplicate? – Tân Commented Jan 27, 2016 at 7:00

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 6

Variables in Javascript are hoisted, meaning that var y is moved to the top of the function as if it were declared there.

Initialization, however is not hoisted, so if you change i to be something other than 0, the variable y will still exist, but it will have the value undefined.

This means that the function is exactly equivalent to:

var func = function () {
   var i: number = 0;
   var y: number;
   if (i == 0) {
       y = 1;
   }

   document.body.innerHTML = y.toString(); // js/ts should plain me in this line
};

To get the behavior you expect, you need to use let, which is a part of ECMAScript 2015 (ES6). It is block scoped, as you expect. It will also effectively work so that it is accessible only from the point of definition onwards, which is also probably as you would expect.

If you re-declare a JavaScript variable, it will not lose its value.

The second reference might pave way for a new variable syntax. Actually if you recall variable declaration is not neccessary in javascript. Simpe

y=1;

also works.

The second time when you reference y, outside if block, in my opinion, it tries a re-declaration and retains the old value.

Reference - http://www.w3schools./js/js_variables.asp & http://www.w3schools./js/js_scope.asp

Javascript has function scope afaik. Any variable declared within a function, should be accessible from anywhere within the function. So, if you have a function checking if i==0, then you can achieve what you are trying to achieve.

This is as it is supposed to be. Javascript scopes by function, not by block. (This does make it unlike many popular languages)

Variables declared like var myVar = 10; will seep into nested functions but not the other way around. Variables declared like myVar = 10; will go global.

I couldn't find anything which suggested that typescript was any different.

Variables declared inside of an if statement are not scoped to the if statement. They're scoped to the current execution context. There's the Global execution context and then when a function is run, it creates it's own execution context. Inside of your function, you created the variables y and i. It doesn't matter that y was created inside of the if statement, because once it runs, y is created in the scope of the function. So then you do y.toString(), which can access y because it's scoped to the function not the if statement. That's why you get the output of 1. This is not an error, it's by design.

本文标签： javascriptAccess variable in if blockStack Overflow