JS中三目运算符和if else的区别分析与示例


Posted in Javascript onNovember 21, 2014

今天写了一个图片轮播的小demo,用到了判断

先试了一下if else,代码如下:
 

if(n >= count-1){

n =0;

}else{

n ++;

}

随后代码写完了,准备优化一下代码,将此段改成了三目运算符的写法
 

n = n >= (count-1) ? n=0 : n++

结果完全不同

随后研究了一下这两者的区别,总结为一句话:三目运算有返回值,if else没有返回值

做了如下测试:
 

var n=1;

 if(n>1){

    n=0;

}else{

    n++;

}

console.log(n);
输出结果:2

三目运算如下:
 

var n=1;

n = n>1?0 : n++;

console.log(n);

输出结果为:1

插入一段其他内容:++n和n++的区别:简单地说,都是 n 自加1。区别是,n++是执行完后面的语句才加1;而++n 就先做 n+1才执行后面的语句

那么对于++n呢

if else 语句

var n=1;

 if(n>1){

    n=0;

}else{

    ++n;

}

console.log(n);

输出结果:2

三目运算结果
 

var n=1;

n = n>1?0 : ++n; 

console.log(n); 输出结果为:2

 
可以看出if else和三目运算的区别了吧~~~
 
n++和++n在此验证中,没有任何区别,因为if else都是计算结果之后的,不会返回n,没有任何返回值
 
但是对于三目运算,n++返回的n值为n本身,++n返回的n值为n+1之后的结果

读了本文,小伙伴们是不是对js中的三目运算符和if else有了新的认识呢。

Javascript 相关文章推荐
Prototype使用指南之selector.js
Jan 10 Javascript
Javascript UrlDecode函数代码
Jan 09 Javascript
理解javascript回调函数
Dec 28 Javascript
javascript实现回车键提交表单方法总结
Jan 10 Javascript
jQuery动画出现连续触发、滞后反复执行的解决方法
Jan 28 Javascript
js绘制圆形和矩形的方法
Aug 05 Javascript
深入分析javascript中console命令
Aug 14 Javascript
Vue.js每天必学之计算属性computed与$watch
Sep 05 Javascript
在js代码拼接dom对象到页面上去的模板总结(必看)
Feb 14 Javascript
深入理解 JavaScript 中的 JSON
Apr 06 Javascript
详解AngularJS ng-class样式切换
Jun 27 Javascript
js实现随机圆与矩形功能
Oct 29 Javascript
node.js使用npm 安装插件时提示install Error: ENOENT报错的解决方法
Nov 20 #Javascript
JS在可编辑的div中的光标位置插入内容的方法
Nov 20 #Javascript
js实现div弹出层的方法
Nov 20 #Javascript
JavaScript中的公有、私有、特权和静态成员用法分析
Nov 20 #Javascript
js实现二代身份证号码验证详解
Nov 20 #Javascript
js实现网页标题栏闪烁提示效果实例分析
Nov 20 #Javascript
javascript获取flash版本号的方法
Nov 20 #Javascript
You might like
新安装的MySQL数据库需要注意的安全知识
2008/07/30 PHP
php 动态多文件上传
2009/01/18 PHP
fetchAll()与mysql_fetch_array()的区别详解
2013/06/05 PHP
启用OPCache提高PHP程序性能的方法
2019/03/21 PHP
一个非常全面的javascript URL解析函数和分段URL解析方法
2014/04/12 Javascript
JS获取随机数函数可自定义最小值最大值
2014/05/08 Javascript
jQuery.position()方法获取不到值的安全替换方法
2015/03/13 Javascript
高效Web开发的10个jQuery代码片段
2016/07/22 Javascript
jQuery和CSS仿京东仿淘宝列表导航菜单
2017/01/04 Javascript
Angular2学习教程之组件中的DOM操作详解
2017/05/28 Javascript
Ionic项目中Native Camera的使用方法
2017/06/07 Javascript
javascript实现二叉树的代码
2017/06/08 Javascript
JavaScript中利用Array filter() 方法压缩稀疏数组
2018/02/24 Javascript
记一次webpack3升级webpack4的踩坑经历
2018/06/12 Javascript
JS实现图片上传多次上传同一张不生效的处理方法
2018/08/06 Javascript
jQuery的Ajax接收java返回数据方法
2018/08/11 jQuery
webpack打包非模块化js的方法
2018/10/24 Javascript
JQuery模拟实现网页中自定义鼠标右键菜单功能
2018/11/14 jQuery
微信小程序开发实现消息推送
2020/11/18 Javascript
基于html+css+js实现简易计算器代码实例
2020/02/28 Javascript
javascript 函数的暂停和恢复实例详解
2020/04/25 Javascript
Array.filter中如何正确使用Async
2020/11/04 Javascript
Python中列表、字典、元组数据结构的简单学习笔记
2016/03/20 Python
Python 两个列表的差集、并集和交集实现代码
2016/09/21 Python
python机器学习案例教程——K最近邻算法的实现
2017/12/28 Python
Python GUI库PyQt5样式QSS子控件介绍
2020/02/25 Python
html5文字阴影效果text-shadow使用示例
2013/07/25 HTML / CSS
设计师家具购买和委托在线市场:Viyet
2016/11/16 全球购物
英国剑桥包中文官网:The Cambridge Satchel Company中国
2018/11/06 全球购物
美体小铺法国官方网站:The Body Shop法国
2020/06/04 全球购物
伊莱克斯阿根廷网上商店:Tienda Electrolux
2021/03/08 全球购物
如何开发一个JQuery插件
2016/07/28 面试题
学术会议主持词
2014/03/17 职场文书
敬老院院长事迹材料
2014/05/21 职场文书
说好普通话圆梦你我他演讲稿
2014/09/21 职场文书
如何制定一份可行的计划!
2019/06/21 职场文书