开发手册HTMLCSSJavaScript
HTML手册CSS手册JavaScript手册JavaScriptHTML DOMjQueryJSONDHTMLJavaScript相关jQuery 属性操作 - addClass() 方法jQuery 属性操作 - attr() 方法jQuery 属性操作 - hasClass() 方法jQuery 属性操作 - removeAttr() 方法jQuery 属性操作 - removeClass() 方法jQuery 属性操作 - toggleClass() 方法jQuery 属性操作 - val() 方法jQuery CSS 操作 - css() 方法jQuery CSS 操作 - height() 方法jQuery CSS 操作 - offset() 方法jQuery CSS 操作 - offsetParent() 方法jQuery CSS 操作 - position() 方法jQuery CSS 操作 - scrollLeft() 方法jQuery CSS 操作 - scrollTop() 方法jQuery CSS 操作 - width() 方法jQuery 遍历 - clearQueue() 方法jQuery 数据 - data() 方法jQuery 遍历 - dequeue() 方法jQuery 遍历 - hasData() 方法jQuery 数据 - jQuery.data() 方法jQuery 遍历 - jQuery.dequeue() 方法jQuery 遍历 - jQuery.queue() 方法jQuery 数据 - jQuery.removeData() 方法jQuery 遍历 - queue() 方法jQuery 数据 - removeData() 方法jQuery DOM 元素方法 - get() 方法jQuery DOM 元素方法 - index() 方法jQuery DOM 元素方法 - size() 方法jQuery DOM 元素方法 - toArray() 方法jQuery 效果 - animate() 方法jQuery 效果 - clearQueue() 方法jQuery 效果 - fadeIn() 方法jQuery 效果 - fadeOut() 方法jQuery 效果 - fadeTo() 方法jQuery 效果 - hide() 方法jQuery 效果 - show() 方法jQuery 效果 - slideDown() 方法jQuery 效果 - slideToggle() 方法jQuery 效果 - slideUp() 方法jQuery 效果 - stop() 方法jQuery 效果 - toggle() 方法jQuery 事件 - bind() 方法jQuery 事件 - blur() 方法jQuery 事件 - change() 方法jQuery 事件 - click() 方法jQuery 事件 - dblclick() 方法jQuery 事件 - delegate() 方法jQuery 事件 - die() 方法jQuery 事件 - error() 方法jQuery 事件 - focus() 方法jQuery 事件 - isDefaultPrevented() 方法jQuery 事件 - keydown() 方法jQuery 事件 - keypress() 方法jQuery 事件 - keyup() 方法jQuery 事件 - live() 方法jQuery 事件 - load() 方法jQuery 事件 - mousedown() 方法jQuery 事件 - mouseenter() 方法jQuery 事件 - mouseleave() 方法jQuery 事件 - mousemove() 方法jQuery 事件 - mouseout() 方法jQuery 事件 - mouseover() 方法jQuery 事件 - mouseup() 方法jQuery 事件 - one() 方法jQuery 事件 - pageX 属性jQuery 事件 - pageY 属性jQuery 事件 - preventDefault() 方法jQuery 事件 - ready() 方法jQuery 事件 - resize() 方法jQuery 事件 - result 属性jQuery 事件 - scroll() 方法jQuery 事件 - select() 方法jQuery 事件 - submit() 方法jQuery 事件 - target 属性jQuery 事件 - timeStamp 属性jQuery 事件 - toggle() 方法jQuery 事件 - trigger() 方法jQuery 事件 - triggerHandler() 方法jQuery 事件 - type 属性jQuery 事件 - unbind() 方法jQuery 事件 - undelegate() 方法jQuery 事件 - unload 属性jQuery 事件 - which 属性jQuery 效果jQuery HTML 操作jQuery 参考手册 - 队列控制jQuery 文档操作 - after() 方法jQuery 文档操作 - append() 方法jQuery 文档操作 - appendTo() 方法jQuery 文档操作 - before() 方法jQuery 文档操作 - clone() 方法jQuery 文档操作 - detach() 方法jQuery 文档操作 - empty() 方法jQuery 文档操作 - html() 方法jQuery 文档操作 - insertAfter() 方法jQuery 文档操作 - insertBefore() 方法jQuery 文档操作 - prependTo() 方法jQuery 文档操作 - prepend() 方法jQuery 文档操作 - remove() 方法jQuery 文档操作 - replaceAll() 方法jQuery 文档操作 - replaceWith() 方法jQuery 文档操作 - text() 方法jQuery 文档操作 - unwrap() 方法jQuery 文档操作 - wrap() 方法jQuery 文档操作 - wrapAll() 方法jQuery 文档操作 - wrapInner() 方法jQuery context 属性jQuery jquery 属性jQuery jQuery.fx.interval 属性jQuery jQuery.fx.off 属性jQuery jQuery.support 属性jQuery length 属性jQuery * 选择器jQuery :animated 选择器jQuery [attribute] 选择器jQuery [attribute$=value] 选择器jQuery [attribute=value] 选择器jQuery [attribute!=value] 选择器jQuery . 选择器jQuery :contains 选择器jQuery element 选择器jQuery :empty 选择器jQuery :eq() 选择器jQuery :even 选择器jQuery :first 选择器jQuery :gt 选择器jQuery :header 选择器jQuery # 选择器jQuery :input 选择器jQuery :button 选择器jQuery :checkbox 选择器jQuery :checked 选择器jQuery :disabled 选择器jQuery :enabled 选择器jQuery :file 选择器jQuery :image 选择器jQuery :password 选择器jQuery :radio 选择器jQuery :reset 选择器jQuery :selected 选择器jQuery :submit 选择器jQuery :text 选择器jQuery :last 选择器jQuery :lt 选择器jQuery :odd 选择器jQuery :visible 选择器jQuery 遍历 - add() 方法jQuery 遍历 - andSelf() 方法jQuery 遍历 - children() 方法jQuery 遍历 - closest() 方法jQuery 遍历 - contents() 方法jQuery 遍历 - each() 方法jQuery 遍历 - end() 方法jQuery 遍历 - eq() 方法jQuery 遍历 - filter() 方法jQuery 遍历 - find() 方法jQuery 遍历 - first() 方法jQuery 遍历 - has() 方法jQuery 遍历 - is() 方法jQuery 遍历 - last() 方法jQuery 遍历 - map() 方法jQuery 遍历 - next() 方法jQuery 遍历 - nextAll() 方法jQuery 遍历 - nextUntil() 方法jQuery 遍历 - not() 方法jQuery 遍历 - offsetParent() 方法jQuery 遍历 - parent() 方法jQuery 遍历 - parents() 方法jQuery 遍历 - parentsUntil() 方法jQuery 遍历 - prev() 方法jQuery 遍历 - prevAll() 方法jQuery 遍历 - prevUntil() 方法jQuery 遍历 - siblings() 方法jQuery 遍历 - slice() 方法jQuery Mobile 教程ECMAScript 函数概述ECMAScript arguments 对象ECMAScript 闭包(closure)ECMAScript Function 对象(类)JavaScript 的历史JavaScript 实现ECMAScript 关键字ECMAScript 定义类或对象ECMAScript 修改对象ECMAScript 面向对象技术ECMAScript 对象作用域ECMAScript 对象类型ECMAScript 对象应用ECMAScript 加性运算符ECMAScript 赋值运算符ECMAScript 位运算符ECMAScript Boolean 运算符ECMAScript 逗号运算符ECMAScript 条件运算符ECMAScript 等性运算符ECMAScript 乘性运算符ECMAScript 关系运算符ECMAScript 一元运算符ECMAScript 原始类型ECMAScript 引用类型ECMAScript 保留字ECMAScript break 和 continue 语句ECMAScript if 语句ECMAScript 迭代语句ECMAScript 标签语句ECMAScript switch 语句ECMAScript with 语句ECMAScript 语法ECMAScript 类型转换ECMAScript 原始值和引用值ECMAScript 变量HTML DOM Anchor 对象HTML DOM Area 对象HTML DOM Audio 对象HTML DOM Base 对象HTML DOM Blockquote 对象HTML DOM Body 对象HTML DOM Button 对象HTML DOM Canvas 对象HTML DOM Checkbox 对象HTML DOM Column 对象HTML DOM Color 对象HTML DOM Datalist 对象HTML DOM Input Date 对象HTML DOM Datetime Local 对象HTML DOM Datetime 对象HTML DOM Del 对象HTML DOM Details 对象HTML DOM Dialog 对象HTML DOM Document 对象HTML DOM Email 对象HTML DOM Embed 对象HTML DOM Event 对象HTML DOM Fieldset 对象HTML DOM FileUpload 对象HTML DOM Form 对象HTML DOM Frame 对象HTML DOM Frameset 对象HTML DOM Hidden 对象History 对象HTML DOM IFrame 对象HTML DOM Image 对象HTML DOM Input Image 对象HTML DOM Input Time 对象HTML DOM Ins 对象HTML DOM Keygen 对象HTML DOM Legend 对象HTML DOM Li 对象HTML DOM Link 对象Location 对象HTML DOM Map 对象HTML DOM MenuItem 对象HTML DOM Meta 对象HTML DOM Meter 对象HTML DOM Month 对象Navigator 对象HTML DOM Number 对象HTML DOM Object 对象HTML DOM Ol 对象HTML DOM OptionGroup 对象HTML DOM Option 对象HTML DOM Parameter 对象HTML DOM Password 对象HTML DOM Progress 对象HTML DOM Button 对象HTML DOM Quote 对象HTML DOM Radio 对象HTML DOM Input Range 对象HTML DOM Reset 对象Screen 对象HTML DOM Script 对象HTML DOM Input Search 对象HTML DOM Select 对象HTML DOM Source 对象HTML DOM Style 对象HTML DOM Submit 对象HTML DOM Table 对象HTML DOM TableCell 对象HTML DOM TableHeader 对象HTML DOM TableRow 对象HTML DOM Text 对象HTML DOM Textarea 对象HTML DOM Time 对象HTML DOM Title 对象HTML DOM Track 对象HTML DOM Input URL 对象HTML DOM Video 对象HTML DOM Input Week 对象Window 对象JavaScript eval() 函数JavaScript Array 对象JavaScript Boolean 对象JavaScript Date 对象JavaScript 全局对象JavaScript Math 对象JavaScript Number 对象JavaScript RegExp 对象JavaScript String 对象HTML DOM getContext() 方法多媒体教程 - 在 Web 上使用图像多媒体教程 - GIF 图像多媒体教程 - JPEG 图像PHP 教程SVG 教程HTTP 方法:GET 对比 POST什么是超文本?TCP/IP 教程VBScript 教程万维网联盟(W3C)教程XML 教程XML DOM 加载函数XML DOM 教程XML DOM 参考手册

ECMAScript 位运算符

位运算符是在数字底层(即表示数字的 32 个数位)进行操作的。

重温整数

ECMAScript 整数有两种类型,即有符号整数(允许用正数和负数)和无符号整数(只允许用正数)。在 ECMAScript 中,所有整数字面量默认都是有符号整数,这意味着什么呢?

有符号整数使用 31 位表示整数的数值,用第 32 位表示整数的符号,0 表示正数,1 表示负数。数值范围从 -2147483648 到 2147483647。

可以以两种不同的方式存储二进制形式的有符号整数,一种用于存储正数,一种用于存储负数。正数是以真二进制形式存储的,前 31 位中的每一位都表示 2 的幂,从第 1 位(位 0)开始,表示 20,第 2 位(位 1)表示 21。没用到的位用 0 填充,即忽略不计。例如,下图展示的是数 18 的表示法。

32 位二进制表示的有符号整数

18 的二进制版本只用了前 5 位,它们是这个数字的有效位。把数字转换成二进制字符串,就能看到有效位:

var iNum = 18;
alert(iNum.toString(2));	//输出 "10010"

这段代码只输出 "10010",而不是 18 的 32 位表示。其他的数位并不重要,因为仅使用前 5 位即可确定这个十进制数值。如下图所示:

5 位二进制表示的整数 18

