Typescript: use of word "let"

curiouswebster
curiouswebster used Ask the Experts™
on
I see Typescript can define statically types variable with the word "let"

how do these two lines differ?

let name: string = 'Bob';

name: string = 'Bob';
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
David FavorLinux/LXD/WordPress/Hosting Savant
Distinguished Expert 2018
Commented:
https://medium.com/javascript-scene/javascript-es6-var-let-or-const-ba58b8dcde75 provides some great considerations of when to use each of var + let + const.
curiouswebsterSoftware Engineer

Author

Commented:
thanks
Most Valuable Expert 2017
Distinguished Expert 2018
Commented:
The accepted answer is a blind link that might go stale.

For anyone else visiting this thread here is some additional information.

let is not Typescript - it is JavaScript. It is part of the ECMAScript 2015 (ES6) specification supported IE 11+
Typescript adds typing to JavaScript - but let will work in plain JavaScript (subject to browser support).

let defines a variable local to a block - unlike var which is global or to the nearest function
You can read more about it here (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let)

The difference in the two declarations comes to scoping. Let will only be valid within the current block or expression. Omitting let and var makes the variable global to the application - this should be avoided.
So the following will be global throughout application - refer 'z' in example below
name: string = 'Bob'; 

Open in new window


Consider this code
<script>
var x = 10;
var yy = 30;
var y = 40;
test();
console.log(z); // 1010
function test()
{
	var x = 20;
	z = 1010;
	console.log('Global to function (x): ' + x); // 10
	console.log('Global to function (y): ' + y); // undefined
	{
		let x = 200;
		var y = 2001;
		console.log('Block(x): ' + x);
		console.log('Block(y): ' + y);
	}
	console.log('Back in function(x): ' + x);
	console.log('Back in function(y): ' + y);
}
</script>

Open in new window


Output
Global to function (x): 20 // Global to function - overrides x on the on root scope
Global to function (y): undefined // Not defined because we have defined a local version but not assigned it yet
Block(x): 200 // Overrides the earlier declarations of x but only for this block
Block(y): 2001 // Overrides the earlier declarations of y but using var so will affect all instances in the function scope - see below
Back in function(x): 20 // x gets its original value from start of function because let active only in { } scope
Back in function(y): 2001 // y overwritten because var works on the function scope
1010 // z declared in function without var or let - so it becomes global

Open in new window

Become a Microsoft Certified Solutions Expert

This course teaches how to install and configure Windows Server 2012 R2.  It is the first step on your path to becoming a Microsoft Certified Solutions Expert (MCSE).

curiouswebsterSoftware Engineer

Author

Commented:
I'd like to re-open this question and give the majority of points to this second answer. I'm afraid to click on "Report Question" unless that's the new way to request help.
curiouswebsterSoftware Engineer

Author

Commented:
Thanks for such a thorough answer!
Most Valuable Expert 2017
Distinguished Expert 2018

Commented:
You are welcome.

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial