《JavaScript Dom编程艺术》读书笔记(二)
算术操作符
加减乘除这些算术操作中的每一种都必须借助于相应的操作符才能完成。操作符是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编程艺术》读书笔记(二)的更多相关文章
- 《CSS世界》笔记二:盒模型四大家族
上一篇:<CSS世界>笔记一:流/元素/尺寸下一篇:<CSS世界>笔记三:内联元素与对齐 写在前面 在读<CSS世界>第四章之前,粗浅的认为盒模型无非是margin ...
- CSS揭秘读书笔记 (一)
CSS揭秘读书笔记 (一) 一.半透明边框 要想实现半透明边框可以使用border: border: 10px solid hsla(0,0%,100%,.5); background: ...
- 《你必须知道的.NET》读书笔记二:小OO有大原则
此篇已收录至<你必须知道的.Net>读书笔记目录贴,点击访问该目录可以获取更多内容. 一.单一职责原则 (1)核心思想:一个类最好只做一件事,只有一个引起它变化的原因 (2)常用模式:Fa ...
- spring揭秘 读书笔记 二 BeanFactory的对象注册与依赖绑定
本文是王福强所著<<spring揭秘>>一书的读书笔记 我们前面就说过,Spring的IoC容器时一个IoC Service Provider,而且IoC Service Pr ...
- ES6读书笔记(二)
前言 前段时间整理了ES6的读书笔记:<ES6读书笔记(一)>,现在为第二篇,本篇内容包括: 一.数组扩展 二.对象扩展 三.函数扩展 四.Set和Map数据结构 五.Reflect 本文 ...
- 《精通CSS》读书笔记(一)
最近新添16本书,目前开始看陈剑瓯翻译的<精通CSS——高级Web标准解决方案>(Andy Budd, CSS Mastery -- Advanced Web Standards Solu ...
- spring揭秘 读书笔记 二 BeanFactory的对象注冊与依赖绑定
本文是王福强所著<<spring揭秘>>一书的读书笔记 我们前面就说过,Spring的IoC容器时一个IoC Service Provider,并且IoC Service Pr ...
- 【记】《.net之美》之读书笔记(二) C#中的泛型
前言 上一篇读书笔记,很多小伙伴说这本书很不错,所以趁着国庆假期,继续我的读书之旅,来跟随书中作者一起温习并掌握第二章的内容吧. 一.理解泛型 1.为什么要使用泛型?-----通过使用泛型,可以极大地 ...
- Mastering Web Application Development with AngularJS 读书笔记(二)
第一章笔记 (二) 一.scopes的层级和事件系统(the eventing system) 在层级中管理的scopes可以被用做事件总线.AngularJS 允许我们去传播已经命名的事件用一种有效 ...
- how tomcat works 读书笔记(二)----------一个简单的servlet容器
app1 (建议读者在看本章之前,先看how tomcat works 读书笔记(一)----------一个简单的web服务器 http://blog.csdn.net/dlf123321/arti ...
随机推荐
- 第一次尝试3D建模和打印:色子
打印机前几天到了,除了打印了一半自带demo之外,还没开始打过啥模型.想自己从头打印个东西.那就做个色子吧. 因为机子上有SW2020,参考这个 solidworks2017怎么建模骰子? 教程来练习 ...
- Chapter09 项目
Chapter09 项目 房屋出租系统(面向对象中级) 9.1 房屋出租系统-需求 9.1.1项目需求说明 实现基于文本界面的<房屋出租软件>. 能够实现对房屋信息的添加.修改和删除(用数 ...
- Lua中如何实现类似gdb的断点调试--02通用变量打印
在前一篇01最小实现中,我们实现了Lua断点调试的的一个最小实现.我们编写了一个模块,提供了两个基本的接口:设置断点和删除断点. 虽然我们已经支持在断点进行变量的打印,但是需要自己指定层数以及变量索引 ...
- LeetCode-015-三数之和
三数之和 题目描述:给你一个包含 n 个整数的数组 nums,判断 nums 中是否存在三个元素 a,b,c ,使得 a + b + c = 0 ?请你找出所有和为 0 且不重复的三元组. 注意:答案 ...
- SQL实现一年中每个日期剔除节假日和星期天之后的五个日期是多少
最近公司OA系统的需求,实现一年中每个日期剔除节假日和星期天之后的五个日期是几号,每个日期都要跳过节假日和星期天,当时是真的慌了,郁闷了一天,后来半夜忽然来灵感,想想还是可以实现. 需要做一张节假日的 ...
- Sqlserver 2008 导出数据库
sqlserver2008中导出数据库: ①当数据库中的数据量比较大时,可使用备份的方法. 路径可以默认,想自定义就点击[添加],最后[确定]即可. ②当数据量不是很大时,可以采用导出SQL执行语句的 ...
- 解决github网站打不开的方法
发现github最近经常抽风,之前发现打不开时就挂个梯子,最近梯子也都被封了,尝试了下改host发现效果挺好,方法如下(Mac电脑): 1.通过站长工具找出DNS地址:进入站长工具网站的域名解析网址: ...
- 《shader入门精要》13.2再谈运动模糊中片元着色器的世界坐标的计算
具体在书p275页 这里为啥需要除D.w呢. 首先我们得到的NDC的坐标是已经归一化的,但是CurrenViewProjectionMatrix的作用,是把世界空间转化为尚未归一化的裁剪空间. 这里看 ...
- C++设计模式 - 状态模式(State)
状态变化模式 在组件构建过程中,某些对象的状态经常面临变化,如何对这些变化进行有效的管理?同时又维持高层模块的稳定?"状态变化"模式为这一问题提供了一种解决方案. 典型模式 Sta ...
- 配置 conda 镜像环境
镜像下载.域名解析.时间同步请点击 阿里巴巴开源镜像站 环境: conda/4.11.0 CPython/3.8.8 Windows/10 镜像源选用阿里云镜像站anaconda镜像:https:// ...