负数也存储为二进制代码,不过采用的形式是二进制补码。计算数字二进制补码的步骤有三步:

  1. 确定该数字的非负版本的二进制表示(例如,要计算 -18的二进制补码,首先要确定 18 的二进制表示)
  2. 求得二进制反码,即要把 0 替换为 1,把 1 替换为 0
  3. 在二进制反码上加 1

要确定 -18 的二进制表示,首先必须得到 18 的二进制表示,如下所示:

0000 0000 0000 0000 0000 0000 0001 0010

接下来,计算二进制反码,如下所示:

1111 1111 1111 1111 1111 1111 1110 1101

最后,在二进制反码上加 1,如下所示:

1111 1111 1111 1111 1111 1111 1110 1101
                                      1
---------------------------------------
1111 1111 1111 1111 1111 1111 1110 1110

因此,-18 的二进制表示即 1111 1111 1111 1111 1111 1111 1110 1110。记住,在处理有符号整数时,开发者不能访问 31 位。

有趣的是,把负整数转换成二进制字符串后,ECMAScript 并不以二进制补码的形式显示,而是用数字绝对值的标准二进制代码前面加负号的形式输出。例如:

var iNum = -18;
alert(iNum.toString(2));	//输出 "-10010"

这段代码输出的是 "-10010",而非二进制补码,这是为避免访问位 31。为了简便,ECMAScript 用一种简单的方式处理整数,使得开发者不必关心它们的用法。

