详解js运算符单竖杠“|”与“||”的用法和作用介绍


Posted in Javascript onNovember 04, 2016

在js开发应用中我们通常会碰到“|”与“||”了,那么在运算中“|”与“||”是什么意思呢?

在js整数操作的时候,相当于去除小数点,parseInt。在正数的时候相当于Math.floor(),负数的时候相当于Math.ceil() 注:

1. Math.ceil()用作向上取整。
2. Math.floor()用作向下取整。
3. Math.round() 我们数学中常用到的四舍五入取整。

console.log(0.6|0)//0
console.log(1.1|0)//1
console.log(3.65555|0)//3
console.log(5.99999|0)//5
console.log(-7.777|0)//-7

单竖杠的运算规则

看了上面的例子,大体知道单竖杠可以进行取整运算,就是只保留正数部分,小数部分通过拿掉,但是“|0”,又是如何进行运算的呢,为什么能“|0”能达到取整的目的呢?单竖杠不是0有会是多少呢?

带着这些问题,我们看下面例子:

console.log(3|4); //7
console.log(4|4);//4
console.log(8|3);//11
console.log(5.3|4.1);//5
console.log(9|3455);//3455

这里面提到了单竖杠“|”但是没有javascript的。

好吧,我在这里公布答案吧。其实单竖杠“|”就是转换为2进制之后相加得到的结果。例如我们拿简单的举例:

3|4

转换为二进制之后011|100  相加得到111=7

4|4

转换为二进制之后100 |100  相加得到100=4

8|3

转换为二进制之后1000 |011  相加得到1011=11

以此类推,我在这里就不一一列举了,单竖杠“|”运算就是转换为2进制之后相加得到的结果!

JS 双竖线运算符

1、JS双竖线运算符:是或比较.如null||'1',返回'1';'2'||'1',返回'2'.即或运算符中,第一个为真,后面的就不用计算了.所以得'2'。

2、js 中 使用双竖线运算符"||",返回第一个有效值

var objOne = undefined || 1 || null || new Date(); 
var objTwo = new Date(); 
var objThree = objOne || objTwo; 
alert(objThree.toString()); //out put "1"

总结

性能上的比较

逻辑运算符&& || 中,如果&&的第一个运算数是false,就不再考虑第二个运算数,直接返回false;如果||的第一个运算数是true,也不再考虑第二个运算数,直接返回true。而&和|运算符却不是这样的,它们总是要比较两个运算数才得出结果,因而性能上&&和||会比&和|好。

功能用法

&&和||只能进行逻辑运算,而&和|除了可以进行"逻辑运算"外,还可以进行位运算

位运算

&和|本是位运算符,之所以可以进行"逻辑运算",是由于JS是无类型的语言、各数据类型可以自由转换这一特性决定的,当用&和|进行"逻辑运算"时,实际上true被转换成1,false被转换成0,再进行逐位运算:

document.write(true & false); //JS,结果为0

上面这句,实例等同于逻辑运算被转化成下面的位运算,并执行:

document.write(1 & 0); //JS,结果为0

也正是由于&和|是逐位运算符,才出现了第一点中所说的,它们总是要比较两个运算数才得出结果,才导致性能会比&&和||低一些。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript中call和apply方法浅谈
Sep 27 Javascript
js为空或不是对象问题的快速解决方法
Dec 11 Javascript
jquery操作angularjs对象
Jun 26 Javascript
JavaScript字符串删除重复字符的方法
Dec 25 Javascript
jQuery表单事件实例代码分享
Aug 18 Javascript
jQuery实现的自定义弹出层效果实例详解
Sep 04 Javascript
简单实现js点击展开二级菜单功能
May 16 Javascript
JavaScript满天星导航栏实现方法
Mar 08 Javascript
详解SPA中前端路由基本原理与实现方式
Sep 12 Javascript
js笔试题-接收get请求参数
Jun 15 Javascript
微信小程序数据统计和错误统计的实现方法
Jun 26 Javascript
Vue数组响应式操作及高阶函数使用代码详解
Aug 01 Javascript
使用Ajax与服务器(JSON)通信实例
Nov 04 #Javascript
AngularJS过滤器filter用法实例分析
Nov 04 #Javascript
URL的参数中有加号传值变为空格的问题(URL特殊字符)
Nov 04 #Javascript
Angular页面间切换及传值的4种方法
Nov 04 #Javascript
AngularJS实现根据变量改变动态加载模板的方法
Nov 04 #Javascript
RGB和YUV 多媒体编程基础详细介绍
Nov 04 #Javascript
javascript设置文本框光标的方法实例小结
Nov 04 #Javascript
You might like
PHP开发文件系统实例讲解
2006/10/09 PHP
php后台多用户权限组思路与实现程序代码分享
2012/02/13 PHP
php中opendir函数用法实例
2014/11/15 PHP
thinkphp3.2.2前后台公用类架构问题分析
2014/11/25 PHP
php生成图片缩略图功能示例
2017/02/22 PHP
javascript将相对路径转绝对路径示例
2014/03/14 Javascript
JQuery实现Ajax加载图片的方法
2015/12/24 Javascript
使用getBoundingClientRect方法实现简洁的sticky组件的方法
2016/03/22 Javascript
动态加载js文件简单示例
2016/04/21 Javascript
JS控件bootstrap datepicker使用方法详解
2017/03/25 Javascript
关于axios返回空对象的问题解决
2017/04/04 Javascript
详解AngularJS ui-sref的简单使用
2017/04/24 Javascript
浅谈vue中数据双向绑定的实现原理
2017/09/14 Javascript
Vue-router路由判断页面未登录跳转到登录页面的实例
2017/10/26 Javascript
官方推荐react-navigation的具体使用详解
2018/05/08 Javascript
利用 Chrome Dev Tools 进行页面性能分析的步骤说明(前端性能优化)
2021/02/24 Javascript
python 创建弹出式菜单的实现代码
2017/07/11 Python
树莓派动作捕捉抓拍存储图像脚本
2019/06/22 Python
python列表每个元素同增同减和列表元素去空格的实例
2019/07/20 Python
Python中三维坐标空间绘制的实现
2020/09/22 Python
python字符串拼接+和join的区别详解
2020/12/03 Python
HTML5 form标签之解放表单验证、增加文件上传、集成拖放的使用方法
2013/04/24 HTML / CSS
BIBLOO波兰:捷克的一家在线服装店
2018/03/09 全球购物
环境科学专业个人求职信
2013/12/15 职场文书
信息服务专业毕业生求职信
2014/03/02 职场文书
升国旗仪式主持词
2014/03/19 职场文书
林肯就职演讲稿
2014/05/19 职场文书
计算机专业求职信
2014/06/02 职场文书
小学生常见病防治方案
2014/06/06 职场文书
企业标语大全
2014/07/01 职场文书
2014基层党员批评与自我批评范文
2014/09/24 职场文书
房屋过户委托书范本
2014/10/07 职场文书
复兴之路观后感
2015/06/02 职场文书
严以律己专题学习研讨会发言材料
2015/11/09 职场文书
vue组件的路由高亮问题解决方法
2021/05/11 Vue.js
关于Numpy之repeat、tile的用法总结
2021/06/02 Python