算术操作符

加减乘除这些算术操作中的每一种都必须借助于相应的操作符才能完成。操作符是JavaScript为完成各种操作而定义的一些符号。等号(=)、加号(+)、减号(-)、乘号(*)、除号(/)。

下面是一个简单的加法操作:


1 + 4

还可以把多种操作组合在一起:


1 + 4 * 5

为避免产生歧义,可以用括号把不同的操作分隔开来:

1 + (4 * 5)
(1 + 4) * 5

变量可以包含操作:


var total = (1 + 4) * 5;

还可以对变量进行操作:

var temp_fahrenheit = 95;
var temp_celsius = (temp_fahrenheit - 32) / 1.8;

JavaScript还提供了一些非常有用的操作符作为各种常用操作的缩写。例如,如果想给一个数值变量加上1,可以使用如下所示的语句:


year = year + 1;

也可以使用++操作符来达到同样的目的:


year++;

类似地,--操作符将对一个数值变量的值进行减1操作。

加号(+)是一个比较特殊的操作符,既可以用于数值,也可以用于字符串。把两个字符串合二为一是一种很直观易懂的操作:

var message = "I am feeling" + "happy";

像这样把多个字符串首尾相连在一起的操作叫做拼接。这种拼接也可以通过变量来完成:

var mood = "happy";
var message = "I am feeling" + mood;

甚至可以把数值和字符串拼接在一起。因为JavaScript是一种弱类型语言,所以这种操作是允许的。此时,数值将会被自动转换为字符串:

var year = 2005;
var message = "The year is" + year;

如果把字符串拼接在一起,其结果将是一个更长的字符串;但是如果用同样的操作符来“拼接”两个数值,其结果将是那两个数值的算术和。对比下面两条alert语句的执行结果:


alert ("10" + 20);
alert (10 + 20);

第一条alert语句将返回字符串“1020”,第二条alert语句将返回数值30。第一条是对字符串“10”和数值20进行拼接的结果。第二条是对数值10和数值20进行假发运算的结果。

另一个非常有用的快捷操作符是+=,它可以一次完成“加法和赋值”(或“拼接和赋值”)操作:


var year = 2010;
var message = "The year is";
message += year;

执行完上面这些语句后,变量message的值将是“The year is 2005”。可以用如下所示的alert对话框来验证这一结果:


alert(message);

条件语句

在解释脚本时,浏览器将依次执行这个脚本中的各条语句,我们可以在这个脚本中用条件语句来设置一个条件,只有满足了这一条件才能让更多的语句得到执行。最常见的条件语句是if语句,下面是if语句的基本语法:

if(condition) {
statements;
}

条件必须放在if后面的圆括号中。条件的求之结果永远是一个布尔值,即只能是true或false。花括号中的语句——不管他们有多少条,只有在给定条件的求值结果是true的情况下才会执行。因此,在下面这个例子中,alert消息永远也不会出现:

if(1 > 2) {
alert("The world has gone mad!")
}

因为1不可能大于2,所以上面这个条件的值永远是false。

事实上,if语句中的花括号本身并不是必不可少的。如果if语句中的花括号部分只包含着一条语句的话,那就可以不使用花括号,而且这条if语句的全部内容可以写在同一行上:

if(1 > 2) alert("The world has gone mad!");

不过,花括号可以提高脚本的可读性,所以在if语句中总是使用花括号是个好习惯。

if语句可以有一个else字句。包含在else字句中的语句会在给定条件为假时执行:

if(1 > 2) {
alert("The world has gone mad!")
} else {
alert("All is well with the world")
}

因为给定条件“1 > 2”的值为假(false),所以最后弹框显示else里面的内容。

比较操作符

JavaScript还提供了许多几乎只能用在条件语句里的操作符,其中包括诸如大于(>)、小于(<)、大于或等于(>=)、小于或等于(<=)之类的比较操作符。

如果想比较两个值是否相等,可以使用“等于”比较操作符。这个操作符由两个等号构成(==)。单个等号(=)是用于完成赋值操作的。如果在条件语句的某个条件里使用了单个等号,那么只要相应的复制操作取得成功,那个条件的求值结果就将是true。

下面是一个错误地进行“等于”比较的例子:


var my_mood = "happy";
var your_mood = "sad";
if(my_mood = your_mood) {
alert("We both feel the same.")
}

上面这条语句的错误之处在于,它是把变量your_mood赋值给变量my_mood,而不是在比较它们是否相等。因为这个赋值操作总会成功,所以这个条件语句的结果将永远是true。

下面才是进行“等于”比较的正确做法:


var my_mood = "happy";
var your_mood = "sad";
if(my_mood == your_mood) {
alert("We both feel the same.")
}

这次,条件语句的结果是false。

JavaScript还提供了一个用来进行“不等于”比较的操作符,它由一个感叹号和一个等号构成(!=)。

if(my_mood != your_mood) {
alert("We're feeling different moods.")
}

相等操作符==并不表示严格相等,这一点很容易让人迷糊。例如,比较false与一个空字符串会得到上面结果?

var a = false;
var b = "";
if(a == b) {
alert("a equals b");
}

这个条件语句的求值结果是true,因为相等操作符==认为空字符与false的含义相同。要进行严格比较,就要使用另一种等号(===)。这个全等操作符会执行严格的比较,不仅比较值,而且会比较变量的类型:

var a = false;
var b = "";
if(a === b) {
alert("a equals b");
}

这一次,条件表达式的求值结果就是false了。因为即使可以认为false与空字符串具有相同的含义,但Boolean布尔值和String字符串可不是一种类型。

对于不等操作符!=也是如此,比较严格不相等,就要使用!==。

逻辑操作符

JavaScript允许把条件语句里的操作组合在一起。例如,如果想检查某个变量,假设这个变量的名字是num,它的值是不是在5 ~ 10之间,将需要进行两次比较操作。首先,比较这个变量是否大于或等于5,然后,比较这个变量是否小于等于10.这两次比较操作称为逻辑比较。下面是把这两个逻辑比较组合在一起的具体做法:

if ( num >= 5 && num <= 10 ) {
alert("The number is in the right range.")
}

这里使用了“逻辑与”操作符,由两个“&”字符构成,是一个逻辑操作符。

逻辑操作符的操作对象是布尔值。每个逻辑操作数返回一个布尔值true或者是false。“逻辑与”操作只有在它的两个操作数都是true时才会是true。

“逻辑或”操作符由两个垂直线字符构成。只要它的操作数中有一个是true,“逻辑或”的操作就将是true。如果它的两个操作数都是true,“逻辑或”操作也将是true。只有当它的两个操作数都是false时,“逻辑或”操作才会是false。

if ( num > 10 || num < 5 ) {
alert("The number is not in the right range")
}

JavaScript还提供了一个“逻辑非”操作符,它由一个感叹号( ! )单独构成。“逻辑非”操作符只能作用于单个逻辑操作数,其结果是把那个逻辑操作数所返回的布尔值取反。如果那个逻辑操作数所返回的布尔值是true,“逻辑非”操作符将把它取反为false:

if ( !(1 > 2) ) {
alert("All is well with the world");
}

为了避免产生歧义,上面这条语句把逻辑操作数放在了括号里,使“逻辑非”操作符作用于括号里的所有内容。

可以用“逻辑非”操作符把整个条件语句的结果颠倒过来。在下面的例子里,特意使用了一对括号来确保“逻辑非”操作符将作用于两个逻辑操作数的组合结果:

if ( !(num > 10 || num < 5) ) {
alert("The number is in the right range.")
}