另一方面,无符号整数把最后一位作为另一个数位处理。在这种模式中,第 32 位不表示数字的符号,而是值 231。由于这个额外的位,无符号整数的数值范围为 0 到 4294967295。对于小于 2147483647 的整数来说,无符号整数看来与有符号整数一样,而大于 2147483647 的整数则要使用位 31(在有符号整数中,这一位总是 0)。

把无符号整数转换成字符串后,只返回它们的有效位。

注意:所有整数字面量都默认存储为有符号整数。只有 ECMAScript 的位运算符才能创建无符号整数。

位运算 NOT

位运算 NOT 由否定号(~)表示,它是 ECMAScript 中为数不多的与二进制算术有关的运算符之一。

位运算 NOT 是三步的处理过程:

  1. 把运算数转换成 32 位数字
  2. 把二进制数转换成它的二进制反码
  3. 把二进制数转换成浮点数

例如:

var iNum1 = 25;		//25 等于 00000000000000000000000000011001
var iNum2 = ~iNum1;	//转换为 11111111111111111111111111100110
alert(iNum2);		//输出 "-26"

位运算 NOT 实质上是对数字求负,然后减 1,因此 25 变 -26。用下面的方法也可以得到同样的方法:

var iNum1 = 25;
var iNum2 = -iNum1 -1;
alert(iNum2);	//输出 -26

位运算 AND

位运算 AND 由和号(&)表示,直接对数字的二进制形式进行运算。它把每个数字中的数位对齐,然后用下面的规则对同一位置上的两个数位进行 AND 运算:

第一个数字中的数位 第二个数字中的数位 结果
1 1 1
1 0 0
0 1 0
0 0 0

例如,要对数字 25 和 3 进行 AND 运算,代码如下所示:

var iResult = 25 & 3;
alert(iResult);	//输出 "1"

25 和 3 进行 AND 运算的结果是 1。为什么?分析如下:

 25 = 0000 0000 0000 0000 0000 0000 0001 1001
  3 = 0000 0000 0000 0000 0000 0000 0000 0011
---------------------------------------------
AND = 0000 0000 0000 0000 0000 0000 0000 0001

可以看出,在 25 和 3 中,只有一个数位(位 0)存放的都是 1,因此,其他数位生成的都是 0,所以结果为 1。

位运算 OR

位运算 OR 由符号(|)表示,也是直接对数字的二进制形式进行运算。在计算每位时,OR 运算符采用下列规则:

第一个数字中的数位 第二个数字中的数位 结果
1 1 1
1 0 1
0 1 1
0 0 0

仍然使用 AND 运算符所用的例子,对 25 和 3 进行 OR 运算,代码如下:

var iResult = 25 | 3;
alert(iResult);	//输出 "27"

25 和 3 进行 OR 运算的结果是 27:

