深度了解 JavaScript 中 三目运算符

深度了解 JavaScript 中 三目运算符深度了解JavaSCript中三目运算符初次写文章留作纪念三目运算符的写法及体征通过一个简单的案例,让你更深层的了解判断类型的三目运算符的应用分为单条件和多条件两种类型。单条件语法多条件语法布尔表达式?表达式true执行:表达式false执行布尔表达式1?表达式1true执行:(布尔表达式2?表达式2的true执行:两个表达…

大家好,又见面了,我是你们的朋友全栈君。

深度了解 JavaScript 中 三目运算符

初次写文章留作纪念 ?

三目运算符 的写法 及体征

通过一个简单的案例,让你更深层的了解判断类型的三目运算符的应用 分为 单条件 和 多条件 两种类型

单条件语法 多条件语法
布尔表达式 ? 表达式true执行 : 表达式false执行 布尔表达式1 ? 表达式1true执行 : (布尔表达式2 ? 表达式2的true执行 : 两个表达式都不成立执行语句)
条件 ? 成立结果 : 不成立结果 条件1 ? 成立结果1 : ( 条件2 ? 成立结果2 : 都不成立时的结果 )
var data = a<b ? a : b; var str = a<b ? “true1” : (a<c ? “true2” : (a<d ? “true3”:“false123”));
解释:如果a小于b,a赋值给data,否则b赋值给data 解释:如果a小于b(条件1) ,就将”true1″赋值给str 、 再如果a小于c(条件2),就将”true2″赋值给str 、 再如果a小于d(条件3),就将”true3″赋值给str 、否则将“false123”赋值给str

可以理解为条件 ? 结果1 : 结果2

符号 理解
是格式要求。也可以理解为条件是否成立, 问号? 后面写条件成立时的结果
: 是当条件不成立时执行的结果

单条件

// 语法  布尔表达式 ? 表达式true执行 : 表达式false执行

例如:


		var a = 4,b = 2;
		var max = a<b?a:b;//三目运算符: 布尔表达式 ? true时执行 : false时执行
		console.log(max);//2

		//与if(){}else{}相似
		//换种写法 ↓
		if( a<b ){ 
    
			max = a;
		}else { 
   
			max = b;
		}
		

多条件



		/* <表达式1> ? <表达式2> : <表达式3>; "?"运算符的含义是:先求表达式1的值,如果为真,则执行表达式2,并返回表达式2的结果; 如果表达式1的值为假,则执行表达式3,并返回表达式3的结果。 */
		

// 语法  布尔表达式1 ? 表达式1true执行 : (布尔表达式2 ? 表达式2的true执行 : 两个表达式都不成立执行语句)

例如:


		var c = 3;
		console.log( c==2?"这是2":(c==1?"这是1":(c==3?"这是3":"这个数不是1、2、3")) );//"这是3"
		
		//使用 ***括号*** 是方便查看代码,方便阅读及程序执行
		//换种写法 ↓
		//与if(){}else if(){}else{}相似
		var str = "";
		if( c==2 ){ 
   
			str = "这是2";
		}else if( c==1 ){ 
   
			str = "这是1";
		}else if( c==3 ){ 
   
			str = "这是3";
		}else{ 
   
			str = "这个数不是1、2、3"
		}
		//惊奇之处: ***三目运算有返回值!**** 
		//而if语句 只会执行代码,没有返回值,除非自定义一个变量传入进去,进行赋值

         建议在书写多条件的三目运算时,使用括号进行分隔开每段代码,方便自己查看以及程序执行
 

三目运算符执行多个条件

需求:我正在使用三目,我需要在满足条件中我让让它执行多个语句

三元运算符的结果语句可以执行多个操作,每个操作用逗号分隔就可以,例子如下:

	var a=1;
	使用括号用逗号分隔开多个语句       ↓
	a>5?(alert(1),alert(2)):(alert(3),alert(4))

总结 :

         与    if   语句对比较,发现三目运算符的操作更便捷,并且   if   语句执行后发现没有返回值,应用场景不一样,而使用三目运算符恰恰又弥补了这个缺陷。
           
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/148943.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 框架结构和砖混结构的区别_react框架官网

    框架结构和砖混结构的区别_react框架官网实现:创建四个组件,分别是头组件,尾组件,list组件,item组件,存在于这个mvc中的。在APP.js中分别引入前三个个组件(item组件是存在于list中的,所以在list中引入item组件)在app.js中写好初始数据,在list中显示出来const{todos}=this.propsreturn(<ul>{todos.map(todo=>{return<Itemkey={

    2025年10月31日
    2
  • 吐血整理 python最全习题100道(含答案)持续更新题目,建议收藏!

    吐血整理 python最全习题100道(含答案)持续更新题目,建议收藏!

    2021年7月14日
    373
  • 电子元器件品牌及其代理商

    电子元器件品牌及其代理商海思(Hisilicon)在大中华区的授权分销商有:深圳市群方电子、深圳市淇诺实业、晓龙国际、威健实业、中国电子器材、深圳市智宇鹏电子等。 紫光在大中华区的授权分销商包括:Arrow,中豪,力同科技,泰发科电子,普浩国际,Mornsun,国华,厦门建益达,昱博科技,CEACSZ,WPG等。 全志科技在大中华区的授权分销商有:君行科技,蓝欣电子,易新泰科技,方糖电子等。 兆易创新(Giga…

    2022年6月29日
    86
  • 国密算法「建议收藏」

    国密算法「建议收藏」算法分类国密即国家密码局认定的国产密码算法。主要有SM1,SM2,SM3,SM4。密钥长度和分组长度均为128位。SM1为对称加密。其加密强度与AES相当。该算法不公开,调用该算法时,需要通过加

    2022年8月1日
    20
  • python表情代码_Python实现表情包的代码实例[通俗易懂]

    python表情代码_Python实现表情包的代码实例[通俗易懂]本文主要介绍了使用Python进行简单图像处理的方法以及Python自动生产表情包的实例,具有很好的参考价值,下面跟着小编一起来看下吧作为一个数据分析师,应该信奉一句话——“一图胜千言”。不过这里要说的并不是数据可视化,而是一款全民向的产品形态——表情包!!!!表情包不仅仅是一种符号,更是一种文化——是促进社交乃至社会发展的动力之一,就像懒。我们坚持认为,一张优秀的表情包,应该是一幅艺术品,是那忽…

    2025年6月29日
    3
  • Pytest(6)重复运行用例pytest-repeat[通俗易懂]

    Pytest(6)重复运行用例pytest-repeat[通俗易懂]前言平常在做功能测试的时候,经常会遇到某个模块不稳定,偶然会出现一些bug,对于这种问题我们会针对此用例反复执行多次,最终复现出问题来。自动化运行用例时候,也会出现偶然的bug,可以针对单个用例,

    2022年7月28日
    7

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号