《JavaScript Dom编程艺术》读书笔记(二)的更多相关文章

  1. 《CSS世界》笔记二:盒模型四大家族

    上一篇:<CSS世界>笔记一:流/元素/尺寸下一篇:<CSS世界>笔记三:内联元素与对齐 写在前面 在读<CSS世界>第四章之前,粗浅的认为盒模型无非是margin ...

  2. CSS揭秘读书笔记 (一)

    CSS揭秘读书笔记      (一) 一.半透明边框 要想实现半透明边框可以使用border: border: 10px  solid  hsla(0,0%,100%,.5); background: ...

  3. 《你必须知道的.NET》读书笔记二:小OO有大原则

    此篇已收录至<你必须知道的.Net>读书笔记目录贴,点击访问该目录可以获取更多内容. 一.单一职责原则 (1)核心思想:一个类最好只做一件事,只有一个引起它变化的原因 (2)常用模式:Fa ...

  4. spring揭秘 读书笔记 二 BeanFactory的对象注册与依赖绑定

    本文是王福强所著<<spring揭秘>>一书的读书笔记 我们前面就说过,Spring的IoC容器时一个IoC Service Provider,而且IoC Service Pr ...

  5. ES6读书笔记(二)

    前言 前段时间整理了ES6的读书笔记:<ES6读书笔记(一)>,现在为第二篇,本篇内容包括: 一.数组扩展 二.对象扩展 三.函数扩展 四.Set和Map数据结构 五.Reflect 本文 ...

  6. 《精通CSS》读书笔记(一)

    最近新添16本书,目前开始看陈剑瓯翻译的<精通CSS——高级Web标准解决方案>(Andy Budd, CSS Mastery -- Advanced Web Standards Solu ...

  7. spring揭秘 读书笔记 二 BeanFactory的对象注冊与依赖绑定

    本文是王福强所著<<spring揭秘>>一书的读书笔记 我们前面就说过,Spring的IoC容器时一个IoC Service Provider,并且IoC Service Pr ...

  8. 【记】《.net之美》之读书笔记(二) C#中的泛型

    前言 上一篇读书笔记,很多小伙伴说这本书很不错,所以趁着国庆假期,继续我的读书之旅,来跟随书中作者一起温习并掌握第二章的内容吧. 一.理解泛型 1.为什么要使用泛型?-----通过使用泛型,可以极大地 ...

  9. Mastering Web Application Development with AngularJS 读书笔记(二)

    第一章笔记 (二) 一.scopes的层级和事件系统(the eventing system) 在层级中管理的scopes可以被用做事件总线.AngularJS 允许我们去传播已经命名的事件用一种有效 ...

  10. how tomcat works 读书笔记(二)----------一个简单的servlet容器

    app1 (建议读者在看本章之前,先看how tomcat works 读书笔记(一)----------一个简单的web服务器 http://blog.csdn.net/dlf123321/arti ...

随机推荐

  1. AtCoder Beginner Contest 242 题解

    目录 C - 1111gal password D - ABC Transform E - (∀x∀) F - Black and White Rooks G - Range Pairing Quer ...

  2. jieba:统计一篇文章中词语数

    jieba官方文档 1.jieba分词的四种模式 精确模式.全模式.搜索引擎模式.paddle模式 精确模式:把文本精确的切分开,不存在冗余单词,适合文本分析: 全模式:把文本中所有可能的词语都扫描出 ...

  3. hexo部署到github时,提示typeError [ERR_INVALID_ARG_TYPE] The “mode“ argument must be integer. Receive

    hexo部署到github时,提示typeError [ERR_INVALID_ARG_TYPE]: The "mode" argument must be integer. Re ...

  4. 阿里云CND加速

    1: :2: 3: 4: 5: 6: 7:将解析信息如实添加 8:如果报错添加 CNAME 记录提示和 A 记录冲突,也就是说如果你要添加 CDN 全站加速,域名解析那里就不能再有 A 记录了, 只有 ...

  5. laravel7 百度智能云检测图片是否合规

    APP 文件下建一个Libs目录建一个BaiduService文件,需要检测引入进行调用即可 BaiduService文件内容如下 <?php namespace App\Libs; use A ...

  6. 8、msyql性能分析工具

    性能分析工具 1服务器优化的步骤 2查询系统参数 在MySQL中,可以使用 SHOW STATUS 语句查询一些MySQL数据库服务器的性能参数.执行频率 . SHOW STATUS语句语法如下: S ...

  7. java 中判断输入是否合法 if (变量名.hasNextInt())

    //案例: Scanner sc = new Scanner(System.in); System.out.println("你选择了新修改商品功能!"); System.out. ...

  8. 那些年踩过的坑---java篇

    事务 Transaction rolled back because it has been marked as rollback-only 问题描述:项目使用的是springboot,在代码中未使用 ...

  9. CentOS 5.11源修改

    CentOS 5.11源 将源中所有网址替换为 http://archive.kernel.org/centos-vault/你的版本/ 一条sed命令即可解决 sed -i 's@http://xx ...

  10. OpenTracing 简介

    自从 Google Dapper 的论文发布之后,各大互联网公司和开源社区开发的分布式链路追踪产品百花齐放,同时也给使用者带来了一个问题,各个分布式链路追踪产品的 API 并不兼容,如果用户在各个产品 ...