详解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 相关文章推荐
不能再简单的无闪刷新验证码原理很简单
Nov 05 Javascript
js 弹出菜单/窗口效果
Oct 30 Javascript
js css后面所带参数含义介绍
Aug 18 Javascript
Jquery创建一个层当鼠标移动到层上面不消失效果
Dec 12 Javascript
实例讲解jQuery EasyUI tree中state属性慎用
Apr 01 Javascript
JS JSOP跨域请求实例详解
Jul 04 Javascript
Angular 2父子组件之间共享服务通信的实现
Jul 04 Javascript
javascript 缓冲运动框架的实现
Sep 29 Javascript
layui清空,重置表单数据的实例
Sep 12 Javascript
详解element-ui 表单校验 Rules 配置 常用黑科技
Jul 11 Javascript
在vue中实现echarts随窗体变化
Jul 27 Javascript
在vue中使用Base64转码的案例
Aug 07 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/11/19 PHP
PHP常用开发函数解析之数组篇[未完结]
2012/07/30 PHP
PHP json格式和js json格式 js跨域调用实现代码
2012/09/08 PHP
PHP去掉从word直接粘贴过来的没有用格式的函数
2012/10/29 PHP
解析PHP中常见的mongodb查询操作
2013/06/20 PHP
php类的扩展和继承用法实例
2015/06/20 PHP
YII动态模型(动态表名)支持分析
2016/03/29 PHP
PHP更安全的密码加密机制Bcrypt详解
2017/06/18 PHP
用JQuery调用Session的实现代码
2010/10/29 Javascript
javascript 随机展示头像实现代码
2011/12/06 Javascript
用jQuery模拟select下拉框的简单示例代码
2014/01/26 Javascript
jQuery图片轮播插件——前端开发必看
2016/05/31 Javascript
关于input全选反选恶心的异常情况
2016/07/24 Javascript
基于JS快速实现导航下拉菜单动画效果附源码下载
2016/10/27 Javascript
JS碰撞运动实现方法详解
2016/12/15 Javascript
jQuery实现6位数字密码输入框
2016/12/29 Javascript
JavaScript拖动层Div代码
2017/03/01 Javascript
vue router下的html5 history在iis服务器上的设置方法
2017/10/18 Javascript
node简单实现一个更改头像功能的示例
2017/12/29 Javascript
详解如何在vue+element-ui的项目中封装dialog组件
2020/12/11 Vue.js
[01:14]2019完美世界城市挑战赛(秋季赛)全国总决赛精彩花絮
2020/01/08 DOTA
[40:53]完美世界DOTA2联赛PWL S3 Magma vs DLG 第二场 12.18
2020/12/20 DOTA
Python函数装饰器实现方法详解
2018/12/22 Python
Python编程在flask中模拟进行Restful的CRUD操作
2018/12/28 Python
Python离线安装PIL 模块的方法
2019/01/08 Python
Java Spring项目国际化(i18n)详细方法与实例
2020/03/20 Python
Html5 video标签视频的最佳实践
2020/02/26 HTML / CSS
Booking.com亚太地区:Booking.com APAC
2020/02/07 全球购物
监理员的岗位职责
2013/11/13 职场文书
自荐信格式技巧有哪些呢
2013/11/19 职场文书
幼儿园大班毕业感言
2014/02/06 职场文书
公司环境卫生管理制度
2015/08/05 职场文书
生产设备维护保养制度
2015/08/06 职场文书
班主任远程培训研修日志
2015/11/13 职场文书
血轮眼轮回眼特效 html+css
2021/03/31 HTML / CSS
MySQL数据库如何使用Shell进行连接
2022/04/12 MySQL