JavaScript按位运算符的应用简析


Posted in Javascript onFebruary 04, 2014

大多数语言都提供了按位运算符,按位运算符在c,c++等语言中运用广泛,而在JS,AS等脚本语言中则没有太多的应用例子,有时候,适当的使用按位运算符会取得很好的效果。
下面根据自己的认知简单的谈一下js中的位操作使用(同样适用于其他语言),如果有错误,欢迎指正。

按位运算符是把操作数看作一系列单独的位,而不是一个数字值。所以在这之前,不得不提到什么是“位”:
数值或字符在内存内都是被存储为0和1的序列,每个0和1被称之为1个位,比如说10进制数据2在计算机内被存储为 0 0 0 0 0 0 1 0,当我们将内存内的位值改变之后,这个值代表的意义也就变了,比如把2前移动一位, 现在存储单元里面变成了0 0 0 0 0 1 0 0,这个值表示的是十进制的4,这也就是按位操作符的运算原理。

按位运算符有6个
& 按位与
|按位或
^按位异或
~取反
>>右移
<<左移

1 & 运算符
&是二元运算符,它以特定的方式的方式组合操作数中对应的位 如果对应的位都为1,那么结果就是1, 如果任意一个位是0 则结果就是0
1 & 3的结果为1
来看看它的怎么运行的:
1的二进制表示为 0 0 0 0 0 0 1
3的二进制表示为 0 0 0 0 0 1 1
根据 & 的规则 得到的结果为 0 0 0 0 0 0 0 1,十进制表示就是1

只要任何一位是0 &运算的结果就是 0,所以可以用&把某个变量不必要的位设为0, 比如某个变量的二进制表示为 0 1 0 0 1 0 0 1, 我想保留低4位,消除高4位 用 & 0x0F就可以了(住:0x0F为16进制表示法,对应的二进制为 0 0 0 0 1 1 1 1),这个特性有个很重要的应用,在后面会提到。

2 | 运算符
| 跟 & 的区别在于 如果对应的位中任一个操作数为1 那么结果就是1
1 | 3 的结果为3

3 ^ 运算符
^运算符跟 | 类似,但有一点不同的是 如果两个操作位都为1的话,结果产生0
0 1 0 0 0 0 0 1
0 1 0 1 1 0 1 0
产生 0 0 0 1 1 0 1 1

4 ~ 运算符
~是对位求反 1变0, 0变1

5 移位运算符移位运算符把位按指定的值向左或向右移动
<< 向左移动 而 >> 向右移动,超过的位将丢失,而空出的位则补0

如 0 1 0 0 0 0 0 0 0 0 0 0 0 1 1(十进制16387) 向左移动两位将变成
0 0 0 0 0 0 0 0 0 0 0 1 1 0 0 (十进制12)
向右移动两位则是
0 0 0 1 0 0 0 0 0 0 0 0 0 0 0(十进制4096)

下面介绍一些具体的应用
前面提到2向前移动1位变成4 利用这个特性可以做乘法运算
2 << 1 =4
3 << 1 = 6
4 << 1 = 8
同理 >> 则可以做除法运算

任何小数 把它 >> 0可以取整
如3.14159 >> 0 = 3;

^运算服有个神奇的特性
如以下代码

