{"id":4297,"date":"2022-03-03T08:38:43","date_gmt":"2022-03-03T08:38:43","guid":{"rendered":"http:\/\/truelogic.org\/wordpress\/?p=4297"},"modified":"2022-03-03T08:38:45","modified_gmt":"2022-03-03T08:38:45","slug":"javascript-let-var-and-const","status":"publish","type":"post","link":"https:\/\/truelogic.org\/wordpress\/2022\/03\/03\/javascript-let-var-and-const\/","title":{"rendered":"Javascript – let, var and const"},"content":{"rendered":"\n

OVERVIEW<\/strong><\/p>\n\n\n\n

There are some small but important differences between using var<\/em>, let<\/em> and const<\/em>:<\/p>\n\n\n\n

A var<\/em> can be re-declared and reassigned different values. Let<\/em> variables can be reassigned different values but cannot be redeclared. A const<\/em> can only be declared and assigned once. <\/p>\n\n\n\n

In terms of scope a var<\/em> variable is either function scoped or global scoped. That means if a var<\/em> is declared within a function, then it is visible throughout the function and if a var<\/em> is declared at the global level then it is visible everywhere. If a var<\/em> is declared at the global and also at the function level then the function level declaration overrides the global declaration.<\/p>\n\n\n\n

Let<\/em> variables and const<\/em> variable have block scope. A block scope is any block of code within opening and closing curly braces – {}. So they have much more fine scope control.<\/p>\n\n\n\n

The sample code below shows the various characteristics describe above<\/p>\n\n\n\n

SAMPLE CODE<\/strong><\/p>\n\n\n

\n<html>\n\t<head>\n\t<script>\n\n\t\tvar varItem = "one";\n\t\tdocument.write(varItem + "<br>");\n\t\tvar varItem = 24.55;\n\t\tdocument.write(varItem + "<br>");\n\t\tdocument.write("<hr>");\n\t\tlet letItem = "two";\n\t\tdocument.write(letItem + "<br>");\n\t\t\/\/let letItem = 189; \/\/ this line will give an error\n\t\tdocument.write(letItem + "<br>");\n\t\tdocument.write("<hr>");\n\t\tconst constItem =449;\n\t\tdocument.write(constItem + "<br>");\n\t\t\/\/constItem = 444; \/\/ this line will give an error\n\t\tdocument.write(constItem + "<br>");\n\n\t\tlet globalLet = "global";\n\t\tdocument.write("globalLet in global scope=" + globalLet + "<br>");\n\n\t\tfunc();\n\n\t\tvar testVar = "test1";\n\t\tfunction func() {\n\t\t\tvar testVar = "test2";\n\t\t\tif (1 < 2) {\n\t\t\t  var funcVar = "functionVar";\n\t\t\t}\n\t\t\tlet globalLet = "function";\n\t\t\tdocument.write("globalLet in function scope=" + globalLet + "<br>");\n\t\t\tdocument.write("testar=" + testVar + "<br>");\n\t\t\tdocument.write("funcVar=" + funcVar);\n\t\t}\n\t<\/script>\n\t<\/head>\n\t<body>\n\t<\/body>\n<\/html>\n\n<\/pre><\/div>\n\n\n
The output is shown below<\/p>\n\n\n\n
one\n24.55\n\ntwo\ntwo\n\n449\n449\nglobalLet in global scope=global\nglobalLet in function scope=function\ntestar=test2\nfuncVar=functionVar <\/pre>\n","protected":false},"excerpt":{"rendered":"
OVERVIEW There are some small but important differences between using var, let and const: A var can be re-declared and reassigned different values. Let variables […]<\/a><\/p>\n<\/div>","protected":false},"author":1,"featured_media":2463,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[18],"tags":[],"class_list":["post-4297","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-javascript"],"_links":{"self":[{"href":"https:\/\/truelogic.org\/wordpress\/wp-json\/wp\/v2\/posts\/4297","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/truelogic.org\/wordpress\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/truelogic.org\/wordpress\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/truelogic.org\/wordpress\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/truelogic.org\/wordpress\/wp-json\/wp\/v2\/comments?post=4297"}],"version-history":[{"count":3,"href":"https:\/\/truelogic.org\/wordpress\/wp-json\/wp\/v2\/posts\/4297\/revisions"}],"predecessor-version":[{"id":4300,"href":"https:\/\/truelogic.org\/wordpress\/wp-json\/wp\/v2\/posts\/4297\/revisions\/4300"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/truelogic.org\/wordpress\/wp-json\/wp\/v2\/media\/2463"}],"wp:attachment":[{"href":"https:\/\/truelogic.org\/wordpress\/wp-json\/wp\/v2\/media?parent=4297"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/truelogic.org\/wordpress\/wp-json\/wp\/v2\/categories?post=4297"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/truelogic.org\/wordpress\/wp-json\/wp\/v2\/tags?post=4297"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}