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 相关文章推荐
使用JavaScript+canvas实现图片裁剪
Jan 30 Javascript
JS获得图片alt信息的方法
Apr 01 Javascript
JavaScript是如何实现继承的(六种方式)
Mar 31 Javascript
Vue.js 递归组件实现树形菜单(实例分享)
Dec 21 Javascript
jQuery事件与动画基础详解
Feb 23 Javascript
JS完成画圆圈的小球
Mar 07 Javascript
JS实现电商放大镜效果
Aug 24 Javascript
AngularJS监听ng-repeat渲染完成的方法
Mar 20 Javascript
jQuery插件实现弹性运动完整示例
Jul 07 jQuery
Vuex 使用及简单实例(计数器)
Aug 29 Javascript
Vue框架里使用Swiper的方法示例
Sep 20 Javascript
浅析vue中的nextTick
Dec 28 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获取类中常量,属性,及方法列表的方法
2009/04/09 PHP
仿AS3实现PHP 事件机制实现代码
2011/01/27 PHP
PHP新手NOTICE错误常见解决方法
2011/12/07 PHP
php实现的漂亮分页方法
2014/04/17 PHP
PHP编写daemon process 实例详解
2016/11/13 PHP
laravel框架路由分组,中间件,命名空间,子域名,路由前缀实例分析
2020/02/18 PHP
innerHTML,outerHTML,innerTEXT三者之间的区别
2007/01/28 Javascript
JavaScript 拖拉缩放效果
2008/12/10 Javascript
js和jquery对dom节点的操作(创建/追加)
2013/04/21 Javascript
每天一篇javascript学习小结(Boolean对象)
2015/11/12 Javascript
js精准的倒计时函数分享
2016/06/29 Javascript
详解angularjs 关于ui-router分层使用
2017/06/12 Javascript
nodejs Assert中equal(),strictEqual(),deepEqual(),strictDeepEqual()比较
2017/09/18 NodeJs
vue封装第三方插件并发布到npm的方法
2017/09/25 Javascript
Webpack实战加载SVG的方法
2017/12/26 Javascript
微信web端后退强制刷新功能的实现代码
2018/03/04 Javascript
vue.js单文件组件中非父子组件的传值实例
2018/09/13 Javascript
浅析Angular 实现一个repeat指令的方法
2019/07/21 Javascript
详解webpack引用jquery(第三方模块)的三种办法
2019/08/21 jQuery
JS相册图片抖动放大展示效果的示例代码
2021/01/29 Javascript
Python使用numpy模块创建数组操作示例
2018/06/20 Python
便捷提取python导入包的属性方法
2018/10/15 Python
python 二维矩阵转三维矩阵示例
2019/11/30 Python
tensorflow 实现从checkpoint中获取graph信息
2020/02/10 Python
CSS3制作彩色进度条样式的代码示例分享
2016/06/23 HTML / CSS
关于HTML5的安全问题开发人员需要牢记的
2012/06/21 HTML / CSS
高中生物教学反思
2014/02/05 职场文书
公司会计岗位职责
2014/02/13 职场文书
捐款倡议书格式范文
2014/05/14 职场文书
教师演讲稿开场白
2014/08/25 职场文书
高中生国庆节演讲稿范文2014
2014/09/21 职场文书
个人学习党的群众路线教育实践活动心得体会
2014/11/05 职场文书
2014年控辍保学工作总结
2014/12/08 职场文书
Redis Cluster 字段模糊匹配及删除
2021/05/27 Redis
JavaScript实现两个数组的交集
2022/03/25 Javascript
《仙剑客栈2》第一弹正式宣传片公开 年内发售
2022/04/07 其他游戏