泛谈JS逻辑判断选择器 || &&

前言

|| 与 &&在JS里与其它语言不一样,这是选择器运算符,而非逻辑运算符。
对于||来说,若判断为true,则返回第一个值,为false返回第二个值。
&&相反,若判断为 true,则返回第二个,为 false为返回第一个值。
绝对不是像其它语言那样返回true或false,而是会返回第一个值或第二个值。

简单的测试代码

先是true与false的测试,后将false改为数值0. 除了|| 与&&之外易让人疑惑外,JS里的假值表也算是个大疑点。

let A = true;
let B = true;
testLogic(A,B);
A = true;
B = false;
testLogic(A,B);
A = false;
B = true;
testLogic(A,B);
A = false;
B = false;
testLogic(A,B);
/*假值表,以下值 可以被强制布尔转换为false,其它转换皆为true
undefined
null
false
+0,-0,NaN
"" 空字符串
其它皆为真值,如空对象{}
*/
console.log("-----------------next test ---------------");
A = true;
B = true;
testLogic(A,B);
A = true;
B = 0;
testLogic(A,B);
A = 0;
B = true;
testLogic(A,B);
A = 0;
B = 0;
testLogic(A,B);
function testLogic(A,B){
 if(A || B){
 console.log("A:",A,"B:",B,".A||B true:",A || B);
 }
 else
 {
 console.log("A:",A,"B:",B,".A||B flase:",A || B);
 }
 if(A && B){
 console.log("A:",A,"B:",B,".A&&B true:",A || B);
 }
 else
 {
 console.log("A:",A,"B:",B,".A&&B flase:",A && B);
 }
}

我写代码时我其实就只知道如何做到if 与逻辑判断实现其它语言一样的正常的效果:

结论是保证A与B的是true或false而不是其它值。

正常语言是这样的:

A B A||B A&&B
T T T T
T F T F
F T T F
F F F F

JS语言是这样的:返回的是A或B,只要保证A与B的是true或false而不是其它值,那么在使用上与正常语言逻辑一样。

A B A||B A&&B
T T A(T) B(T)
T F A(T) B(F)
F T B(T) A(F)
F F B(F) A(F)

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

(0)

