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 相关文章推荐
Mootools 1.2教程 设置和获取样式表属性
Sep 15 Javascript
JQuery 绑定事件时传递参数的实现方法
Oct 13 Javascript
jquery attr 设定src中含有&(宏)符号问题的解决方法
Jul 26 Javascript
jquery ajax 局部刷新小案例
Feb 08 Javascript
Jquery焦点图实例代码
Nov 25 Javascript
JS实现网站菜单拖拽移位效果的方法
Sep 24 Javascript
js和jquery分别验证单选框、复选框、下拉框
Dec 17 Javascript
Bootstrap每天必学之模态框(Modal)插件
Apr 26 Javascript
JavaScript将base64图片转换成formData并通过AJAX提交的实现方法
Oct 24 Javascript
angular实现input输入监听的示例
Aug 31 Javascript
JS addEventListener()和attachEvent()方法实现注册事件
Jan 11 Javascript
vue仿携程轮播图效果(滑动轮播,下方高度自适应)
Feb 11 Vue.js
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
PHP网上调查系统
2006/10/09 PHP
PHP4实际应用经验篇(6)
2006/10/09 PHP
php设计模式 Adapter(适配器模式)
2011/06/26 PHP
PHP flush()与ob_flush()的区别详解
2013/06/03 PHP
利用curl抓取远程页面内容的示例代码
2013/07/23 PHP
php+mysqli事务控制实现银行转账实例
2015/01/29 PHP
PHP高并发和大流量解决方案整理
2019/12/24 PHP
用Javascript做flash做的事..才完成的一个类.Auntion Action var 0.1
2007/02/23 Javascript
htm调用JS代码
2007/03/15 Javascript
js prototype截取字符串函数
2010/04/01 Javascript
js简单实现让文本框内容逐个字的显示出来
2013/10/22 Javascript
Javascript基础知识(二)事件
2014/09/29 Javascript
Bootstrap jquery.twbsPagination.js动态页码分页实例代码
2017/02/20 Javascript
javascript实现圣旨卷轴展开效果(代码分享)
2017/03/23 Javascript
Angular实现图片裁剪工具ngImgCrop实践
2017/08/17 Javascript
Angular实现的日程表功能【可添加及隐藏显示内容】
2017/12/27 Javascript
AngularJS监听ng-repeat渲染完成的方法
2018/03/20 Javascript
vue项目关闭eslint校验
2018/03/21 Javascript
vue.js绑定事件监听器示例【基于v-on事件绑定】
2018/07/07 Javascript
微信小程序scroll-view锚点链接滚动跳转功能
2019/12/12 Javascript
Vue3新特性之在Composition API中使用CSS Modules
2020/07/13 Javascript
npm全局环境变量配置详解
2020/12/15 Javascript
[44:51]2018DOTA2亚洲邀请赛 4.4 淘汰赛 VP vs Liquid 第二场
2018/04/05 DOTA
python解析json实例方法
2013/11/19 Python
python抓取豆瓣图片并自动保存示例学习
2014/01/10 Python
Python读取文件内容的三种常用方式及效率比较
2017/10/07 Python
解决webdriver.Chrome()报错:Message:'chromedriver' executable needs to be in Path
2019/06/12 Python
Python 运行.py文件和交互式运行代码的区别详解
2019/07/02 Python
python动态视频下载器的实现方法
2019/09/16 Python
python定间隔取点(np.linspace)的实现
2019/11/27 Python
python计算Content-MD5并获取文件的Content-MD5值方式
2020/04/03 Python
Python进行统计建模
2020/08/10 Python
使用CSS3实现input多选框自定义样式的方法示例
2019/07/19 HTML / CSS
治超工作实施方案
2014/05/04 职场文书
个人工作表现评价材料
2014/09/21 职场文书
授权委托书样本
2014/09/25 职场文书