详解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 相关文章推荐
Firefox getBoxObjectFor getBoundingClientRect联系
Oct 26 Javascript
用showModalDialog弹出页面后,提交表单总是弹出一个新窗口
Jul 18 Javascript
基于JQuery的简单实现折叠菜单代码
Sep 15 Javascript
jQuery 中ajax异步调用的四种方式
Jun 28 Javascript
Bootstrap导航条学习使用(二)
Feb 08 Javascript
vue.js的安装方法
May 12 Javascript
js 监控iframe URL的变化实例代码
Jul 12 Javascript
webpack踩坑之路图片的路径与打包
Sep 05 Javascript
JS实现调用本地摄像头功能示例
May 18 Javascript
layui 弹出层回调获取弹出层数据的例子
Sep 02 Javascript
layui数据表格重载实现往后台传参
Nov 15 Javascript
jquery实现吸顶导航效果
Jan 08 jQuery
使用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
vBulletin HACK----关于排版的两个HACK
2006/10/09 PHP
PHP去除数组中重复的元素并按键名排序函数
2008/08/18 PHP
PHP采用get获取url汉字出现乱码的解决方法
2014/11/13 PHP
通过Mootools 1.2来操纵HTML DOM元素
2009/09/15 Javascript
js特殊字符转义介绍
2013/11/05 Javascript
js构造函数、索引数组和属性的实现方式和使用
2014/11/16 Javascript
DOM节点深度克隆函数cloneNode()用法实例
2015/01/12 Javascript
jQuery中Ajax的load方法详解
2015/01/14 Javascript
浅析创建javascript对象的方法
2016/05/13 Javascript
js对象浅拷贝和深拷贝详解
2016/09/05 Javascript
微信小程序 wx.uploadFile无法上传解决办法
2016/12/14 Javascript
js 函数式编程学习笔记
2017/03/25 Javascript
Angular实现一个简单的多选复选框的弹出框指令实例
2017/04/25 Javascript
对vue.js中this.$emit的深入理解
2018/02/23 Javascript
VUE DEMO之模拟登录个人中心页面之间数据传值实例
2019/10/31 Javascript
关于IDEA中的.VUE文件报错 Export declarations are not supported by current JavaScript version
2020/10/17 Javascript
[05:20]2018DOTA2亚洲邀请赛主赛事第三日战况回顾 LGD率先挺进胜者组决赛
2018/04/06 DOTA
python的类变量和成员变量用法实例教程
2014/08/25 Python
使用Python对微信好友进行数据分析
2018/06/27 Python
利用python-pypcap抓取带VLAN标签的数据包方法
2019/07/23 Python
python lambda表达式(匿名函数)写法解析
2019/09/16 Python
Python实现串口通信(pyserial)过程解析
2019/09/25 Python
python实现的读取网页并分词功能示例
2019/10/29 Python
Python读取Excel一列并计算所有对象出现次数的方法
2020/09/04 Python
谈谈对css属性box-sizing的了解
2017/01/04 HTML / CSS
初级Java程序员面试题
2016/03/03 面试题
专升本自我鉴定
2013/10/10 职场文书
预备党员2014全国两会学习心得体会
2014/03/10 职场文书
暑期社会实践先进个人主要事迹
2014/05/22 职场文书
财务负责人任命书
2014/06/06 职场文书
网络工程专业大学生求职信
2014/10/01 职场文书
公司保洁员岗位职责
2015/02/13 职场文书
任命书怎么写
2015/03/02 职场文书
2015年煤矿安全工作总结
2015/05/23 职场文书
CentOS7和8下安装Maven3.8.4
2022/04/07 Servers
海康机器人重磅发布全新算法开发平台VM4.2
2022/04/21 数码科技