相关推荐

  • javascript获取元素的计算样式

    背景 使用css控制页面有4种方式,分别为行内样式(内联样式).内嵌式.链接式.导入式. 行内样式(内联样式)即写在html标签中的style属性中,如 <div style="width:100px;height:100px;"></div> 内嵌样式即写在style标签中,例如<style type="text/css">div{width:100px; height:100px}</style> 链接式即为用li

  • 如何用原生js写一个弹窗消息提醒插件

    1.分析 当消息被触发的时候,会有一个自上而下的淡入过程. 在持续了一段时间后会自动的消失,或者是需要用户来手动的点击关闭按钮. 在消息消失的时候,会有一个自下而上的淡出过程. 消息是可以叠加弹出的,最新的消息会排在消息列表的最后面. 当前面的消息消失后,后面的消息会有一个向上滑动效果. 然后消息本身是有三部分组成 消息图标,用来区分不同类型的消息. 消息文本. 关闭按钮,并不是所有消息都需要关闭按钮. 2. 实现样式 那么,不管我们是用原生js还是vue,首先呢,我们都需要把这个消息的基本样式

  • Javascript通过控制类名更改样式

    控制类名(className 属性) className 属性设置或返回元素的class 属性. 语法: object.className = classname 作用: 1.获取元素的class 属性 2. 为网页内的某个元素指定一个css样式来更改该元素的外观 <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; char

  • 了解JavaScript中的选择器

    在html5之前只有下面四种选择器 .getElementById("id")id选择器; .getElementsByName("name")name选择器; .getElementsByTagName("tagname")tag标签名选择器: .getElementsByClassName(".classname").class名选择器 示例代码: <!DOCTYPE html><html><

  • 泛谈JS逻辑判断选择器 || &&

    前言 || 与 &&在JS里与其它语言不一样,这是选择器运算符,而非逻辑运算符. 对于||来说,若判断为true,则返回第一个值,为false返回第二个值. &&相反,若判断为 true,则返回第二个,为 false为返回第一个值. 绝对不是像其它语言那样返回true或false,而是会返回第一个值或第二个值. 简单的测试代码 先是true与false的测试,后将false改为数值0. 除了|| 与&&之外易让人疑惑外,JS里的假值表也算是个大疑点. let

  • JS时间选择器 兼容IE6,7,8,9

    在线演示: http://demo.jb51.net/js/2012/js_date/ 复制代码 代码如下: <html> <head> <title>Js日期选择器并自动加入到输入框中</title> <meta http-equiv="content-Type" content="text/html;charset=gb2312"> <script type="text/javascri

  • Js日期选择器并自动加入到输入框中示例代码

    复制代码 代码如下: <html> <head> <title>Js日期选择器并自动加入到输入框中</title> <meta http-equiv="content-Type" content="text/html;charset=gb2312"> <script type="text/javascript"> var gMonths=new Array("一月&

  • JS 逻辑判断不要只知道用 if-else 和 switch条件判断(小技巧)

    我们在编写 JS 代码时,经常会遇到逻辑判断复杂的情况.一般情况下,可以用 if/else 或 switch 来实现多个条件判断,但会出现一个问题:随着逻辑复杂度的增加,代码中的 if/else 和 switch 会越来越臃肿.本文将带你尝试写出更优雅的判断逻辑. 比如说下面这样一段代码: const onButtonClick = (status) => { if (status == 1) { sendLog('processing') jumpTo('IndexPage') } else

  • js颜色选择器代码[firefox不支持]

    最简单的,在body区域加入: 复制代码 代码如下: <OBJECT id="dlgHelper" CLASSID="clsid:3050f819-98b5-11cf-bb82-00aa00bdce0b" width="0" height="0"></OBJECT> 调用的JS: 复制代码 代码如下: <script type="text/javascript"> var

  • js 颜色选择器(兼容firefox)

    复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv=&qu

  • js实现可得到不同颜色值的颜色选择器实例

    本文实例讲述了js实现可得到不同颜色值的颜色选择器.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <html> <head> <title>js颜色选择器,可得到不同的颜色值</title> </head> <body> <input id=kkk1 style=position:absolute;left:0;top:0> <input id=kkk2 style=position:absolut

  • JavaScript 日期时间选择器一些小结

    flatpickr 是一个轻量级.注重精益.由 UX 驱动和可扩展的 JavaScript 日期时间选择器. 下载 演示 GitHub flatpickr 不依赖于任何库.更小的用户界面,但有很多主题.丰富的 API 和事件系统使其适用于任何环境.可用于 webpack ,也可作为 jQuery 插件使用. 安装 安装 flatpickr 模块 使用 NPM 安装 flatpickr 模块.包管理工具: https://www.npmjs.com/package/bower-npm-resolv

  • jquery性能优化高级技巧

    有时候我们在书写jquery的时候,为了书写代码方便,往往忽略了程序执行过程中,给客户端带来的压力.随之而来的就是在某些低端浏览器或者低端电脑上运行速度缓慢,甚至无法运行等问题. 因此我们有必要对我们自己书写的jquery代码进行优化,以达到更快捷.更流畅的运行效果. jquery性能优化高级技巧,下面主要从七个方面对jquery性能优化做介绍: 1.通过CDN(Content Delivery Network)引入jQuery库 2.减少DOM操作 3.适当使用原生JS 4.选择器优化 5.缓

  • 35个最好用的Vue开源库(史上最全)

    本文介绍了35个Vue开源库,分享给大家,具体如下: 无论是开发新手还是经验丰富的老手,我们都喜欢开源软件包.对于开发者来说,如果没有这些开源软件包,很难想象我们的生活会变得多么疲惫不堪,而且靠咖啡度日也会成为家常便饭.所幸的是,随着 Vue.js 社区的不断壮大,每天都会出现一些很好的软件包. 在下文中,我们将推荐一些非常好用的 Vue 开源库 Vue.js .Vue.js 是一个非常易用的渐进式 JavaScript 框架,用于构建用户界面. 1.Vue Dark Mode Vue.js 的

随机推荐