{"id":136267,"date":"2024-01-30T17:40:38","date_gmt":"2024-01-30T17:40:38","guid":{"rendered":"https:\/\/www.sushilkumar.ind.in\/blog\/?p=136267"},"modified":"2024-01-31T13:00:13","modified_gmt":"2024-01-31T13:00:13","slug":"what-are-the-differences-between-var-let-and-const-in-javascript","status":"publish","type":"post","link":"https:\/\/www.sushilkumar.ind.in\/blog\/javascript\/what-are-the-differences-between-var-let-and-const-in-javascript\/","title":{"rendered":"What are the differences between var, let and const in JavaScript?"},"content":{"rendered":"\n

var<\/strong>, let<\/strong>, and const<\/strong> are all used for variable declaration in JavaScript, but they have some differences in terms of scope<\/strong>, hoisting<\/strong>, and mutability<\/strong>:<\/p>\n\n\n\n

var<\/strong>:<\/p>\n\n\n\n

Variables declared with var<\/strong> are function-scoped or globally scoped, but not block-scoped.<\/p>\n\n\n\n

They are hoisted to the top of their function or global scope, which means you can access them before they are declared.<\/p>\n\n\n\n

You can redeclare a variable using var<\/strong> within the same scope.<\/p>\n\n\n\n

var<\/strong> variables can be reassigned.<\/p>\n\n\n\n

function example() {\n    var x = 10;\n    if (true) {\n        var x = 20; \/\/ This will overwrite the previous value of x\n        console.log(x); \/\/ Output: 20\n    }\n    console.log(x); \/\/ Output: 20\n}<\/code><\/pre>\n\n\n\n
let<\/strong>:<\/p>\n\n\n\n
Variables declared with let<\/strong> are block-scoped, which means they are only accessible within the block they are defined in.<\/p>\n\n\n\n
They are not hoisted to the top of the block.<\/p>\n\n\n\n
You cannot redeclare a variable using let<\/strong> within the same scope.<\/p>\n\n\n\n
let<\/strong> variables can be reassigned.<\/p>\n\n\n\n
function example() {\n    let x = 10;\n    if (true) {\n        let x = 20; \/\/ This creates a new variable x that shadows the outer x\n        console.log(x); \/\/ Output: 20\n    }\n    console.log(x); \/\/ Output: 10\n}<\/code><\/pre>\n\n\n\n
const<\/strong>:<\/p>\n\n\n\n
Variables declared with const<\/strong> are block-scoped like let.<\/p>\n\n\n\n
They must be initialized when declared and cannot be reassigned.<\/p>\n\n\n\n
However, const<\/strong> does not make objects immutable. You can still modify the properties of a const<\/strong> object.<\/p>\n\n\n\n
const y = 3.14;\ny = 3; \/\/ This will throw an error\n\nconst person = {\n    name: 'John',\n    age: 30\n};\nperson.age = 40; \/\/ This is allowed<\/code><\/pre>\n\n\n\n
In general, it’s recommended to use const by default for variable declaration, unless you know the variable will need to be reassigned later. Use let when you need a variable that may change its value, and avoid using var due to its hoisting behavior and potential issues with scope.<\/p>\n","protected":false},"excerpt":{"rendered":"
var, let, and const are all used for variable declaration in JavaScript, but they have some differences in terms of scope, hoisting, and mutability: var: Variables declared with var are function-scoped or globally scoped, but not block-scoped. They are hoisted to the top of their function or global scope, which means you can access them …<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","enabled":false},"version":2}},"categories":[323],"tags":[],"class_list":["post-136267","post","type-post","status-publish","format-standard","","category-javascript"],"jetpack_publicize_connections":[],"acf":[],"aioseo_notices":[],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p99pkJ-zrR","_links":{"self":[{"href":"https:\/\/www.sushilkumar.ind.in\/blog\/wp-json\/wp\/v2\/posts\/136267"}],"collection":[{"href":"https:\/\/www.sushilkumar.ind.in\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.sushilkumar.ind.in\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.sushilkumar.ind.in\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.sushilkumar.ind.in\/blog\/wp-json\/wp\/v2\/comments?post=136267"}],"version-history":[{"count":2,"href":"https:\/\/www.sushilkumar.ind.in\/blog\/wp-json\/wp\/v2\/posts\/136267\/revisions"}],"predecessor-version":[{"id":136269,"href":"https:\/\/www.sushilkumar.ind.in\/blog\/wp-json\/wp\/v2\/posts\/136267\/revisions\/136269"}],"wp:attachment":[{"href":"https:\/\/www.sushilkumar.ind.in\/blog\/wp-json\/wp\/v2\/media?parent=136267"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.sushilkumar.ind.in\/blog\/wp-json\/wp\/v2\/categories?post=136267"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.sushilkumar.ind.in\/blog\/wp-json\/wp\/v2\/tags?post=136267"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}