<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: peter munyambu</title>
    <description>The latest articles on DEV Community by peter munyambu (@peter2610).</description>
    <link>https://dev.to/peter2610</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3306034%2F9b642cd1-911d-406c-900e-8823b2b2d72d.png</url>
      <title>DEV Community: peter munyambu</title>
      <link>https://dev.to/peter2610</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/peter2610"/>
    <language>en</language>
    <item>
      <title>Understanding Variables in JavaScript: var, let, and const Explained for Beginners</title>
      <dc:creator>peter munyambu</dc:creator>
      <pubDate>Sun, 29 Jun 2025 17:19:01 +0000</pubDate>
      <link>https://dev.to/peter2610/understanding-variables-in-javascript-var-let-and-const-explained-for-beginners-cmc</link>
      <guid>https://dev.to/peter2610/understanding-variables-in-javascript-var-let-and-const-explained-for-beginners-cmc</guid>
      <description>&lt;p&gt;published: true&lt;br&gt;
description: &lt;br&gt;
A beginner-friendly guide to understanding the differences between var, let, and const in JavaScript, with examples and use cases."&lt;br&gt;
tags: javascript, beginners, webdev, programming&lt;/p&gt;

&lt;p&gt;Introduction&lt;br&gt;&lt;br&gt;
When I started learning JavaScript, one of the first things I came across were the keywords &lt;code&gt;var&lt;/code&gt;, &lt;code&gt;let&lt;/code&gt;, and &lt;code&gt;const&lt;/code&gt;. At first, they all seemed to do the same thing — they allowed me to create variables. But as I went deeper, I realized that there are big differences between them. In this post, I’ll explain what each one does, when to use them, and why choosing the right one is important for writing clean and bug-free code.&lt;/p&gt;

&lt;p&gt;What Are Variables?&lt;br&gt;&lt;br&gt;
In programming, variables are like containers that store data. You give them a name, and they hold a value that you can use or change later.&lt;/p&gt;

&lt;p&gt;Here’s a simple example:&lt;/p&gt;

&lt;p&gt;js&lt;br&gt;
let name = "Sam";&lt;br&gt;
const age = 25;&lt;br&gt;
var job = "Engineer";&lt;/p&gt;

&lt;p&gt;All of these lines declare a variable, but the way JavaScript treats them under the hood is different.&lt;/p&gt;

&lt;p&gt;var vs let vs const&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;code&gt;var&lt;/code&gt; – The Old Way&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;code&gt;var&lt;/code&gt; is the original way of declaring variables in JavaScript. It works, but it has some problems because it doesn’t have block scope.&lt;/p&gt;

&lt;p&gt;js&lt;br&gt;
if (true) {&lt;br&gt;
  var message = "Hello from inside!";&lt;br&gt;
}&lt;br&gt;
console.log(message); // ✅ Still works!&lt;/p&gt;

&lt;p&gt;That means &lt;code&gt;message&lt;/code&gt; is available outside the &lt;code&gt;if&lt;/code&gt; block, which can lead to unexpected bugs.&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;code&gt;let&lt;/code&gt; – The Modern Way&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;code&gt;let&lt;/code&gt; was introduced in ES6 (2015) and is now the recommended way to declare variables that can change later. It has block scope, which is much safer.&lt;/p&gt;

&lt;p&gt;js&lt;br&gt;
if (true) {&lt;br&gt;
  let greeting = "Hi!";&lt;br&gt;
}&lt;br&gt;
console.log(greeting); // ❌ Error: greeting is not defined&lt;/p&gt;

&lt;p&gt;This is good because it keeps your variables inside the block they belong to.&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;code&gt;const&lt;/code&gt; – For Values That Don’t Change&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;code&gt;const&lt;/code&gt; is also block-scoped like &lt;code&gt;let&lt;/code&gt;, but you can’t reassign it once it has a value.&lt;/p&gt;

&lt;p&gt;js&lt;br&gt;
const planet = "Earth";&lt;br&gt;
planet = "Mars"; // ❌ Error: Assignment to constant variable&lt;/p&gt;

&lt;p&gt;It’s perfect for things you know won’t change, like configuration values or fixed data.&lt;/p&gt;

&lt;p&gt;When Should You Use Which?&lt;/p&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Keyword&lt;/th&gt;
&lt;th&gt;Can Reassign?&lt;/th&gt;
&lt;th&gt;Block Scoped?&lt;/th&gt;
&lt;th&gt;Common Use&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;var&lt;/td&gt;
&lt;td&gt;✅ Yes&lt;/td&gt;
&lt;td&gt;❌ No&lt;/td&gt;
&lt;td&gt;Avoid if possible (old JS)&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;let&lt;/td&gt;
&lt;td&gt;✅ Yes&lt;/td&gt;
&lt;td&gt;✅ Yes&lt;/td&gt;
&lt;td&gt;Use when the value may change&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;const&lt;/td&gt;
&lt;td&gt;❌ No&lt;/td&gt;
&lt;td&gt;✅ Yes&lt;/td&gt;
&lt;td&gt;Use when the value should stay constant&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;

&lt;p&gt;Common Mistakes to Avoid&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Using &lt;code&gt;var&lt;/code&gt; in modern code – it can cause confusing behavior because it ignores block scope.&lt;/li&gt;
&lt;li&gt;Using &lt;code&gt;const&lt;/code&gt; for variables you plan to change – this will throw errors if you try to reassign.&lt;/li&gt;
&lt;li&gt;Not initializing a variable – always give a variable a value when you declare it, especially with &lt;code&gt;const&lt;/code&gt;.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;My Takeaway&lt;/p&gt;

&lt;p&gt;At first, I was using &lt;code&gt;var&lt;/code&gt; for everything. But after learning how &lt;code&gt;let&lt;/code&gt; and &lt;code&gt;const&lt;/code&gt; help protect my code from bugs, I now mostly use &lt;code&gt;const&lt;/code&gt; unless I need to change the value later, in which case I use &lt;code&gt;let&lt;/code&gt;. I avoid &lt;code&gt;var&lt;/code&gt; entirely unless I’m working in an older codebase.&lt;/p&gt;

&lt;p&gt;Resources&lt;/p&gt;

&lt;p&gt;&lt;a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let" rel="noopener noreferrer"&gt;MDN Web Docs: let&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const" rel="noopener noreferrer"&gt;MDN Web Docs: const&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://www.freecodecamp.org/news/javascript-var-let-const/" rel="noopener noreferrer"&gt;FreeCodeCamp: JavaScript Variables&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Conclusion&lt;/p&gt;

&lt;p&gt;Understanding the difference between &lt;code&gt;var&lt;/code&gt;, &lt;code&gt;let&lt;/code&gt;, and &lt;code&gt;const&lt;/code&gt; is a small but powerful step in learning JavaScript. It helps you write cleaner, safer code and avoid tricky bugs. As a beginner, I’ve found that focusing on &lt;code&gt;let&lt;/code&gt; and &lt;code&gt;const&lt;/code&gt; gives me better control over how my variables behave.&lt;/p&gt;

&lt;p&gt;Thanks for reading! If you’re learning JavaScript too, I’d love to hear what helped you understand variables better.&lt;/p&gt;

&lt;p&gt;Let me know if you’d like a second blog post on another concept (like &lt;code&gt;functions&lt;/code&gt;, &lt;code&gt;arrays&lt;/code&gt;, or &lt;code&gt;DOM manipulation&lt;/code&gt;) or if you want help designing a custom blog using HTML/CSS/JS!&lt;/p&gt;

</description>
    </item>
  </channel>
</rss>