25 = 0000 0000 0000 0000 0000 0000 0001 1001
 3 = 0000 0000 0000 0000 0000 0000 0000 0011
--------------------------------------------
OR = 0000 0000 0000 0000 0000 0000 0001 1011

可以看出,在两个数字中,共有 4 个数位存放的是 1,这些数位被传递给结果。二进制代码 11011 等于 27。

位运算 XOR

位运算 XOR 由符号(^)表示,当然,也是直接对二进制形式进行运算。XOR 不同于 OR,当只有一个数位存放的是 1 时,它才返回 1。真值表如下:

第一个数字中的数位 第二个数字中的数位 结果
1 1 0
1 0 1
0 1 1
0 0 0

对 25 和 3 进行 XOR 运算,代码如下:

var iResult = 25 ^ 3;
alert(iResult);	//输出 "26"

25 和 3 进行 XOR 运算的结果是 26:

 25 = 0000 0000 0000 0000 0000 0000 0001 1001
  3 = 0000 0000 0000 0000 0000 0000 0000 0011
---------------------------------------------
XOR = 0000 0000 0000 0000 0000 0000 0001 1010

可以看出,在两个数字中,共有 4 个数位存放的是 1,这些数位被传递给结果。二进制代码 11010 等于 26。

左移运算

左移运算由两个小于号表示(<<)。它把数字中的所有数位向左移动指定的数量。例如,把数字 2(等于二进制中的 10)左移 5 位,结果为 64(等于二进制中的 1000000):

var iOld = 2;		//等于二进制 10
var iNew = iOld << 5;	//等于二进制 1000000 十进制 64

注意:在左移数位时,数字右边多出 5 个空位。左移运算用 0 填充这些空位,使结果成为完整的 32 位数字。

数字 2 进行左移运算

注意:左移运算保留数字的符号位。例如,如果把 -2 左移 5 位,得到的是 -64,而不是 64。“符号仍然存储在第 32 位中吗?”是的,不过这在 ECMAScript 后台进行,开发者不能直接访问第 32 个数位。即使输出二进制字符串形式的负数,显示的也是负号形式(例如,-2 将显示 -10。)

有符号右移运算

有符号右移运算符由两个大于号表示(>>)。它把 32 位数字中的所有数位整体右移,同时保留该数的符号(正号或负号)。有符号右移运算符恰好与左移运算相反。例如,把 64 右移 5 位,将变为 2:

var iOld = 64;		//等于二进制 1000000
var iNew = iOld >> 5;	//等于二进制 10 十进制 2

同样,移动数位后会造成空位。这次,空位位于数字的左侧,但位于符号位之后。ECMAScript 用符号位的值填充这些空位,创建完整的数字,如下图所示:

数字 64 进行有符号右移运算

无符号右移运算

无符号右移运算符由三个大于号(>>>)表示,它将无符号 32 位数的所有数位整体右移。对于正数,无符号右移运算的结果与有符号右移运算一样。

用有符号右移运算中的例子,把 64 右移 5 位,将变为 2:

var iOld = 64;		//等于二进制 1000000
var iNew = iOld >>> 5;	//等于二进制 10 十进制 2

对于负数,情况就不同了。

无符号右移运算用 0 填充所有空位。对于正数,这与有符号右移运算的操作一样,而负数则被作为正数来处理。

由于无符号右移运算的结果是一个 32 位的正数,所以负数的无符号右移运算得到的总是一个非常大的数字。例如,如果把 -64 右移 5 位,将得到 134217726。如何得到这种结果的呢?

要实现这一点,需要把这个数字转换成无符号的等价形式(尽管该数字本身还是有符号的),可以通过以下代码获得这种形式:

var iUnsigned64 = -64 >>> 0;

然后,用 Number 类型的 toString() 获取它的真正的位表示,采用的基为 2:

alert(iUnsigned64.toString(2));

这将生成 11111111111111111111111111000000,即有符号整数 -64 的二进制补码表示,不过它等于无符号整数 4294967232。

出于这种原因,使用无符号右移运算符要小心。

关于千图| 赞助千图 |千图首页   Copyright2014千图网   沪ICP备10011451号-6   用时:0.0467秒

千图网提示