关于js代码中与或运算符||&&的妙用

  看bootstrap时看到如下一行JavaScript代码产生了疑惑。

 return window.pageYOffset || e.scrollTop

||在这里的作用是什么呢?

首先明确概念,在js逻辑运算中,0、""、null、false、undefined、NaN都会判为false,其他都为true。

a&& b :如果执行a后返回true,则执行b并返回b的值;如果执行a后返回false,则整个表达式返回a的值,b不执行;

a || b :如果执行a后返回true,则整个表达式返回a的值,b不执行;如果执行a后返回false,则执行b并返回b的值;

&& 优先级高于 ||;

其次在几乎所有语言中都遵循”短路原理“,&&前面为false就不判断第二个表达式,||前面为true也不判断后面。

所以这行代码就是返回滚动条的位置,如果pageYOffset得不到结果就执行scrollTop。

同样,

var attr = attr || “”;

这个运算经常用来判断一个变量是否已定义,如果没有定义就给他一个初始值

另外!!的作用是把一个其他类型的变量转成的bool类型。

js中||和&&的特性帮我们精简了代码的同时,也带来了代码可读性的降低,所以利弊就需要自己的权衡了。

时间: 2024-10-17 07:00:02

关于js代码中与或运算符||&&的妙用的相关文章

js代码中的闭包

作为一个后台开发人员了解前端非常重要,尤其是深处学校实验室做项目时前端把写好的代码直接给你,然后你在修改的时候.我经常做的就是修改前端的代码的HTML和后台交互的部分以及js的ajax部分,之后修改之后也会遇到很多问题,所以只能自己继续修改前端,学习了前端的不少知识. js的闭包是一个很重要的概念,在编写js代码中经常会被用到的,也是js的特色以及难点. 知道闭包首先得知道js的变量和作用域. 在js中变量不向C/C++/Java中那样,得先定义在使用,js中可以直接使用变量,比如: 1 n=1

jQuery表单验证插件----通过name属性来关联字段来验证,改变默认的提示信息,将校验规则写到 js 代码中

一.下载依赖包 网盘下载:https://yunpan.cn/cryvgGGAQ3DSW  访问密码 f224 二. 添加一个另外一个插件jquery.validate.messages_cn.js. 改变默认提示方式. 三.jQuery表单验证插件----通过name属性来关联字段来验证,将校验规则写到 js 代码中. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.

js代码中碰到的函数

第一个--->字符串的截取substring()方法 substring(a,b)--->[a,b)区间截取字符.下标从0开始.从a下标开始,截取到b下标的前一个字符.返回一个新的字符串 1 <script type="text/javascript" src="js/jquery-1.9.1.min.js"></script> 2 <script type="text/javascript"> 3

js代码中嵌套jsp页面传递的值引起的安全问题

在jsp相互间传值,我们经常用string str=request.getParameter("st");这种方式来获取值,然后再在js代码中引入 var str=<% str%> 这么写会有安全问题,用fortify软件就能测出问题.提示跨域安全问题,其实不跨域也可以解决这种问题,把变量放到request域中,用el表达式来获取 这么写: string str=request.getParameter("st");request.setAttribut

JS代码中加上alert才能正常显示效果

模拟一个生成验证码的效果,发现JS代码中加上alert可以正常刷新,没有alert时图片就会丢失,找到解决方法,但是还不是很明白,先记录下来. 生成验证码的servlet代码如下: package servlet; import java.awt.Color; import java.awt.Font; import java.awt.Graphics; import java.awt.Graphics2D; import java.awt.image.BufferedImage; import

js代码中包含vue标签

tree组件绘制节点代码报错,babel不认识js代码中的vue标签 renderContent(h, { node, data, store }) { return ( <span> <span> <span>{node.label}</span> </span> <span style="float: right; margin-right: 20px"> <el-button size="mi

&lt;frameset&gt;框架集中不同&lt;frame&gt;之间的调用【js代码中】

top:永远指分割窗口最高层次的浏览器窗口;parent:包含当前分割窗口的父窗口,本文将围绕js中top.parent.frame进行讲述及他们的应用案例 引用方法top: 该变量永远指分割窗口最高层次的浏览器窗口.如果计划从分割窗口的最高层次开始执行命令,就可以用top变量. parent: 该变量指的是包含当前分割窗口的父窗口.如果在一个窗口内有分割窗口,而在其中一个分割窗口中又包含着分割窗口,则第2层的分割窗口可以用parent变量引用包含它的父分割窗口. 附:Window对象.Pare

jsp页面和js代码中使用sessionScope获取session值

场景:有些实体对象可以放到HttpSession对象中,保正在一个会话期间可以随时获取这个对象的属性,例如可以将登录用户的信息写入session,以保证页面随时可以获取并显示这个用户的状态信息.下面以此为例. 本文转自:http://blog.csdn.net/baidu_30809315/article/details/77159549 1.后台将用户这一实体对象写入session(HttpSession),这里是从拦截器中写入,代码中的userInfo是从单点登录服务器获取的登录用户信息 [

编写高质量JS代码中

2.使用函数 函数给程序员提供了主要的抽象功能,又提供实现机制.函数可以独立实现其他语言中的多个不同的特性,例如,过程.方法.构造函数,甚至类或模块. 2.1 理解函数调用.方法调用以及构造函数调用之间的不同 针对面向对象编程,函数.方法和类的构造函数是三种不同的概念. 使用模式:1,函数调用 function hello(username){ return "hello" + username; } 2,方法调用 var obj = { hello : function(){ ret