Javascript操作符应用详细讲解

【 tulaoshi.com - Web开发 】

 赋值操作符赋值操作符会根据其右操作数侧的值给左操作数赋值。

最基本的赋值操作数是等号(=)，它会将右操作数的值直接赋给左操作数。也就是说，x = y 将把 y 的值赋给 x。其它的赋值操作符都是标准操作的缩略形式，列在表 2.2 中。

表 2.2 赋值操作符 缩写操作符 含义

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）比较操作符所谓比较操作符，就是会比较其两边的操作数，并根据比较结果为真或假返回逻辑值。操作数可以是数值或字符串值。如果使用字符串值的话，比较是基于标准的字典顺序。

相关内容列在了表 2.3 中。对于该表中的示例，我们假定 var1 被赋予了值 3，而 var2 被赋予了值 4。

表 2.3 比较操作符 操作符 描述 返回真的例子 var2 = var1
var1 = 3 var1 = var2
var2 = 5

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）算术操作符将给定数值(常量或变量)进行给定的计算，并返回一个数值。标准的算术操作符是加(+)、减(-)、乘(*)、除(/)四则运算。这些操作符与在其它编程语言中的作用一样。

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）% (取余)取余操作符用法如下：

var1 % var2

取余运算符将返回第一个操作数除以第二个操作数的余数。对于上面的例子来说，将返回 var1 变量除以 var2 变量的余数。更具体的例子是，12 % 5 将返回 2。

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）++ (自增)自增操作符用法如下：

var++ 或 ++var

该自增操作符将自增操作数(自己加上 1)并返回一个值。如果写在变量后面(如 x++)，将返回自增前的值。如果写在变量前面(如 ++x)，将返回自增后的值。

例如，如果 x 是 3，那么语句 y = x++ 将先把 y 置为 3 再将 x 自增为 4。相反，语句 y = ++x 将先将 x 自增为 4，再将 y 置为 4。

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）-- (自减)自减操作符用法如下：

var-- 或 --var

该自增操作符将自减操作数(自己减去 1)并返回一个值。如果写在变量后面(如 x--)，将返回自减前的值。如果写在变量前面(如 --x)，将返回自减后的值。

例如，如果 x 是 3，那么语句 y = x-- 将先把 y 置为 3 再将 x 自减为 2。相反，语句 y = --x 将先将 x 自减为 2，再将 y 置为 2。

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）- (求相反数)求相反数操作数将取得操作数的相反数。例如，y = -x 将把 x 相反数的值赋给 y；也就是说，如果 x 是 3 的话，y 就会获得 -3 而 x 还是 3。

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）位操作符执行位操作时，操作符会将操作数看作一串二进制位(1和0)，而不是十进制、十六进制或八进制数字。例如，十进制的 9 就是二进制的 1001。位操作符在执行的时候会以二进制形式进行操作，但返回的值仍是标准的 JavaScript 数值。

表 2.4 JavaScript 位操作符总览

表 2.4 位操作符 操作符 用法 描述

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）位逻辑操作符

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）将操作数转换为 32 位的整型数值并用二进制表示。

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）第一操作数的每一位与第二操作数的对应位配对：第一位对第一位，第二位对第二位，以此类推。

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）对每一对位应用操作符，最终结果按位组合起来。 例如，9 的二进制表示为 1001，15 的二进制表示为 1111。所以如果对这两个数应用位逻辑操作符，结果应该像下面这样：

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）15 & 9 结果为 9 (1111 & 1001 = 1001)

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）15 | 9 为 15 (1111 | 1001 = 1111)

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）15 ^ 9 为 6 (1111 ^ 1001 = 0110) 移位操作符

移位操作符将把两个操作符转换为 32 位整型数值，并返回与左操作数类型相同的结果。

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/） (左移)该操作符将把第一个操作数向左移若干位。移出的位将被忽略。右侧空位补零。

例如，92 结果为 36，因为 1001 向左移两位变成 100100，这是 36。

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/） (算术右移)该操作符将把第一个操作数享有移若干位。移出的位将被忽略。左侧的空位补上与原来最左面位相同的值。

例如，92 结果为 2，因为 1001 右移两位变成 10，这是 2。反之，-92 结果为 -3，因为要考虑到符号位。

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/） (逻辑右移)该操作符将把第一个操作数享有移若干位。移出的位将被忽略。左侧的空位补零。

例如，192 结果为 4，因为 10011 右移两位变成 100，这是 4。对于非负数，算术右移和逻辑右移结果相同。

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）逻辑操作符逻辑操作符用 Boolean 值(布尔逻辑值)作为操作数，并返回 Boolean 值。

表 2.5 描述的很清楚。

表 2.5 逻辑操作符 操作符 用法 描述

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）示例考虑下面的脚本：

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

简化计算由于逻辑表达式是从左到右计算的，计算机自然不会傻到真的将全部表达式都计算一遍，它会试着偷偷懒，想办法按照下面的规则简化计算：

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）false && 任何值 都会被简化为 false。

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）true || 任何值 都会被简化计算为 true。 逻辑运算的简化原则是保证逻辑运算本身总是正确的。请注意，如果使用了简化规则，那么被简化掉的表达式就不会进行计算，所以也就不会产生它应该起的作用。

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）字符串操作符除了比较操作符，可应用于字符串值的操作符还有连接操作符(+)，它会将两个字符串连接在一起，并返回连接的结果。例如，my  +string将返回字符串my string。

组合赋值操作符 += 也可用于连接字符串。例如，如果变量 mystring 的值为alpha，表达式 mystring += "bet" 将计算出alphabet并将其赋给 mystring。

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）特殊操作符？: (条件操作符)条件操作符是 JavaScript 所有操作符之中唯一需要三个操作数的。该操作符通常用于取代简单的 if 语句。

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）语法 condition ？ expr1 : expr2参数

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）描述如果 condition 为真的话，该操作符将返回 expr1 的值；否则返回 expr2 的值。例如，要根据 isMember 变量的值显示不同的信息，可以使用此语句：

document.write ("收费为 " + (isMember ？ "$2.00" : "$10.00"))

, (逗号操作符)逗号操作符非常简单。它会依次计算两个操作数并返回第二个操作数的值。

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）语法expr1, expr2参数

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）描述你可以在你想要在只能填入一个表达式的地方写入多个表达式时使用逗号操作符。该操作符最常见的用途是在 for 语句中使用多个变量作为循环变量。

例如，如果 a 是一个 10x10 的二维数组，下面的代码将使用逗号操作符一次自增两个变量。结果是打印出该数组副对角线上的元素：

for (var i=0, j=10; i = 10; i++, j--)
   document.writeln("a["+i+","+j+"]= " + a[i,j])

delete删除一个对象的属性或者数组中特定位置的元素。

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）语法delete objectName.property
delete objectName[index]
delete property参数

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）描述第三种格式只在 with 语句中合法。

如果删除成功，delete 操作符将把属性或元素设为 undefined(未定义)。delete 总是返回 undefined。

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）new该操作符用于创建用户自定义对象类型或者拥有构造函数的内建对象类型的实例。

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）语法objectName = new objectType (param1 [,param2] ...[,paramN])参数

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）描述创建一个用户自定义对象需要两个步骤：

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）写一个函数定义一种对象类型。

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）用 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 指调用它的对象。

 

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）语法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)"

typeoftypeof 操作符用法格式如下：

1. typeof operand
2. typeof (operand)

typeof 操作符将返回一个字符串，表明未计算的 operand 操作数是什么类型的。operand 是一个要返回类型的字符串变量、关键字或者对象。圆括号可选。

假设你定义了下面的变量：

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

voidvoid 操作符用法格式如下：

1. javascript:void (expression)
2. javascript:void expression

void 操作符指定要计算一个表达式但是不返回值。expression 是一个要计算的 JavaScript 标准的表达式。表达式外侧的圆括号是可选的，但是写上去是一个好习惯。

你可以使用 void 操作符指定超级链接。表达式会被计算但是不会在当前文档处装入任何内容。

下面的代码创建了一个超级链接，当用户点击以后不会发生任何事。当用户点击链接时，void(0) 计算为 0，但在 JavaScript 上没有任何效果。

A HREF="javascript:void(0)"单击此处什么也不会发生/A

（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）

下面的代码创建了一个超级链接，用户单击时会提交表单。

A HREF="javascript:void(document.form.submit())"
单击此处提交表单/A

移位操作符需要两个操作数：第一个是要进行移位的数值，第二个指定要对第一个数移位的数目。移位的方向由使用的操作符决定。 从原理上讲，位逻辑操作符的工作流程是这样的：