当前位置：首页 > 文章列表 > 文章 > 前端 > JavaScript 中 `var`、`let` 和 `const` 之间的区别：简单解释

JavaScript 中 `var`、`let` 和 `const` 之间的区别：简单解释

来源：dev.to 2024-09-05 21:37:17 0浏览收藏

各位小伙伴们，大家好呀！看看今天我又给各位带来了什么文章？本文标题是《JavaScript 中 `var`、`let` 和 `const` 之间的区别：简单解释》，很明显是关于文章的文章哈哈哈，其中内容主要会涉及到等等，如果能帮到你，觉得很不错的话，欢迎各位多多点评和分享！

想象一下您正在整理您的家。 javascript 中的每种类型的变量——var、let 和 const——就像不同类型的空间一样，你可以在其中存储你的东西。让我们看看它如何与日常物品和代码示例相结合，使其更加清晰！

1. var – 凌乱的抽屉

将 var 想象成那个杂乱的厨房抽屉，里面装满了不同的东西，有点杂乱无章。你可以把任何东西放进去，而且无论你在厨房的哪个位置，都可以随时取用。

运作原理：

可在厨房的任何地方使用：无论您靠近水槽还是炉灶，都没关系；您可以随时打开抽屉并拿取里面的东西。
你的东西乱七八糟：如果你在抽屉里放了一些东西，然后尝试放同名的其他东西，所有东西都会变得混乱并且可以工作，但它可能会变得混乱。

// example of var
var item = "mug";
console.log(item); // prints "mug"

var item = "plate"; // allows redeclaration
console.log(item); // now prints "plate"

现实生活中的例子：你把一双袜子放在抽屉里，但后来忘记了，又放了另一双同种的袜子。袜子混在一起，分不清哪一双是哪双。

JavaScript 中 `var`、`let` 和 `const` 之间的区别：简单解释

2.let——有组织的工具箱

现在，将 let 视为一个组织良好的工具箱。工具就在那里，但只有打开工具箱才能访问它们。它们存储在特定的位置，您需要打开正确的工具箱才能找到它们。

运作原理：

只能在工具箱中访问：工具整齐地保留在工具箱中，只有在打开它时才能使用它们。
更好的组织：如果您尝试将一把螺丝刀和另一把相同类型的螺丝刀放在同一个工具箱中，它不会让您这么做，因为每个工具都有自己的位置。

// example of let
let tool = "screwdriver";
console.log(tool); // prints "screwdriver"

tool = "hammer"; // can reassign the value
console.log(tool); // now prints "hammer"

// let tool = "hammer"; // this would cause an error, as you cannot redeclare

现实生活中的例子：如果你正在组装家具，螺丝刀只会在你打开工具箱时出现，当你关闭它时它会放回去。如果不先打开工具箱，您将无法访问该工具。

JavaScript 中 `var`、`let` 和 `const` 之间的区别：简单解释

3. const——上锁的保险箱

将 const 视为保险箱。一旦你把东西放进去，它就会保持锁定状态，无法更改。您可以重新排列保险箱内的物品，例如重新排列硬币，但保险箱本身会与您最初放入其中的物品保持锁定状态。

运作原理：

永远锁定：当你把东西放进保险箱时，比如宝藏，你可以重新排列里面的硬币，但你无法改变你把硬币放进保险箱的事实。
防止变化：如果您尝试用其他东西替换宝藏，保险箱根本不允许。

// Example of const
const safe = "Jewels";
console.log(safe); // Prints "Jewels"

// safe = "Money"; // This would cause an error, as you cannot reassign const

const coins = [1, 2, 3];
coins.push(4); // This is allowed
console.log(coins); // Prints [1, 2, 3, 4]

现实生活示例：想象一下您将珠宝放入保险箱中。你可以重新排列珠宝，但你无法改变保险箱的用途是存放这些珠宝的事实。

JavaScript 中 `var`、`let` 和 `const` 之间的区别：简单解释

将所有内容放在一起比较

var 就像那个杂乱的抽屉：你可以把任何东西放在那里，而且总是可以访问的，但要小心 - 东西很容易混淆！
- 示例：多次声明同一个变量而不会出错。
let 就像一个有组织的工具箱：只有当您打开工具箱时才能访问工具，从而使所有内容更有条理。
- 示例：let 变量可以重新赋值，但不能重新声明。
const 就像一个上锁的保险箱：一旦你在那里存储了一些东西，它就无法被替换，但你可以修改其中的内容。
- 示例：您无法更改 const 变量，但可以修改其中存储的数组中的项目。