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

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

本节书摘来自异步社区《AngularJS高级程序设计》一书中的第5章,第5.6节,作者:【美】Adam Freeman(弗里曼)著,更多章节内容可以访问云栖社区“异步社区”公众号查看

5.6 使用JavaScript运算符

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

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

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

screenshot

清单结果如下:

screenshot

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

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

screenshot

该脚本输出如下:

screenshot

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

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

screenshot

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

screenshot

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

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

screenshot

该脚本的结果如下:

screenshot

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

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

screenshot

该脚本的结果如下:

screenshot

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

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

screenshot

该脚本的结果如下:

screenshot

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

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

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

screenshot

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

screenshot

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

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

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

screenshot

该脚本的输出如下:

screenshot

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

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

相关文章
|
3月前
|
JavaScript 前端开发 Java
JavaScript基础语法(运算符)
JavaScript基础语法(运算符)
32 0
|
4月前
|
JavaScript 前端开发 开发者
从0开始学习JavaScript--JavaScript 表达式与运算符
JavaScript中的表达式和运算符是构建逻辑、进行计算的基础。本文将深入研究JavaScript中各类表达式,包括算术表达式、关系表达式、逻辑表达式,以及运算符的使用方法,并通过丰富的示例代码来帮助读者更全面地了解和运用这些概念。
|
4月前
|
JavaScript 前端开发
JavaScript变量、数据类型、运算符及类型转换
JavaScript变量、数据类型、运算符及类型转换
40 0
|
29天前
|
JavaScript
js开发:请解释什么是ES6的扩展运算符(spread operator),并给出一个示例。
ES6的扩展运算符(...)用于可迭代对象展开,如数组和对象。在数组中,它能将一个数组的元素合并到另一个数组。例如:`[1, 2, 3, 4, 5]`。在对象中,它用于复制并合并属性,如`{a: 1, b: 2, c: 3}`。
12 3
|
1月前
|
JavaScript 前端开发 程序员
编程笔记 html5&css&js 074 Javascript 运算符
编程笔记 html5&css&js 074 Javascript 运算符
|
3月前
|
JavaScript 前端开发
什么是 JavaScript 中的 Spread 运算符
什么是 JavaScript 中的 Spread 运算符
28 0
|
3月前
|
JavaScript 前端开发
JS-基础:JavaScript运算符 个人总结
JS-基础:JavaScript运算符 个人总结
20 0
|
3月前
|
前端开发 JavaScript 算法
JavaScript不常见但好用的运算符
JavaScript不常见但好用的运算符
|
3月前
|
存储 前端开发 JavaScript
【面试题】Javascript的这些运算符,你都都掌握哪些?
【面试题】Javascript的这些运算符,你都都掌握哪些?
|
3月前
|
前端开发 JavaScript
【Javascript保姆级教程】运算符
【Javascript保姆级教程】运算符