Javascript 简明教程

JavaScript - Variables

JavaScript Variables

JavaScript 变量被用来存储随后可更改的数据。这些变量可以被认为是有名称的容器。你可以将数据放入这些容器中，然后简单地通过命名该容器来引用数据。

在 JavaScript 程序中使用变量之前，你必须声明它。在 JavaScript 中，你可以用 4 种方式声明变量 −

  1. Without using any keywords.

  2. Using the 'var' keyword.

  3. Using the 'let' keyword.

  4. Using the 'const' keyword.

let 和 const 关键词在 2015 年（ES6）引入 JavaScript 中。在 ES6 之前，只使用 var 关键词在 JavaScript 中声明变量。在本节中，我们将介绍“var”关键词。我们将在后续章节中介绍“let”和“const”关键词。

Variable Declaration in JavaScript

无需使用任何关键字，您可以按照以下语法声明变量。

<script>
   Money = 10;
   Name = "tutorialspoint";
</script>

此外，您可以使用 var 关键字声明变量，如下所示。

<script>
   var money;
   var name;
</script>

你也可以使用相同的 var 关键字声明多个变量，如下所示：

<script>
   var money, name;
</script>

Variable Initialization using the Assignment Operator

将值存储在变量中称为 variable initialization 。可以在创建变量时初始化变量，也可以在需要变量的稍后时间点进行初始化。

例如，你可能会创建一个名为 money 的变量，稍后为其分配 2000.50 的值。对于另一个变量，你可以在初始化时分配值，如下所示：

<script>
   var name = "Ali";
   var money;
   money = 2000.50;
</script>

Note − 只在文档中任何变量名的生命周期中使用 var 关键字进行声明或初始化。你不应重新声明同一个变量两次。

JavaScript 是 untyped language 。这意味着 JavaScript 变量可以保存任何数据类型的值。与许多其他语言不同，在变量声明时不需要告知 JavaScript 变量将保存何种类型的值。变量的值类型可在程序执行期间发生变化，JavaScript 会自动处理。

JavaScript Data Types

在 JavaScript 中，变量可以保存动态数据类型的值。例如，可以在 JavaScript 变量中存储数字、字符串、布尔值、对象等等数据类型值。

<script>
   var num = 765; // Number
   var str = "Welcome"; // String
   var bool = false; // Boolean
</script>

您将在 JavaScript Data Types 中详细了解数据类型。

JavaScript Variable Names (Identifiers)

在 JavaScript 中，使用唯一字符序列对称为标识符的变量进行命名。

以下是一些有关在 JavaScript 中对标识符进行命名的规则：

  1. Valid characters —在 JavaScript 中，变量名可以包含数字、字母字符和特殊字符，例如下划线 (_) 和美元符号 ($)。JavaScript 变量名不应以数字 (0-9) 开头。它们必须以字母或下划线字符开头。例如， 123test 是无效变量名，但 _123test 是有效变量名。

.

  1. Case sensitivity - 变量名区分大小写。这意味着 Name 和 name 是不同的标识符。

  2. Unicode support —标识符还可以包含 Unicode。因此，开发人员可以使用任何语言定义变量。

  3. Reserve keywords —不应将任何 JavaScript 保留关键字用作变量名。例如， break 或 boolean 变量名称无效。在这里，我们给出了 JavaScript revered keywords 的完整列表。

JavaScript Dollar Sign ($) and Under Score (_)

您可以使用 $ 和 _ 在 JavaScript 中定义变量，因为 JavaScript 引擎将其视为有效字符。

Example (Demonstrating the identifiers)

在此示例中，我们使用 var 关键字定义了变量。第一个变量名以下划线开头，第二个变量名以美元符号开头。程序员可以取消对第三个变量声明的注释，以检查当我们从数字开始任何标识符时 JavaScript 生成的错误。

<html>
<head>
    <title> Variables in JavaScript </title>
</head>
<body>
   <script>
        var _abc = "Hi!";
        var $abc = "Hello!";
        //  var 9abc = "Bye!";  // This is invalid
        document.write("_abc " + _abc + "<br>");
        document.write("$abc = " + $abc + "<br>");
    </script>
</body>
</html>

它生成以下结果：

_abc Hi!
$abc = Hello!

Undefined Variable Value in JavaScript

在声明后不初始化变量时，它包含 undefined 值。不过，您还可以将 undefined 值分配给变量。

我们来看一下下面的示例。

Example

<html>
<body>
   <script>
      var num;
      document.write("The value of num is: " + num + "<br/>");
   </script>
</body>
</html>

这会产生以下结果：

The value of num is: undefined

JavaScript Variable Scope

变量的范围是程序中定义它的区域。JavaScript 变量只有两个范围。

  1. Global Variables − 全局变量具有全局范围，这意味着它可以在 JavaScript 代码的任何位置进行定义。

  2. Local Variables − 局部变量只会在其被定义的函数中可见。函数参数始终局部于该函数。

在函数体中，局部变量优于具有相同名称的全局变量。如果使用全局变量的相同名称声明局部变量或函数参数，则可以有效隐藏全局变量。了解以下示例。

Example

在下面的示例中，我们已定义了名为 myVar 的变量（在函数外部），并将其初始化为 'global' 值。此外，我们已定义具有相同标识符的变量（在 checkscope() 函数内部），并将其初始化为 'local' 值。

我们在函数内部打印 myVar 变量值。因此，局部变量优先于全局变量，并在输出中打印 'local'。

<html>
<head>
   <title> JavaScript Variable Scope Example</title>
</head>
<body onload = checkscope();>
   <script>
	  var myVar = "global";      // Declare a global variable
	  function checkscope( ) {
		 var myVar = "local";    // Declare a local variable
		 document.write(myVar);
	  }
   </script>
</body>
</html>

这会产生以下结果：

local

Example

在下面的示例中，我们已定义变量，但未使用 var 关键字。 name 变量包含 string 类型的值，而 number 变量包含 float 数据类型的

如果我们不使用任何关键字来定义变量，JavaScript 将其视为全局变量，且可以在代码内的任何位置使用它们。

<html>
<head>
   <title> Variables without var keyword </title>
</head>
<body>
   <script>
      name = "tutorialspoint"; // String type variable
      number = 10.25; // Number type variable
      document.write("name = " + name + ", number = " + number + "<br>");
   </script>
</body>
</html>

这会产生以下结果：

name = tutorialspoint, number = 10.25

此外，如果我们使用具有值的 var 关键字来声明变量，并重新声明相同的标识符而未进行初始化，则该标识符不会丢失先前的值。让我们通过以下示例来理解。

Example

在下面的示例中，我们声明了 age 变量并用 10 对其进行了初始化。我们再次声明 age 变量，但未对其进行初始化。即使如此，它仍会输出 10，因为它不会丢失先前的初始化值。但是，如果我们更新 age 变量的值，它会成功更新该值。

<html>
<head>
   <title> Variables with var keyword </title>
</head>
<body>
   <script>
      var age = 10;
      var age;
      document.write("age = " + age + "<br>");
   </script>
</body>
</html>

这会产生以下结果：

age = 10