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

    xiaoxiao2024-02-24  126

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

    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  可用的字符串转数字的方法

    最新回复(0)