三目运算符

三目运算符,又称条件运算符,是计算机语言的重要组成部分。它是唯一有3个操作数的运算符,所以有时又称为三元运算符。一般来说,三目运算符的结合性是右结合的。

定义

对于条件表达式b ? x : y,先计算条件b,然后进行判断。如果b的值为true,计算x的值,运算结果为x的值;否则,计算y的值,运算结果为y的值。一个条件表达式绝不会既计算x,又计算y。条件运算符是右结合的,也就是说,从右向左分组计算。例如,a ? b : c ? d : e将按a ? b : (c ? d : e)执行。 [1] 
<表达式1> ? <表达式2> : <表达式3>; "?"运算符的含义是:先求表达式1的值,如果为真,则执行表达式2,并返回表达式2的结果;如果表达式1的值为假,则执行表达式3,并返回表达式3的结果。
可以理解为条件 ? 结果1 : 结果2 里面的?号是格式要求。也可以理解为条件是否成立,条件成立为结果1,否则为结果2。

(来自百度百科

          诚然,看定义这些是晦涩难懂的,不如我们自己写几个例子进行深入学习,先写一个判断两数的大小关系到的三目运算,代码如下:
 <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div>输入两个数,比较大小</div>
数一:<input id="num1" type="number" />
数二:<input id="num2" type="number" />
<button type="button" onclick="getNum()">执行比对</button>
<script>
function getNum(){
a = document.getElementById("num1").value
b = document.getElementById("num2").value
var num = a > b ? document.write('a大于b') : document.write('a小于b');
}
</script>
</body>
</html>

这是比对数大小到例子,我们再举一个例子:

写一个携带货物问题,若是携带的货物超过10kg,则显示超重,若小于10kg显示正常

 <div>计算是否超重</div>
重量:<input id="num" type="number" />
<button type="button" onclick="getNum()">执行</button>
<script>
function getNum(){
a = document.getElementById("num").value
var num = a > 10 ? document.write('超重') : document.write('正常');
}
</script>

再写一个例子,输入两次密码,若相同则输出密码设定成功,若不相同就输出两次输入密码不一致

 <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div>设定密码</div>
输入密码<input id="text1" type="text" /> <br />
再次输入密码<input id="text2" type="text" />
<button type="button" onclick="textCon()">确定</button>
<script>
function textCon(){
var tex1 = document.getElementById("text1").value
var tex2 = document.getElementById("text2").value
var num = tex1 == tex2 ? document.write('密码设定成功') : document.write('两次输入密码不一致,请重新输入!');
}
</script>
</body>
</html>

总结:三目运算符是非常实用的一种运算方式,简短有力

  

javaScript 三目运算符初探的更多相关文章

  1. javascript 函数初探 (四)--- 回调函数

    回调函数 既然函数与任何被赋值给变量的数据是相同的,那么她当然可以像其他数据那样被定义.删除.拷贝,以及当成参数传递给其它函数. 我们定义一个函数,这个函数有两个函数类型的参数,然后他会分别执行这两个 ...

  2. javascript 函数初探 (二)--- 那些年的预定义函数

    javascript的预定义函数: javascript引擎中有一组可以随时调用的内建函数. 这些内建函数包括: 1. parseInt() 2. parseFloat() 3. isNaN() 4. ...

  3. javascript 函数初探 (一)--- 神马是函数

    神马是函数? 所谓函数,本质上是一种代码的分组形式.我们可以通过这种形式赋予某组代码一个名字,以便与之后的调用.下面,我们来示范以下函数的声明: function sum(a, b){ var c = ...

  4. javascript --- 原型初探七日谈(一)

    在javascript中,像原型,闭包这样的概念,只要我们能领悟其中的原理,一切都会显得格外清晰与明了. 原型属性(prototype): 下面我们简单定义一个函数 function her(a, b ...

  5. javascript --- 继承初探七日谈 (一)

    原型链是javascript实现继承的默认方式.下面来一个例子看一下她的魔法吧: 首先定义三个构造函数: function her(){ this.name = 'Anna'; this.toStri ...

  6. ArcGIS API for JavaScript开发初探——基本地图组件使用

    1.前言 在上一篇我们已经我们已经讲述了第一个地图应用程序的HelloMap的创建过程,这一篇我们来讲述基本地图组件:Home Button.比例尺.鹰眼图的使用方法. 2.基本地图组件 在ArcGI ...

  7. ArcGIS API for JavaScript开发初探——HelloMap

    1.前言 在开始ArcGIS API for JavaScript开发之前我们需要了解一些基本的知识: 1.开发工具选什么? 前端技术的开发工具选择是一个仁者见仁智者见智的问题,有人喜欢Hbuilde ...

  8. ArcGIS API for JavaScript开发初探——基础知识

    1.前言 在ArcGIS Web API开发体系中一共有四大类,分别为: ArcGIS API for Flex ArcGIS API for JavaScript ArcGIS API for RE ...

  9. javascript --- 原型初探七日谈(二)

    扩展内建对象: 在javascript中,内建对象的构造函数都是可以通过其原型来进行扩展的.这意味着我们可以做一些事情,例如我们要往数组原型中添加一个新方法,就可以在其所有的数组中使用,下面我们来试试 ...

随机推荐

  1. MD5 加密原理(转)

    MD5的全称是Message-Digest Algorithm 5(信息-摘要算法),在90年代初由MIT Laboratory for Computer Science和RSA Data Secur ...

  2. How to customize Skin Gallery - Remove / rename skins and groups

    1. REMOVE (HIDE) A SPECIFIC SKIN Traverse through the gallery group collection, then through its gal ...

  3. 即将到来的Autodesk 主要产品2015版 产品和API新功能在线培训(免费)

    一年一度的Autodesk主要产品和API在线培训课程在5月份即将開始.我们呈献给大家5个课程. 1. Revit 2015 产品新功能及API 概览 2. Vault 2015产品新功能及API 概 ...

  4. node06---npm、silly-datetime、路径问题

    我们刚才学习了,模块就是一些功能的封装,所以一些成熟的.经常使用的功能,都有人封装成为了模块.并且放到了社区中,供人免费下载. 这个伟大的社区,叫做npm. 也是一个工具名字 node package ...

  5. poj_2187凸包,暴力解法

    #include<iostream> #include<cstdio> #include<cstring> #include<algorithm> #i ...

  6. cpc,tank

    先保存一段错误的代码 #include<iostream> #include<cstdio> #include<cstring> #include<algor ...

  7. [POJ2728] Desert King 解题报告(最优比率生成树)

    题目描述: David the Great has just become the king of a desert country. To win the respect of his people ...

  8. 【转】Android ClearEditText:输入用户名、密码错误时整体删除及输入为空时候晃动提示

    1 package com.lixu.clearedittext; 2 3 4 import android.app.Activity; 5 import android.os.Bundle; 6 i ...

  9. 关于iOS适配问题

    大家都知道在iOS开发当中对于UI适配问题可以从如下两个方面去考虑: 1.比例适配 2.利用autolayout自动布局 通常情况来说,利用auto自动布局是一个比较好的方案,开发者可以利用story ...

  10. VMware Workstation pro14 虚拟机下安装CentOS6.8图文教程

    转载收藏于 https://www.cnblogs.com/jepson6669/p/8371823.html 1 启动VMware的画面 2.点击 创建新的虚拟机 3 选择 典型(推荐) 4 选择 ...