使用||优化js冗杂的三目运算

最新推荐文章于 2023-06-05 17:24:07 发布
最新推荐文章于 2023-06-05 17:24:07 发布
阅读量721 收藏
点赞数
分类专栏： 前端 文章标签： javascript 前端 开发语言
版权声明：本文为博主原创文章，遵循 CC 4.0 BY 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/t_t2_3/article/details/121773509
版权

通常来说在dom中使用三目运算的频率很高，但是很多小伙伴可能不知道如下写法

但是有的时候我们并不需要if else中的else所以可以用||来优化一下写法

经典三目

{{this.count?this.count:'0'}}

替代

{{this.count||'0'}}
商朝
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
三目运算的多目运算技巧（三种及三种以上的状态怎么使用）
qq_38215042的博客
06-19 2900
1：使用场景，当有人一提到三目运算就会想着用0，1代表男女等的显示问题，只有两种状态值。但你有没有想过当状态不止两种的时候，比如三种及以上的时候，也可以使用三木运算呢？答案是可以。 比如常用的vue数据渲染的时候 <div class="BottomRight"> {{val.deviceState==0?"未知":val.deviceState==1?"注册":val.deviceState==2?"注销":""}} </div> ...
js中三目运算符优化
Billow_lamb的博客
01-10 507
js中三目运算符优化 let typeofa = 2 let result = typeofa === 1 ? '值1' : typeofa=== 2 ? '值2' :'值3' console.log(result) // 值2 //优化 let map = { 1:"值1",2:"值2",3:"值3" }[typeofa] console.log(map) // 值2
js采用三目运算嵌套层数过多怎么优化
weixin_39818813的博客
03-17 578
当三目运算套了多层以后，可读性就没这么清晰了，这个时候采用对象的。css采用三木运算嵌套层数过多，优化方案。
js三元运算符_这些优化技巧可以避免我们在 JS 中过多的使用 IF 语句
weixin_39638304的博客
12-03 731
最近在重构代码时，我发现早期的代码使用太多的 if 语句，其程度是我从未见过的。这就是为什么我认为分享这些简单的技巧是非常重要的，这些技巧可以帮助我们避免过多的使用 if 语句。接下来会介绍6种方式来代替 if 的使用，这样做不是坚决不使用 if 偏执狂，而是换个方式思考我们的编码思路。1. 三元运算符事例1带有IF的代码：重构后代码：使用 ES6事例2带有IF的代码：重构后代码：事例3带有IF的...
js 时间加减_如何让你的 JS 写得更漂亮
weixin_39792803的博客
11-27 197
1. 按强类型风格写代码JS是弱类型的，但是写代码的时候不能太随意，写得太随意也体现了编码风格不好。下面分点说明： （1）定义变量的时候要指明类型，告诉JS解释器这个变量是什么数据类型的，而不要让解释器去猜，例如不好的写法：var num, str, obj;声明了三个变量，但其实没什么用，因为解释器不知道它们是什么类型的，好的写法应该是这样的：var num = 0, str ...
Java Script中的===如何使用，和==的区别是什么？
Rockandrollman的博客
09-18 815
java中没有“===”号的比较，bai只有javascript中才有。 javascript中： 先说 ===，这个比较简zhi单。下面的规则用来判断两个值是否===相等：dao 1、如果类型不同，就[不相等] 2、如果两个都是数值，并且是同一个值，那么[相等]；(！例外)的是，如果其中至少一个是NaN，那么[不相等]。（判断一个值是否是NaN，只能用isNaN()来判断） 3、如果两个都是字符串，每个位置的字符都一样，那么[相等]；否则[不相等]。 4、如果两个值都是true，或者都是false，那么
JS三目运算(三元运算)方法详解
12-07
1、什么是三目运算：(布尔表达式 ? 值0:值1;) 5>3?alert(‘5大’):alert(‘3大’); 即 if(5>3){alert(‘5大’)}else{alert(‘3大’)}; 注意：三目运算和if(){}else{}的 区别是三目...
Java三目运算中隐藏的自动拆装箱
08-26
Java三目运算中隐藏的自动拆装箱 Java三目运算符是一种常用的编程结构，但是在使用时需要注意一些隐藏的自动拆装箱问题。本文将详细介绍Java三目运算中隐藏的自动拆装箱，并通过实例代码来讲解这个问题。 在Java中...
浅谈Java三目运算
09-03
如果 `x` 的计算结果为 `true`，那么整个三目运算的结果是 `y` 的值；相反，如果 `x` 为 `false`，则结果是 `z` 的值。 例如，我们来看一个简单的示例： ```java String s = ""; String x = "默认值"; s = s....
JS switch判断 三目运算 while 及 属性操作代码
10-19
主要介绍了JS switch判断 三目运算 while 及 属性操作代码,需要的朋友可以参考下
C语言三目运算符之坑
qq_25468687的博客
03-12 1107
代码片段： #include <stdio.h> int main() { int a = -22; unsigned int b = 0; unsigned int c = 4294967274; ssize_t t = (a == 0 ? b : a); ssize_t tc = a; printf("t = %zd tc = %zd\n", t, tc); ...
原生JS--比Switch...Case更优雅的实现多条件判断以及三目运算的嵌套写法
kkk_xxx的博客
09-09 862
前几天看到坐在隔壁的前端大哥写的多条件判断写法，十几行代码靠几行轻松实现，看到不同写法的优劣，特地整体出来，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，谢谢大家！ 文章目录多条件判断写法三目运算的嵌套写法 多条件判断写法 这个判断意思是根据现在的体感来判断季节，寒冷的话是冬天，温暖的话是春天，炎热的话是夏天，凉爽的话是秋天 1. if … else if … else function weather(nowSEP){ let season = '' if(nowSEP=.
Java开发手册中为什么要求三目运算符必须要注意类型对齐
BADAO_LIUMANG_QIZHI的博客
06-05 387
那如果，三目运算符的第二位和第三位的操作数的类型分别是基本数据类型和包装类型对象时，就需要有一方需要进行自动拆装箱。根据规定，三目运算符的第二、第三位操作数的返回值类型应该是一样的，这样才能当把一个三目运算符的结果赋值给一个变量。根据三目运算符的语法规范,当第二，第三位操作数分别为基本类型和对象时，其中的对象就会拆箱为基本类型进行操作。2） 表达式 1 或表达式 2 的值的类型不一致，会强制拆箱升级成表示范围更大的那个类型。计算 x 的值，运算结果为 x 的值；否则，计算 y 的值，运算结果为 y 的值。
JavaScript运算符的优化
Alecor的博客
02-21 453
在工作中的遇到了很多JS运算符上的问题，借此机会查阅了相关资料，重新巩固了一下基础知识。因此在这里记下今天的收获；言归正传，在日常前端开发中（本人主要是从事JavaWeb方向的），遇到了很多判断语句，但是这些语句写起来很冗长，所以想用另一种方式替代；例1：if else 和三元表达式的替换if ...else ... 表达式：if (expr1){ (expr2) }else{ (e
33, for
xinxintai的专栏
10-18 147
for有两种形式。 1，传统的shell格式。 for variable [in words]; do // 此处[ ] 表示可选的意思。 commands done 例如：for i in A B C D; do echo $i; done for i in {A..D}; do echo $i; done for i in distros*.txt; do ech...
Shader优化-条件判断和三目运算
gease6的博客
08-15 2800
为什么需要优化： 在CPU编程中，对条件语句的路基进行了优化，只会执行其中一个分支。 但是这种优化对于GPU编程来说是无效的。在fragment Shader上，每条指令需要操作上百个像素，如果有些像素采取一个分支，而另外一些采取另一个分支，这时fragment Shader的处理方式是：所有片段都会执行所有的分支，但是只会将片段采取的分支写入到寄存器中。 因此在GPU编程中，if else, switch case等条件语句和太复杂的逻辑是不推荐的。 怎么优化： 使用step()、ceil()、clamp
使用三目运算进行多个条件判断
明知迷途，从未折返
04-08 9610
方式一 function test(n){ return n==1? 1:(n==100? 100:( n==200? 200:'?')) } console.log(test(1)) //1 console.log(test(100)) //100 console.log(test(200)) //200 console.log(test(20)) //? 方式二 funct...
三目运算 多条判断
lzfengquan的博客
11-09 1237
含义 三目运算符格式： （关系表达式）？表达式1:表达式2: 当关系表达式的值是true的时候，执行表达式1 当关系表达式值是false的时候，执行表达式2 关系表达式的值要么是true，要么是false 实例 1 两种情况的：假设获取的列表list的state状态有0 和1,显示对应的值 list.status==0 ?"等待付款":"已付款" 2 有三种情况的 list.status==0 ?"等待付款":(list.status =="1"?"已支付":"已取消") 3 假设我们设置操作的按钮
三目运算符判断多个条件的使用方法
chihcixxxx的博客
06-08 2001
写项目的时候数据状态有三种，给三种不同的样式，然后发现可以简单地使用三目运算符，就可以实现多个条件的判断 也就是这个用法
react使用三目运算
最新发布
06-22
在React中，三目运算（也称为条件运算符）是一个简洁的方法，用于根据条件决定是否渲染某个组件或者表达式的值。它通常用于简化if...else语句，尤其是在简单的条件判断中。这里是一个基本的使用例子： ```jsx // 假设你有一个状态变量叫做isLoaded，用来表示数据是否加载完成 const isDataLoaded = this.state.isDataLoaded; // 在返回的 JSX 中，你可以这样使用三目运算： { isDataLoaded ? ( <div>Data is loaded, display it here...</div> ) : ( <div>Loading...</div> )} ``` 在这个例子中，如果`isDataLoaded`为真，就会渲染第一个`<div>`，显示已加载的数据；如果为假（即数据未加载），则渲染第二个`<div>`，显示加载中的消息。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

商朝

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值