Javascript操作符应用详细讲解
赋值操作符
赋值操作符会根据其右操作数侧的值给左操作数赋值。
实现版本 | Navigator 2.0 |
最基本的赋值操作数是等号(=),它会将右操作数的值直接赋给左操作数。也就是说,x = y 将把 y 的值赋给 x。其它的赋值操作符都是标准操作的缩略形式,列在表 2.2 中。
表 2.2 赋值操作符
缩写操作符 | 含义 |
---|---|
x += y | x = x + y |
x -= y | x = x - y |
x *= y | x = x * y |
x /= y | x = x / y |
x %= y | x = x % y |
x <<= y | x = x << y |
x >>= y | x = x >> y |
x >>>= y | x = x >>> y |
x &= y | x = x & y |
x ^= y | x = x ^ y |
x |= y | x = x | y |
比较操作符
所谓比较操作符,就是会比较其两边的操作数,并根据比较结果为真或假返回逻辑值。操作数可以是数值或字符串值。如果使用字符串值的话,比较是基于标准的字典顺序。
实现版本 | Navigator 2.0 |
相关内容列在了表 2.3 中。对于该表中的示例,我们假定 var1 被赋予了值 3,而 var2 被赋予了值 4。
表 2.3 比较操作符
操作符 | 描述 | 返回真的例子 |
---|---|---|
相等(==) | 如果操作数相等的话则返回真。 | 3 == var1 |
不等(!=) | 如果操作数不等的话则返回真。 | var1 != 4 |
大于(>) | 如果左操作数大于右操作数的话则返回真。 | var2 > var1 |
大于或等于(>=) | 如果左操作数大于等于右操作数的话则返回真。 | var2 >= var1 var1 >= 3 |
小于(<) | 如果左操作数小于右操作数的话则返回真。 | var1 < var2 |
小于或等于(<=) | 如果左操作数小于等于右操作数的话则返回真。 | var1 <= var2 var2 <= 5 |
算术操作符
将给定数值(常量或变量)进行给定的计算,并返回一个数值。标准的算术操作符是加(+)、减(-)、乘(*)、除(/)四则运算。这些操作符与在其它编程语言中的作用一样。
实现版本 | Navigator 2.0 |
% (取余)
取余操作符用法如下:var1 % var2
取余运算符将返回第一个操作数除以第二个操作数的余数。对于上面的例子来说,将返回 var1 变量除以 var2 变量的余数。更具体的例子是,12 % 5 将返回 2。
++ (自增)
自增操作符用法如下:var++ 或 ++var
该自增操作符将自增操作数(自己加上 1)并返回一个值。如果写在变量后面(如 x++),将返回自增前的值。如果写在变量前面(如 ++x),将返回自增后的值。
例如,如果 x 是 3,那么语句 y = x++ 将先把 y 置为 3 再将 x 自增为 4。相反,语句 y = ++x 将先将 x 自增为 4,再将 y 置为 4。
-- (自减)
自减操作符用法如下:var-- 或 --var
该自增操作符将自减操作数(自己减去 1)并返回一个值。如果写在变量后面(如 x--),将返回自减前的值。如果写在变量前面(如 --x),将返回自减后的值。
例如,如果 x 是 3,那么语句 y = x-- 将先把 y 置为 3 再将 x 自减为 2。相反,语句 y = --x 将先将 x 自减为 2,再将 y 置为 2。
- (求相反数)
求相反数操作数将取得操作数的相反数。例如,y = -x 将把 x 相反数的值赋给 y;也就是说,如果 x 是 3 的话,y 就会获得 -3 而 x 还是 3。
位操作符
执行位操作时,操作符会将操作数看作一串二进制位(1和0),而不是十进制、十六进制或八进制数字。例如,十进制的 9 就是二进制的 1001。位操作符在执行的时候会以二进制形式进行操作,但返回的值仍是标准的 JavaScript 数值。表 2.4 JavaScript 位操作符总览
表 2.4 位操作符
操作符 | 用法 | 描述 |
---|---|---|
按位与 | a & b | 如果两个操作数对应位都是 1 的话则在该位返回 1。 |
按位或 | a | b | 如果两个操作数对应位都是 0 的话则在该位返回 0。 |
按位异或 | a ^ b | 如果两个操作数对应位只有一个 1 的话则在该位返回 1。 |
求反 | ~ a | 反转操作数的每一位。 |
左移 | a << b | 将 a 的二进制形式左移 b 位。右面的空位补零。 |
算术右移 | a >> b | 将 a 的二进制形式右移 b 位。忽略被移出的位。 |
逻辑右移 | a >>> b | 将 a 的二进制形式右移 b 位。忽略被移出的位,左侧补入 0。 |
位逻辑操作符
实现版本 | Navigator 2.0 |
- 将操作数转换为 32 位的整型数值并用二进制表示。
- 第一操作数的每一位与第二操作数的对应位配对:第一位对第一位,第二位对第二位,以此类推。
- 对每一对位应用操作符,最终结果按位组合起来。
- 15 & 9 结果为 9 (1111 & 1001 = 1001)
- 15 | 9 为 15 (1111 | 1001 = 1111)
- 15 ^ 9 为 6 (1111 ^ 1001 = 0110)
移位操作符
实现版本 | Navigator 2.0 |
移位操作符将把两个操作符转换为 32 位整型数值,并返回与左操作数类型相同的结果。
<< (左移)
该操作符将把第一个操作数向左移若干位。移出的位将被忽略。右侧空位补零。例如,9<<2 结果为 36,因为 1001 向左移两位变成 100100,这是 36。
>> (算术右移)
该操作符将把第一个操作数享有移若干位。移出的位将被忽略。左侧的空位补上与原来最左面位相同的值。例如,9>>2 结果为 2,因为 1001 右移两位变成 10,这是 2。反之,-9>>2 结果为 -3,因为要考虑到符号位。
>>> (逻辑右移)
该操作符将把第一个操作数享有移若干位。移出的位将被忽略。左侧的空位补零。例如,19>>>2 结果为 4,因为 10011 右移两位变成 100,这是 4。对于非负数,算术右移和逻辑右移结果相同。
逻辑操作符
逻辑操作符用 Boolean 值(布尔逻辑值)作为操作数,并返回 Boolean 值。
实现版本 | Navigator 2.0 |
表 2.5 描述的很清楚。
表 2.5 逻辑操作符
操作符 | 用法 | 描述 |
---|---|---|
与(&&) | expr1 && expr2 | 如果 expr1 为假则返回之,否则返回 expr2。 |
或(||) | expr1 || expr2 | 如果 expr1 为真则返回之,否则返回 expr2。 |
非(!) | !expr | 如果 expr 为真则返回假,否则返回真。 |
示例
考虑下面的脚本:<script language="JavaScript1.2">"
v1 = "猫";
v2 = "狗";
v3 = false;
document.writeln("t && t 返回 " + (v1 && v2));
document.writeln("f && t 返回 " + (v3 && v1));
document.writeln("t && f 返回 " + (v1 && v3));
document.writeln("f && f 返回 " + (v3 && (3 == 4))); document.writeln("t || t 返回 " + (v1 || v2));
document.writeln("f || t 返回 " + (v3 || v1));
document.writeln("t || f 返回 " + (v1 || v3));
document.writeln("f || f 返回 " + (v3 || (3 == 4)));
document.writeln("!t 返回 " + (!v1));
document.writeln("!f 返回 " + (!v3));
</script>
该脚本将显示下列内容:
t && t 返回 狗
f && t 返回 false
t && f 返回 false
f && f 返回 false
t || t 返回 猫
f || t 返回 猫
t || f 返回 猫
f || f 返回 false
!t 返回 false
!f 返回 true
简化计算
由于逻辑表达式是从左到右计算的,计算机自然不会傻到真的将全部表达式都计算一遍,它会试着偷偷懒,想办法按照下面的规则“简化”计算:
- false && 任何值 都会被简化为 false。
- true || 任何值 都会被简化计算为 true。
字符串操作符
除了比较操作符,可应用于字符串值的操作符还有连接操作符(+),它会将两个字符串连接在一起,并返回连接的结果。例如,“my ” +“string”将返回字符串“my string”。
实现版本 | Navigator 2.0 |
组合赋值操作符 += 也可用于连接字符串。例如,如果变量 mystring 的值为“alpha”,表达式 mystring += "bet" 将计算出“alphabet”并将其赋给 mystring。
特殊操作符
?: (条件操作符)
条件操作符是 JavaScript 所有操作符之中唯一需要三个操作数的。该操作符通常用于取代简单的 if 语句。
实现版本 | Navigator 2.0 |
语法
condition ? expr1 : expr2参数
condition | 计算结果为 true 或 false 的表达式 |
expr1, expr2 | 任意类型值的表达式。 |
描述
如果 condition 为真的话,该操作符将返回 expr1 的值;否则返回 expr2 的值。例如,要根据 isMember 变量的值显示不同的信息,可以使用此语句:document.write ("收费为 " + (isMember ? "$2.00" : "$10.00"))
, (逗号操作符)
逗号操作符非常简单。它会依次计算两个操作数并返回第二个操作数的值。
实现版本 | Navigator 2.0 |
语法
expr1, expr2参数
expr1, expr2 | 任意表达式 |
描述
你可以在你想要在只能填入一个表达式的地方写入多个表达式时使用逗号操作符。该操作符最常见的用途是在 for 语句中使用多个变量作为循环变量。例如,如果 a 是一个 10x10 的二维数组,下面的代码将使用逗号操作符一次自增两个变量。结果是打印出该数组副对角线上的元素:
for (var i=0, j=10; i <= 10; i++, j--)
document.writeln("a["+i+","+j+"]= " + a[i,j])
delete
删除一个对象的属性或者数组中特定位置的元素。
实现版本 | Navigator 2.0 |
语法
delete objectName.propertydelete objectName[index]
delete property
参数
objectName | 对象的名称。 |
属性 | 已有的属性。 |
index | 一个整型数值,表明了要删除的元素在数组处的位置。 |
描述
第三种格式只在 with 语句中合法。如果删除成功,delete 操作符将把属性或元素设为 undefined(未定义)。delete 总是返回 undefined。
new
该操作符用于创建用户自定义对象类型或者拥有构造函数的内建对象类型的实例。
实现版本 | Navigator 2.0 |
语法
objectName = new objectType (param1 [,param2] ...[,paramN])参数
objectName | 新对象实例的名称。 |
objectType | 对象类型。它必须是一个定义对象类型的函数。 |
param1...paramN | 对象的属性值。这些属性是 objectType 函数的参数。 |
描述
创建一个用户自定义对象需要两个步骤:
- 写一个函数定义一种对象类型。
- 用 new 创建一个该对象的实例。
你总可以向已经定义的对象中添加属性。例如,car1.color = "black" 将给 car1 添加一个叫 color 的属性,并给其赋值“black”。不过这对其它任何对象并没有什么作用。要给同一类型的所有对象都添加一个新的属性,你必须向 car 对象类型的定义中添加属性。
你可以使用 Function.prototype 属性向先前定义的对象类型中添加属性。这将定义一个被所有由该函数创建的对象共享的属性,而不只是一个对象类型实例才有。下面的代码将为所有 car 类型的对象添加一个 color 属性,然后将对象 car1 的 color 属性赋值。更多信息,请参看 prototype。
Car.prototype.color=null
car1.color="black"
示例
示例 1:对象类型和对象实例。假设你想要创建一个汽车使用的对象类型。你想要这种对象类型叫做 car,有属性 make, model, 和 year。要完成这么多事情,你需要编写如下的函数:function car(make, model, year) {
this.make = make
this.model = model
this.year = year
}
现在你就可以用下面的方法创建一个叫做 mycar 的对象了:
mycar = new car("Eagle", "Talon TSi", 1993)
该语句创建了 mycar 并将其属性赋了指定的值。也就是说,mycar.make 的值是字符串“Eagle”,mycar.year 是整型数 1993,等等。
使用 new 你可以创建任意多个 car 对象。如,
kenscar = new car("Nissan", "300ZX", 1992) 示例 2: 对象属性就是另外一个对象。假设你按照下面代码定义了一个叫做 person 的对象类型:
function person(name, age, sex) {
this.name = name
this.age = age
this.sex = sex
}
然后创建了两个新的 person 实例:
rand = new person("Rand McNally", 33, "M")
ken = new person("Ken Jones", 39, "M")
现在你可以重写 car 的定义,以便包含一个 person 对象作为 owner 属性表明车主:
function car(make, model, year, owner) {
this.make = make;
this.model = model;
this.year = year;
this.owner = owner;
}
要创建一个新对象的实例,你可以使用下面的代码:
car1 = new car("Eagle", "Talon TSi", 1993, rand);
car2 = new car("Nissan", "300ZX", 1992, ken)
请注意,我们在创建对象的时候并没有给出一个常量字符串或者一个整型值,而是传递了对象 kand 和 ken 作为 owner 的参数。要找出 car2 车主的名字的方法是:
car2.owner.name
this
该关键字用于引用当前对象,通常情况下,方法中的 this 指调用它的对象。
实现版本 | Navigator 2.0 |
语法
this[.propertyName]示例
假定有一个叫做 validate 的函数可以校验对象的 value 属性,如果给出对象值的上下限的话:function validate(obj, lowval, hival) {
if ((obj.value < lowval) || (obj.value > hival))
alert("无效数据e!")
}
你可以在每个窗体元素的 onChange 事件句柄中调用 validate,只用下面的格式传递 this 作为参数就行了:
<B>请输入 18 到 99 之间的数值:</B>
<INPUT TYPE = "text" NAME = "age" SIZE = 3
onChange="validate(this, 18, 99)">
typeof
typeof 操作符用法格式如下:1. typeof operand
2. typeof (operand)
typeof 操作符将返回一个字符串,表明未计算的 operand 操作数是什么类型的。operand 是一个要返回类型的字符串变量、关键字或者对象。圆括号可选。
实现版本 | Navigator 3.0 |
假设你定义了下面的变量:
var myFun = new Function("5+2")
var shape="round"
var size=1
var today=new Date()
typeof 操作符将返回下面的值:
typeof myFun is object
typeof shape is string
typeof size is number
typeof today is object
typeof dontExist is undefined
对于关键字 true 和 null,typeof 操作符返回下面的结果:
typeof true is boolean
typeof null is object
对于数值或字符串,typeof 操作符返回下面的结果:
typeof 62 is number
typeof 'Hello world' is string
对于属性值,typeof 操作符返回属性所含值的类型:
typeof document.lastModified is string
typeof window.length is number
typeof Math.LN2 is number
对于方法和函数,typeof 操作符返回下面的结果:
typeof blur is function
typeof eval is function
typeof parseInt is function
typeof shape.split is function
对于预定义对象,typeof 操作符返回下面的结果:
typeof Date is function
typeof Function is function
typeof Math is function
typeof Option is function
typeof String is function
void
void 操作符用法格式如下:1. javascript:void (expression)
2. javascript:void expression
void 操作符指定要计算一个表达式但是不返回值。expression 是一个要计算的 JavaScript 标准的表达式。表达式外侧的圆括号是可选的,但是写上去是一个好习惯。
实现版本 | Navigator 3.0 |
你可以使用 void 操作符指定超级链接。表达式会被计算但是不会在当前文档处装入任何内容。
下面的代码创建了一个超级链接,当用户点击以后不会发生任何事。当用户点击链接时,void(0) 计算为 0,但在 JavaScript 上没有任何效果。
<A HREF="javascript:void(0)">单击此处什么也不会发生</A>
下面的代码创建了一个超级链接,用户单击时会提交表单。
<A HREF="javascript:void(document.form.submit())">
单击此处提交表单</A>