JavaScript 变量名可以使用哪些字符？

在本文中，我们将学习哪些字符对 JavaScript 变量名有效。

我们使用变量来保存值。首先，我们必须定义变量，然后才能为其赋值。我们可以使用变量名在代码中访问变量。使用变量名，我们可以重新分配其值。

只要您遵循一些原则，变量名就非常灵活。

规则

  • 第一个字符必须是字母、美元符号($) 或下划线 (_) 。数字不能作为第一个字符。

  • 任何字母、数字或下划线都可以构成变量名的其余部分。您不能使用某些字符，例如空格、符号和标点符号。

  • 变量名区分大小写。

  • 变量名可以根据您的需要任意长。

  • 变量名不能包含 JavaScript 中的保留字。

不允许作为变量名的关键字

break, case, catch, continue, debugger, default, delete, do, else, finally, for,

function, if, in, instanceof, new, return, switch, this, throw, try, typeof, var,

void, while, and with

ES5 在普通模式下为将来保留的关键字

class, const, enum, export, extends,
import, and super.

ES5 在严格模式下为将来保留的关键字

implements, interface, let, package,
private, protected, public, static, and yield

ES5 未保留的词

int, byte, char, goto, long, final, float,

short, double, native, throws, boolean, abstract, volatile, transient, and synchronized

正确的变量

test
TEST
$test
_test
_123test
test_value123$
testValue

根据 ECMA 脚本有效的变量

var π;//pi 
var ಠ_ಠ; 
var ლ_ಠ益ಠ_ლ; 
var λ;//lamda
var \u006C\u006F\u006C\u0077\u0061\u0074; 
var foo\u200Cbar;
var 〱〱; var price_99̶_89;
var Ꙭൽↈⴱ;
var ᱹ;//dot
var τ; // tau
var ℏ;// Dirac’s constant
var ε;//Euler's constant
var Ѵ;//Square root
(function() { var NaN;//Valid inside function }());

错误的变量

class – Should not use JavaScript keywords.
a bc – Should not contain space.
#abc – Should not start with special characters.
2abc – Should not start with a number.

根据 ECMA 脚本无效的变量

var NaN;//In the global scope

用户可以遵循以下语法来检查变量名的正确性。

function isValidVariable(name) {
   try {
      Function('var ' + name);
   } catch (e) {
      return false;
   }
   return true;
}

要检查变量名是否有效，我们可以使用此语法框中给出的函数。

建议

  • 明智的做法是选择一种命名规范并在整个代码中坚持使用它。例如：骆驼命名法。代码看起来整洁且专业。

  • 在命名变量时使用多个单词。这将确认变量名称的准确性。

  • 避免使用非常短的变量名。

  • 使用有意义的变量名。例如，OrderNum 或 Order_Num。

示例 1

在此示例中，我们使用上面给出的语法检查 JavaScript 变量的有效性。我们将静态变量名作为输入传递给函数。这里它是一个正确的变量名。

<html>
<body>
   <h2>Check the validity of a variable name<i></h2>
   <div id = "btnWrap">
      <p>Click the button</p>
      <button onclick = "isValidVariable()"> Click Me</button>
   </div>
   <div id = "dispDom1"></div>
   <div id = "dispDom2"></div>
   <script>
      var varNamBtn = document.getElementById("btnWrap");
      var varNamOutput1 = document.getElementById("dispDom1");
      var varNamOutput2 = document.getElementById("dispDom2");
      var varNamStr = "";
      function isValidVariable()
      {
         var cbk = function(name)
         {
            try
            {
               Function('var ' + name);
            } catch (e)
            {
               varNamOutput1.innerHTML = "<b>" + name + "</b> is an invalid variable name";
               return false;
            }
            varNamOutput2.innerHTML = "<b>" + name + "</b> is a valid variable name";
            return true;
         };
         cbk('test');
         cbk('#test');
      }
   </script>
</body>
</html>

示例 2

在此示例中，我们使用上面给出的语法检查 JavaScript 变量的有效性。我们将动态变量名作为用户的输入传递给函数。

<html>
<body>
   <h2>Checking the validity of Varible Name</h2>
   <div id = "btnWrap">
      <p>Enter a variable name and click the button</p>
      <input id = "varNamUsrInp" type = "text" placeholder = "Enter a variable name"/>
      <button onclick = "isValidUserVariable()">Click Me</button>
   </div>
   <div id = "dispDom1"></div>
   <script>
      var varNamUsrBtn = document.getElementById("btnWrap");
      var varNamUsrOutput1 = document.getElementById("dispDom1");
      var varNamUsrInput = document.getElementById("varNamUsrInp");
      var varNamUsrStr = "";
      function isValidUserVariable()
      {
         var name = varNamUsrInput.value;
         var cbk = function(name)
         {
            try
            {
               Function('var ' + name);
            } catch (e)
            {
               varNamUsrOutput1.innerHTML = "<b>" + name + "</b> is an invalid variable name";
               return false;
            }
            varNamUsrOutput1.innerHTML = "<b>" + name + "</b> is a valid variable name";
            return true;
         };
         cbk(name);
      }
   </script>
</body>
</html>

在本教程中，我们了解了 JavaScript 变量的有效字符。我们建议遵循命名约定以更好地编写代码。

更新于: 2022年10月31日

6K+ 阅读量

开启您的 职业生涯

通过完成课程获得认证

开始学习
广告