变量

大多数情况下，JavaScript 应用程序需要处理信息。以下有两个示例

1. 在线商店 - 信息可能包括待售商品和购物车。
2. 聊天应用程序 - 信息可能包括用户、消息等等。

变量用于存储此信息。

变量

变量是数据的“命名存储”。我们可以使用变量来存储商品、访客和其他数据。

要在 JavaScript 中创建变量，请使用 let 关键字。

下面的语句创建（换句话说：声明）一个名为“message”的变量

let message;

现在，我们可以使用赋值运算符 = 向其中放入一些数据

let message;

message = 'Hello'; // store the string 'Hello' in the variable named message

该字符串现在已保存到与该变量关联的内存区域中。我们可以使用变量名访问它

let message;
message = 'Hello!';

alert(message); // shows the variable content

简而言之，我们可以将变量声明和赋值合并到一行中

let message = 'Hello!'; // define the variable and assign the value

alert(message); // Hello!

我们还可以在一行中声明多个变量

let user = 'John', age = 25, message = 'Hello';

这看起来可能更短，但我们不推荐这样做。为了提高可读性，请对每个变量使用一行。

多行变体稍长，但更容易阅读

let user = 'John';
let age = 25;
let message = 'Hello';

有些人还以这种多行样式定义多个变量

let user = 'John',
  age = 25,
  message = 'Hello';

…甚至以“逗号优先”的样式

let user = 'John'
  , age = 25
  , message = 'Hello';

从技术上讲，所有这些变体都执行相同的功能。因此，这取决于个人品味和美学。

var message = 'Hello';

一个现实生活中的类比

如果我们将变量想象成一个带有唯一名称贴纸的数据“盒子”，我们就可以轻松理解“变量”的概念。

例如，变量 message 可以想象成一个贴有 "message" 标签的盒子，其中包含值 "Hello!"

我们可以在该框中放入任何值。

我们还可以根据需要多次更改它

let message;

message = 'Hello!';

message = 'World!'; // value changed

alert(message);

当值更改时，旧数据将从变量中删除

我们还可以声明两个变量，并将数据从一个变量复制到另一个变量。

let hello = 'Hello world!';

let message;

// copy 'Hello world' from hello into message
message = hello;

// now two variables hold the same data
alert(hello); // Hello world!
alert(message); // Hello world!

let message = "This";

// repeated 'let' leads to an error
let message = "That"; // SyntaxError: 'message' has already been declared

变量命名

JavaScript 中的变量名称有两个限制

1. 名称必须仅包含字母、数字或符号 $ 和 _。
2. 第一个字符不能是数字。

有效名称示例

let userName;
let test123;

当名称包含多个单词时，通常使用 驼峰式命名法。即：单词一个接一个，除了第一个单词之外，每个单词都以大写字母开头：myVeryLongName。

有趣的是，美元符号 '$' 和下划线 '_' 也可以用于名称中。它们是普通符号，就像字母一样，没有任何特殊含义。

这些名称有效

let $ = 1; // declared a variable with the name "$"
let _ = 2; // and now a variable with the name "_"

alert($ + _); // 3

不正确的变量名称示例

let 1a; // cannot start with a digit

let my-name; // hyphens '-' aren't allowed in the name

let имя = '...';
let 我 = '...';

let let = 5; // can't name a variable "let", error!
let return = 5; // also can't name it "return", error!

// note: no "use strict" in this example

num = 5; // the variable "num" is created if it didn't exist

alert(num); // 5

"use strict";

num = 5; // error: num is not defined

常量

要声明常量（不可变）变量，请使用 const 而不是 let

const myBirthday = '18.04.1982';

使用 const 声明的变量称为“常量”。它们不能重新赋值。尝试这样做会导致错误

const myBirthday = '18.04.1982';

myBirthday = '01.01.2001'; // error, can't reassign the constant!

当程序员确信某个变量永远不会改变时，他们可以使用 const 声明它，以保证并向所有人传达这一事实。

大写常量

广泛的做法是将常量用作别名，用于在执行前已知的难以记住的值。

此类常量使用大写字母和下划线命名。

例如，让我们为颜色创建常量，采用所谓的“Web”（十六进制）格式

const COLOR_RED = "#F00";
const COLOR_GREEN = "#0F0";
const COLOR_BLUE = "#00F";
const COLOR_ORANGE = "#FF7F00";

// ...when we need to pick a color
let color = COLOR_ORANGE;
alert(color); // #FF7F00

优点

• COLOR_ORANGE 比 "#FF7F00" 更容易记住。
• 输入 "#FF7F00" 比输入 COLOR_ORANGE 更容易出错。
• 在阅读代码时，COLOR_ORANGE 比 #FF7F00 更具意义。

我们何时应该对常量使用大写，何时应该正常命名它？让我们阐明这一点。

成为“常量”仅仅意味着变量的值永远不会改变。但有些常量在执行前已知（如红色的十六进制值），而有些常量是在运行时（执行期间）计算出来的，但在其初始赋值后不会改变。

例如

const pageLoadTime = /* time taken by a webpage to load */;

pageLoadTime 的值在页面加载前是未知的，因此它被正常命名。但它仍然是一个常量，因为它在赋值后不会改变。

换句话说，大写命名的常量仅用作“硬编码”值的别名。

正确命名

说到变量，还有一件非常重要的事情。

变量名称应具有清晰、显而易见的意思，描述它存储的数据。

变量命名是编程中最重要的复杂技能之一。只需看一眼变量名称，就可以看出哪段代码是由初学者编写的，哪段代码是由经验丰富的开发人员编写的。

在一个实际项目中，大多数时间都花在修改和扩展现有代码库上，而不是从头开始编写完全独立的东西。当我们在做其他事情一段时间后返回到某些代码时，找到标记良好的信息会容易得多。或者换句话说，当变量具有良好的名称时。

在声明变量之前，请花时间考虑变量的正确名称。这样做将为你带来丰厚的回报。

一些值得遵循的规则是

• 使用人类可读的名称，如 userName 或 shoppingCart。
• 除非您知道自己在做什么，否则请远离缩写或短名称，例如a、b和c。
• 使名称尽可能具有描述性且简洁。不良名称的示例是data和value。此类名称没有任何意义。仅当代码的上下文非常明显地表明变量引用的数据或值时，才可以使用它们。
• 在您的团队和您的头脑中就术语达成一致。如果网站访问者被称为“用户”，那么我们应该将相关变量命名为currentUser或newUser，而不是currentVisitor或newManInTown。

听起来很简单？确实如此，但实际上创建描述性且简洁的变量名称并非易事。开始吧。

总结

我们可以使用var、let或const关键字声明变量来存储数据。

• let – 是一种现代变量声明。
• var – 是一种老式的变量声明。通常我们根本不使用它，但我们将在 旧的“var” 一章中介绍与let的细微差别，以防您需要它们。
• const – 类似于let，但变量的值不能更改。

变量的命名方式应使我们能够轻松理解变量中的内容。