Const vs Let in JavaScript.


Const and let were introduced in ES2015 to declare block scoped variables. While variables declared using let can be reassigned, they cannot be reassigned if they were declared using const.

Following is the code showing let and const in JavaScript −

Example

 Live Demo

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
   body {
      font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
   }
   .result,.sample {
      font-size: 20px;
      font-weight: 500;
   }
</style>
</head>
<body>
<h1>Const and let in JavaScript</h1>
<div class="sample"></div>
<div style="color: green;" class="result"></div>
<button class="Btn">CLICK HERE</button>
<h3>Click on the above button to reassign const and let value</h3>
<script>
   let resEle = document.querySelector(".result");
   let sampleEle = document.querySelector(".sample");
   let a = 22;
   const b = 44;
   sampleEle.innerHTML = "let a = " + a + " ";
   sampleEle.innerHTML += "const b = " + b;
   document.querySelector(".Btn").addEventListener("click", () => {
      a = 99;
      resEle.innerHTML = "Reassigning a = " + a + " ";
      try {
         changeB();
      }
      catch (err) {
         resEle.innerHTML += "Reassigning b = " + err;
      }
   });
   function changeB() {
      b = 22;
   }
</script>
</body>
</html>

Output

The above code will produce the following output −

On clicking the ‘CLICK HERE’ button −

Updated on: 16-Jul-2020

986 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements