《AngularJS高级程序设计》——5.6 使用JavaScript运算符

5.6 使用JavaScript运算符

JavaScript定义了大量标准的运算符集。我在表5-3中概括了最有用的。

表5-3  有用的JavaScript运算符

5.6.1 使用条件语句
许多JavaScript运算符是和条件语句一起使用的。在本书中,我倾向使用if/else和switch语句。清单5-24展示了两者的使用(如果你使用过几乎所有编程语言,那你会很熟悉)。

清单5-24 在文件jsdemo.html中使用if/else和switch条件语句

清单结果如下:

5.6.2 对比等于运算符和全等运算符
等于和全等运算符要特别注意。等于运算符会为了判定是否相等而尝试强制将运算对象转为相同类型。只要你意识到它所做的,这就是个得心应手的特性。清单5-25展示了等于运算符的作用。

清单5-25 在文件jsdemo.html中使用等于运算符

该脚本输出如下:

JavaScript将两个运算对象转化为相同的类型然后比较它们。实质上,等于运算符检测值是否相同,与类型无关。如果想确保检查值和类型都相同,那你需要使用全等运算符(===,三个等号,而不是两个等于运算符),如清单5-26中所示。

清单5-26 在文件jsdemo.html中使用全等运算符

在本例中,全等运算符会认定两个变量是不同的。该运算符不会强制转化类型。该脚本的结果如下:

JavaScript基元(primitives)是用值做比较,但JavaScript对象是通过引用比较。清单5-27展示了JavaScript如何处理对象的等于和全等检测。

清单5-27 在文件jsdemo.html中对对象执行等于和全等检测

该脚本的结果如下:

清单5-28展示了对基元执行相同的检测。

清单5-28 在文件jsdemo.html中对基元执行

该脚本的结果如下:

提示:
AngularJS用angular.equals方法扩展了内置的对比较的支持,它拿两个对象或值做参数,如果它们通过全等比较(===)或者两个参数是对象并且它们的所有属性都通过全等比较,那就返回true。我不倾向使用该方法,所以我在本章中没有包含其演示。
5.6.3 显式转换类型
字符串连接运算符(+)比加号(也是+)的优先级还高,这意味着JavaScript将连接变量优先于加法。这会致使混乱,因为JavaScript还会自由地转化类型而产生结果(该结果并非总是所期望的),如清单5-29所示。

清单5-29 在文件jsdemo.html中字符串连接运算符优先

该脚本的结果如下:

第二个结果是导致混乱的那种。凭借操作符优先级和狂热的类型转化,可能把加号看作了字符串连接符。为了避免这种情况,你可以显式地转化值的类型,以确保你执行了的运算符类型正确,如下面段落中所述。

1.数字转字符串
如果你有多个数字变量并想将它们作为字符串连接,那你可以使用toString方法将数字转为字符串,如清单5-30所示。

清单5-30 在文件jsdemo.html中使用number.toString方法

注意我在圆括号中放的数值,然后我调用toString方法。这是因为你必须让JavaScript在你调用数字类型定义的方法前将字面量转为数字。我还展示了替代方案用以达到相同效果,那就是调用String函数并传入数值作为参数。它们二者的技术效果相同,这是将数字转为字符串,说明“+”运算符用于字符串连接而不是加法。该脚本的输出如下:

这还有其他方法,可以让你对数字用字符串表示施以更多控制。在表5-4中简述了这些方法。表中所示的所有方法都由数字类型所定义。

表5-4  可用的数字转字符串的方法

2.字符串转数字
互补的技术是将字符串转为数字,以使得你可以执行加法而不是连接。你可以使用Number函数来做,如清单5-31所示。

清单5-31 在文件jsdemo.html中将字符串转为数字

该脚本的输出如下:

Number方法是一种严格的解析字符串值的方式,但你可以使用另外两个更灵活的,同时也会忽略后面非数字符号的函数。这些函数是parseInt和parseFloat。我在表5-5中全面描述了三种方法。

表5-5  可用的字符串转数字的方法

时间: 2024-11-26 19:47:30

《AngularJS高级程序设计》——5.6 使用JavaScript运算符的相关文章

《AngularJS高级程序设计》——导读

前言 AngularJS是一款优秀的前端JS框架,已经被用于Google的多款产品当中,并且得到众多前端工程师的青睐. 本书是AngularJS程序设计的高级指南.全书共25章,分为3个部分,每部分覆盖一组相关话题.第1部分为第1章到第8章,包括AngularJS简介,以及HTML.CSS和JavaScript的基础知识.第2部分为第9章到第17章,引导读者熟悉AngularJS库的各种特性,从对一个AngularJS应用程序中各种不同组件的概览开始,依次深入介绍每种类型的组件.第3部分为第18

《AngularJS高级程序设计》——2.2 使用AngularJS

