您如何使用?:(条件)运算符在JavaScript中?

有人可以简单地向我解释什么是?:(有条件的“三元”)运算符,以及如何使用它?

梅JinJin十三2020/03/16 15:14:45

条件(三元)运算符是唯一采用三个操作数的JavaScript运算符。该运算符通常用作if语句的快捷方式。

condition ? expr1 : expr2 

如果条件为true,则运算符返回expr1的值;否则,返回0。否则,返回expr2的值。

function fact(n) {
  if (n > 1) {
    return n * fact(n-1);
  } else {
    return 1;
  }
  // we can replace the above code in a single line of code as below
  //return (n != 1) ? n * fact(n - 1) : 1;
}
console.log(fact(5));

有关更多说明,请阅读MDN文档链接

AItachi2020/03/16 15:14:45

三元表达式在JS中非常有用,尤其是React。这是对所提供的许多优质详细信息的简化答案。

condition ? expressionIfTrue : expressionIfFalse

想想expressionIfTrue作为OG if语句呈现真实的;
认为是expressionIfFalseelse陈述。

例:

var x = 1;
(x == 1) ? y=x : y=z;

这将检查x的值,如果为true,则返回第一个y =(value),如果为false,则返回第二个冒号:返回y =(value)。

LEY宝儿神奇2020/03/16 15:14:45

我们可以使用Jquery以及length,如下例所示:

假设我们有一个具有值的GuarantorName文本框,并且想要获取名字和姓氏-它可能为null。所以比

        var gnamesplit = $("#txtGuarantorName").val().split(" ");
        var gLastName = "";
        var gFirstName = "";
        if(gnamesplit.length > 0 ){
           gLastName  = gnamesplit[0];        
        }
        if(gnamesplit.length > 1 ){
           gFirstName = gnamesplit[1];        
        }

我们可以将以下代码与带有最少代码的Jquery一起使用

    

    var gnamesplit = $("#txtGuarantorName").val().split(" ");
    var gLastName = gnamesplit.length > 0  ? gnamesplit[0] : "";
    var gFirstName =  gnamesplit.length > 1  ? gnamesplit[1] : "";
    $("#txtLastName").val(gLastName);
    $("#txtFirstName").val(gFirstName);
    
    
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div >
  Guarantor Name: <input type="text" id="txtGuarantorName" value="ASP.NET Core"  /><br/>
  <br/>
  <br/>
  
  First Name: <input type="text" id="txtLastName" value="ASP.NET Core"  />
  Last Name: <input type="text" id="txtFirstName" value="ASP.NET Core"  />
</div>

Mandy凯2020/03/16 15:14:45
x = 9
y = 8

一元

++x
--x

二元

z = x + y

三元

2>3 ? true : false;
2<3 ? true : false;
2<3 ? "2 is lesser than 3" : "2 is greater than 3";
猴子神无2020/03/16 15:14:45

这是if statement一条线上全部。

所以

var x=1;
(x == 1) ? y="true" : y="false";
alert(y);

要评估的表达式在 ( )

如果匹配,则在 ?

如果匹配为false,请在 :

古一飞云2020/03/16 15:14:45

它称为三元运算符

tmp = (foo==1 ? true : false);
前端村村2020/03/16 15:14:45

嗨,伙伴们还记得js通过评估true或false起作用,对吗?

让我们来一个三元运算符:

questionAnswered ? "Awesome!" : "damn" ;

首先,js检查questionAnswered是true还是false

如果 true?),您将获得“超赞!”

否则(:),您将获得“该死”;

希望这对朋友有帮助:)

小卤蛋卡卡西2020/03/16 15:14:45

大多数答案都是正确的,但我想补充一点。三元运算符是右结合的,这意味着它可以被链接以下列方式if … else-if … else-if … else

function example() {
    return condition1 ? value1
         : condition2 ? value2
         : condition3 ? value3
         : value4;
}

相当于:

function example() {
    if (condition1) { return value1; }
    else if (condition2) { return value2; }
    else if (condition3) { return value3; }
    else { return value4; }
}

更多细节在这里

小卤蛋小宇宙2020/03/16 15:14:45

三元运算符

通常,我们在Javascript中有条件语句。

例:

if (true) {
    console.log(1)
} 
else {
    console.log(0)
}
# Answer
# 1

但它包含两行或更多行,因此无法分配给变量。Javascript为该问题三元运算符提供了解决方案三元运算符可以写在一行中并分配给一个变量。

例:

var operator = true ? 1 : 0
console.log(operator)
# Answer
# 1

此三元运算符在C编程语言中类似。

伽罗Harry2020/03/16 15:14:45

当您所有的都是符号时,用Google搜索会有点困难;)要使用的术语是“ javascript条件运算符”。

如果您在Javascript中看到更多有趣的符号,则应尝试首先查找Javascript的运算符:MDC的运算符列表您可能会遇到的一个例外是$符号

为了回答您的问题,条件运算符替换了简单的if语句。最好的例子是:

var insurancePremium = age > 21 ? 100 : 200;

代替:

var insurancePremium;

if (age > 21) {
    insurancePremium = 100;
} else {
    insurancePremium = 200;
}
西门樱前端2020/03/16 15:14:45
z = (x == y ? 1 : 2);

相当于

if (x == y)
    z = 1;
else
    z = 2;

当然,它更短。

西里MandyEva2020/03/16 15:14:45

它称为“三元”或“条件”运算符。

?:运算符可用作if ... else语句的快捷方式。它通常用作if ... else语句比较笨拙的较大表达式的一部分。例如:

var now = new Date();
var greeting = "Good" + ((now.getHours() > 17) ? " evening." : " day.");

该示例创建一个包含“晚安”的字符串。如果是下午6点之后。使用if ... else语句的等效代码如下所示:

var now = new Date();
var greeting = "Good";
if (now.getHours() > 17)
   greeting += " evening.";
else
   greeting += " day.";

来自MSDN JS文档

基本上,这是一个简写的条件语句。

另请参阅: