《JavaScript和jQuery实战手册(原书第2版)》——2.4节变量

简介: 本节书摘来自华章社区《JavaScript和jQuery实战手册(原书第2版)》一书中的第2章,第2.4节变量,作者:David Sawyer McFarland,更多章节内容可以访问云栖社区“华章社区”公众号查看

2.4 变量
可以直接在JavaScript程序中输入数值、字符串或Boolean值,但是只有当我们已经有了所需的信息的时候,这些数据类型才有效。例如,可以让字符串“Hi Bob”出现在一个警告框中,如下所示:

alert('Hi Bob');

但是,只有在访问页面的每个人名字都叫Bob的时候,这条语句才有意义。如果你想要为不同的访问者显示一条个性化信息,名字就要根据访问页面的人而有所不同,例如'Hi Mary'、 'Hi Joseph'、'Hi Ezra'等。基本上所有的编程语言都提供了所谓的变量来处理这种情况。
变量是存储信息以便稍后使用或操作它们的一种方式。例如,假设有一个基于JavaScript的弹球游戏,其目标是获取最高分。当一个玩家初次开始游戏,他的分数是0,但是,随着弹球击中目标,得分逐渐增加。在这个例子中,分数(score)是一个变量,因为它从0开始但是随着游戏的进行而变化,换句话说,变量保存可以变化的信息。使用变量的另一个程序的例子如图2-1所示。
把变量看做一种篮子,我们可以在篮子中放置一个物品,看看篮子里的内容,把篮子里的东西倒出来,或者甚至用其他的物品替换篮子中的物品。然而,即便可以改变篮子里的内容,它仍然是同一个篮子。


8908218529f8d45e905990ca8c39f5f89fbcd531

2.4.1 创建变量
创建变量的过程分两步,包括声明变量和命名变量。在JavaScript中,要创建一个名为score的变量,需要输入:
var score;
第一部分var是一个JavaScript关键字,它创建了(或者用编程的术语来说,声明了)一个变量。这条语句的第二部分score是一个变量。怎么命名变量取决于你,但是,在命名变量的时候要遵守一些规则:
变量名必须以一个字母、$或_开头。换句话说,不能以数字或标点符号开始一个变量:因此,1thing和&thing是无效的,但是score、$score和_score都是合适的变量名。
变量名只能包含字母、数字、$和_。在变量名中的任何地方,都不能使用空格或任何其他的特殊字符:fish&chips以及fish and chips都是非法的变量名,但是fish_n_chips和plan9是有效的变量名。
变量名区分大小写。JavaScript解释器把大写字母和小写字母看成是不同的,因此,变量名SCORE和score是不同的,而且它与sCoRE和Score也是不同的。
避免使用关键字。JavaScript中的一些单词是特定于语言本身:例如,var用来创建一个变量,因此,不能把一个变量命名为var。此外,一些单词,例如alert、document和window,被看做是Web浏览器的特殊属性。如果试图用这些单词作为变量名,最终会产生一个JavaScript错误。可以在表2-1中看到一些保留字的列表。并非所有这些保留字都会在所有的浏览器中引发问题,但是,最好在命名变量的时候避开这些名字。


f6d34589a3bce1cb52f629804d408ee6946669c2

除了这些规则,还要以使得变量名清楚和有意义为目标。根据将要在变量中存储的数据的类型来命名变量,这会使人们更容易阅读程序,并且立即理解它要做什么。例如,对于记录玩家的游戏分数的变量来说,score是一个很好的名字。变量名s也有效,但是,单个字母“s”对于变量中存储的内容不会有任何启发。
同样,要让变量名容易阅读。当你在一个变量名中使用多个单词的时候,要么在单词之间使用一个下划线,要么把第一个单词之后的每个单词的首字母都大写。例如,imagepath不如image_path或imagePath容易阅读和理解。
2.4.2 使用变量
一旦创建了变量,就可以在其中存储任何类型的数据。为了做到这一点,可以使用=符号。例如,要把数值0存储到一个名为score的变量中,可以编写如下代码:

var score;
score = 0;
上面代码的第一行创建了一个变量,第二行把数值0存储到这个变量中。等号叫做赋值操作符,因为它用来把一个值赋给变量。也可以只在一行JavaScript语句创建一个变量并把一个值存储到其中,如下所示:
var score = 0;
可以在一个变量中存储字符串、数值和Boolean值:
var firstName = 'Peter';
var lastName = 'Parker';
var age = 22;
var isSuperHero = true;

提示: 为了减少录入,可以用一个var关键字声明多个变量,如下所示:

    var x, y, z;
    甚至可以在一条JavaScript语句中声明多个变量并在其中存储值:
    var isSuperHero=true, isAfraidOfHeights=false;

一旦把值存储到一个变量中,就可以使用变量的名字直接访问值。例如,要打开一个警告对话框并且显示存储在变量score中值,应该输入:
alert(score);
注意,不能把变量和引号一起使用,引号只是和字符串一起使用,因此,代码alert('score')将显示单词“score”而不是存储在变量score中的值。现在,你应该明白为什么字符串必须包围在引号中了:对于没有引号的单词,JavaScript解释器将其当做特殊的JavaScript对象(例如alert()函数)或变量名处理。
常见问题
JavaScript中的空格、制表符和回车
JavaScript似乎对录入错误很敏感。如何知道什么时候应该使用一个空格字符,以及什么时候不允许使用空格呢?
通常,JavaScript对空格、回车和制表符的使用并不是很严格。你经常可以漏掉空格,或者甚至添加额外的空格和回车,而不会有什么问题。JavaScript解释器忽略了额外的空格,因此,你可以自由地插入额外的空格、制表符和回车来格式化代码。例如,在赋值操作符的任何一端都不需要一个空格,但是,如果你觉得添加空格更容易阅读的话,也可以添加它们。下面的两行代码都有效:

var formName='signup';
var formRegistration = 'newsletter' ;
实际上,我们可以插入想要的任意多个空格,甚至是在一条语句中插入回车。因此,如下的两条语句都是有效的:
var formName = 'signup';
var formRegistration  = 'newsletter';

当然,能够插入额外的空格,并不意味着应该这么做。实际上,由于存在额外的空格,前两个例子变得难以阅读。因此,首要的一般规则是,如果额外的空格使得代码容易理解,就添加它。例如,在一次声明多个变量或一次设置多个变量的值的时候,额外的回车能够使得代码更容易阅读。如下是单独一行的代码:

var score=0, highScore=0, player='';
然而,有些程序员发现,如果每个变量单独一行的话,阅读起来更容易一些:
var score=0,
  highScore=0,
  player='';

是否认为空格便于阅读,这取决于你,JavaScript解释器只是忽略这些换行。在2.8节和4.8.3节,你将分别看到空格使得带有数组和JavaScript对象直接量的代码更容易阅读的例子。
上述规则有几个重要的例外,例如,不能在字符串中插入回车,换句话说,不能像下面这样把字符串分隔到两行:

var name = 'Bob
      Smith';

像这样插入一个回车(按下回车键)将会导致一个JavaScript错误并且程序无法运行。
此外,在关键字之间必须放置一个空格:例如,varscore=0和var score=0是不同的。
后一个例子创建了一个名为score的新变量,而前者将值0存储到了一个名为varscore的变量中。JavaScript解释器需要通过var和score之间的空格来识别var关键字,即var score=0。然而,并非必须在关键字和赋值运算符(=)或结束语句的分号等符号之间使用一个空格。

注意: 你只需要使用var关键字一次,即第一次创建该变量的时候。此后,可以随意地把一个新值赋给变量而不需要使用var。

相关文章
|
11天前
|
JavaScript 前端开发
JavaScript基础知识-变量的声明提前
关于JavaScript变量声明提前特性的基础知识介绍。
24 0
JavaScript基础知识-变量的声明提前
|
30天前
|
JavaScript
鼠标事件(点击换色)分别使用js和jQuery代码实现
鼠标事件(点击换色)分别使用js和jQuery代码实现
28 1
|
22天前
|
JavaScript
分别用jquery和js修改页面元素
分别用jquery和js修改页面元素
27 2
|
30天前
|
JavaScript Java
点击按钮,向下添加目录。Java script+jQuery写法
点击按钮,向下添加目录。Java script+jQuery写法
12 1
|
30天前
|
JavaScript Java
分别使用js与jquery写 单击按钮时出现内容 点击删除按钮不会再向下出现
分别使用js与jquery写 单击按钮时出现内容 点击删除按钮不会再向下出现
15 1
|
13天前
|
存储 JavaScript 前端开发
|
14天前
|
Devops 持续交付 测试技术
JSF遇上DevOps:开发流程将迎巨变?一篇文章带你领略高效协同的魅力!
【8月更文挑战第31天】本文探讨了如何在JavaServer Faces(JSF)开发中融入DevOps文化,通过持续集成与部署、自动化测试、监控与日志记录及反馈机制,提升软件交付速度与质量。文中详细介绍了使用Jenkins进行自动化部署、JUnit与Selenium进行自动化测试、ELK Stack进行日志监控的具体方法,并强调了持续改进的重要性。
26 0
|
23天前
|
JavaScript 前端开发
揭秘JavaScript变量的三大守护神:从var到let,再到const,究竟隐藏了哪些秘密?
【8月更文挑战第22天】在JavaScript中,`var`、`let`和`const`用于声明变量,但各有特点。`var`有函数作用域并会被提升至作用域顶部。`let`提供块级作用域且存在暂时性死区,不允许提前访问。`const`同样拥有块级作用域,用于声明常量,一旦初始化便不可改变。现代开发倾向于使用`let`和`const`以获得更清晰的作用域控制和避免潜在错误。
25 0
|
23天前
|
JavaScript 前端开发
揭开JavaScript变量作用域与链的神秘面纱:你的代码为何出错?数据类型转换背后的惊人秘密!
【8月更文挑战第22天】JavaScript是Web开发的核心,了解其变量作用域、作用域链及数据类型转换至关重要。作用域定义变量的可见性与生命周期,分为全局与局部;作用域链确保变量按链式顺序查找;数据类型包括原始与对象类型,可通过显式或隐式方式进行转换。这些概念直接影响代码结构与程序运行效果。通过具体示例,如变量访问示例、闭包实现计数器功能、以及动态表单验证的应用,我们能更好地掌握这些关键概念及其实践意义。
21 0
|
30天前
|
JavaScript 前端开发
JavaScript声明变量的几种方式
JavaScript声明变量的几种方式
23 0