<script>
var n1 = 3;
var n2 = 4;
n1 ^= n2;
n2 ^= n1;
n1 ^= n2;
</script>
Javascript 相关文章推荐
js滚动条回到顶部的代码
Dec 06 Javascript
jQuery-onload让第一次页面加载时图片是淡入方式显示
May 23 Javascript
window.location.href = window.location.href 跳转无反应 a超链接onclick事件写法
Aug 21 Javascript
Jquery.Form 异步提交表单的简单实例
Mar 03 Javascript
详解js中构造流程图的核心技术JsPlumb(2)
Dec 08 Javascript
js简单倒计时实现代码
Apr 30 Javascript
详解JavaScript中js对象与JSON格式字符串的相互转换
Feb 14 Javascript
Canvas 绘制粒子动画背景
Feb 15 Javascript
JS倒计时实例_天时分秒
Aug 22 Javascript
vue 动态修改a标签的样式的方法
Jan 18 Javascript
微信{"errcode":48001,"errmsg":"api unauthorized, hints: [ req_id: 1QoCla0699ns81 ]"}
Oct 12 Javascript
jQuery单页面文字搜索插件jquery.fullsearch.js的使用方法
Feb 04 jQuery
Javascript 按位取反运算符 (~)
Feb 04 #Javascript
jQuery操作CheckBox的方法介绍(选中,取消,取值)
Feb 04 #Javascript
jquery操作复选框(checkbox)的12个小技巧总结
Feb 04 #Javascript
jquery 获取dom固定元素 添加样式的简单实例
Feb 04 #Javascript
jquery判断元素的子元素是否存在的示例代码
Feb 04 #Javascript
jquery中get,post和ajax方法的使用小结
Feb 04 #Javascript
jquery中get和post的简单实例
Feb 04 #Javascript
You might like
一贴学会PHP 新手入门教程
2009/08/03 PHP
Ajax PHP 边学边练 之三 数据库
2009/11/26 PHP
PHP输出XML到页面的3种方法详解
2013/06/06 PHP
PHP基于php_imagick_st-Q8.dll实现JPG合成GIF图片的方法
2014/07/11 PHP
在多个页面使用同一个HTML片段《续》
2011/03/04 Javascript
解决3.01版的jquery.form.js中文乱码问题的解决方法
2012/03/08 Javascript
JQuery调webservice实现邮箱验证(检测是否可用)
2013/05/21 Javascript
将json当数据库一样操作的javascript lib
2013/10/28 Javascript
使用JavaScript获取地址栏参数的方法
2014/12/19 Javascript
jQuery选择器及jquery案例详解(必看)
2016/05/20 Javascript
js严格模式总结(分享)
2016/08/22 Javascript
简单理解vue中实例属性vm.$els
2016/12/01 Javascript
动态加载css方法实现和深入解析
2017/01/18 Javascript
JS传参及动态修改页面布局
2017/04/13 Javascript
Angular+Bootstrap+Spring Boot实现分页功能实例代码
2017/07/21 Javascript
vue 自定义组件 v-model双向绑定、 父子组件同步通信的多种写法
2017/11/27 Javascript
Vue-component全局注册实例
2018/09/06 Javascript
微信小程序ibeacon三点定位详解
2018/10/31 Javascript
Vue表单控件绑定图文详解
2019/02/11 Javascript
通过js示例讲解时间复杂度与空间复杂度
2019/08/06 Javascript
JS实现躲避粒子小游戏
2020/06/18 Javascript
jQuery实现评论模块
2020/08/19 jQuery
[03:11]DOTA2上海特锦赛小组赛第一日recap精彩回顾
2016/02/28 DOTA
[01:09:20]NB vs NAVI Supermajor小组赛A组 BO3 第二场 6.2
2018/06/03 DOTA
[06:53]2018DOTA2国际邀请赛寻真——勇于创新的Vici Gaming
2018/08/14 DOTA
一些Centos Python 生产环境的部署命令(推荐)
2018/05/07 Python
详解PyCharm安装MicroPython插件的教程
2019/06/24 Python
用Python进行websocket接口测试
2020/10/16 Python
技术总监岗位职责
2013/12/05 职场文书
幼儿园实习自我鉴定
2013/12/15 职场文书
校长创先争优承诺书
2014/08/30 职场文书
四年级学生期末评语
2014/12/26 职场文书
实习指导教师评语
2014/12/30 职场文书
应届生简历自我评价
2015/03/11 职场文书
2015年毕业生自荐信范文
2015/03/24 职场文书
道歉短信大全
2015/05/12 职场文书