2.2 使用AngularJS 对于要创建的基本功能来说,todo.html文件中的静态HTML目前仅作为占位符使用.用户应该能看到待办事项的列表,勾选掉已完成的事项,并创建新事项.在下面各节中,我打算将AngularJS加进来,并应用一些基本特性来为我的待办事项应用赋予生命.简单起见,假定只有一个用户,并且不用考虑保留应用程序中的数据状态.2.2.1 将AngularJS应用到HTML文件将AngularJS加入到HTML文件中是挺简单的,只需简单增加一个script元素来引入angular.

《AngularJS高级程序设计》——第5章 JavaScript基础 5.1准备示例项目

第5章 JavaScript基础 在本章中,我提供了JavaScript语言最重要特性的快速指南,它们适用于本书.我没有余力完整地讲解JavaScript,但我会专注其本质,即你需要快速了解情况并随着本书的示例走.除了最重要的JavaScript语言核心特性外,我还会讲述AngularJS提供的工具方法集. 通过演示JavaScript如何使用承诺,我完成了这一章.承诺代表异步任务,比如Ajax请求,而且它们在AngularJS应用中是广泛使用的,我在第21章会再谈这一话题.我还讲到Angula

《AngularJS高级程序设计》——2.3 基本功能之外

2.3 基本功能之外 我定义了基本的MVC构件,这样,就创建了一个本章开始时的静态模拟程序的动态版本.现在我们已经有了一个较为坚固的基础了,就可以使用一些更高级的技术来增添功能并创建一个更为完整的应用.在下面各节中,我将对这个待办事项应用使用不同的AngularJS特性,并解释将在本书中的何处更详细地介绍这些特性. 2.3.1 使用双向模型绑定 在前一节中所使用的绑定被称为单向绑定,其值是从模型中取得的,并用于操作模板中的元素.在Web应用开发中这是相当标准的做法和广泛应用的技术.例如,在使用j

《AngularJS高级程序设计》——5.8 比较undefined和null值

5.8 比较undefined和null值 JavaScript定义了两个特别的值,当你比较它们时你得小心:undefined和null.当你读取没有赋值的变量或试图取不存在的对象属性时会返回undefined.清单5-38展示了JavaScript中undefined是如何使用的. 清单5-38 在文件jsdemo.html中的特殊值undefined 该清单输出如下: JavaScript还定义了另一个特殊值null,这很少见.Null值与undefined稍有不同.当值没有被定义时返回un

《AngularJS高级程序设计》——5.5 使用变量及类型

5.5 使用变量及类型 在前面的例子中你看到了如何定义变量:你用var关键字,然后可选地在语句中为变量赋值.在函数中定义的变量是本地变量,适合仅在函数内使用.直接定义在script元素中的变量是全局变量,可在任意位置访问,包括同一HTML文档中的其他脚本.清单5-8演示了本地和全局变量的使用. 清单5-8 在文件jsdemo.html中使用本地和全局变量 JavaScript是动态类型语言.这并不说明JavaScript没有类型.它只是说你并非一定要显式声明变量类型,你可以轻而易举地为同一变量赋

《AngularJS高级程序设计》——5.4 定义并使用函数

5.4 定义并使用函数 当浏览器处理HTML文档时,它会一个挨一个地往下读.当其遇到script元素,就立刻按其定义顺序执行所包含的JavaScript语句. 这就是前面的例子中发生的,向控制台写了两条消息.你也可以将多条语句包成函数,在浏览器遇到调用该函数的语句前它不会执行,如清单5-4所示. 清单5-4 在文件jsdemo.html中定义JavaScript函数 定义函数很简单:使用function关键字,后面跟着你想的函数名,然后是一对括号("("和")").

《AngularJS高级程序设计》——1.5 如何搭建你的开发环境

1.5 如何搭建你的开发环境 从一个浏览器.一个文本编辑器和一个Web服务器就可以开始你的AngularJS开发之旅.客户端Web应用开发的好处之一就是你可以挑选并组合一系列开发工具,以创建一个适合你工作风格和编程实践的环境.在下面的各节中,我将描述我所使用的环境,以便你可以在自己的工作站上重新创建它.1.5.1 选择Web浏览器 AngularJS在任何现代浏览器上都可以工作,你应该在你的用户有可能使用到的所有浏览器上测试你的应用.不管怎样,你需要一个为开发而用的浏览器,以便于搭建出开发环境,

《AngularJS高级程序设计》——5.11 小结

5.11 小结 在本章中我提供了JavaScript语言的简单基础,以及AngularJS为补充核心语言特性而提供的实用方法.我还介绍了承诺以及AngularJS对JSON的支持,它们二者是使用Ajax并实现我在第3章中讲的单页面应用程序模型所必不可少的.我不能在本书中提供完整的JavaScript描述,但我在这讲述的特性是我在本书中的示例所最常使用的,并且应该足够你跟上我对AngularJS开发不同方面的讲解.