好程序员web前端教程分享初学者搞懂i++和++i

刚学习前端的同学,在学到++运算符的时候,都是一脸的懵

var k = 10;

console.log(k++ + ++k + k++) //34

var i = 10;

console.log(++i + i++ + ++i) //35

console.log(i++ + ++i + i++) //43

way???为什么?为什么?为什么?

下面我们一步一步的来看:

1、 var i = 10;

2 、i++; //等价于i=i+1

3 、console.log(i); //11

###++可以与输出语句写在一起,++写在变量前和写在变量后不是一个意思

i++ : 先用a的原值,然后i加1;

++i :先给a加1,然后用i的新值


1、 var i = 10;

2 、console.log(i++); //10 ,先引用原值,然后加1

等价于:

1 、 var i= 10;

2、 console.log(i);   //先输出i

3、 i++;              //然后f加i

区别于:


1、 var i = 10;

2、 console.log(++i);  //11 , 这次是先加1,然后输出

++有点意思的玩法:


1 var i = 8;

2 console.log(4 + i++);   //12  , 先使用原来的a的值,就是4+8,输出12.然后a加1

3 console.log(i);     //9

4 console.log(++i % 5);   //0  , 先把i加1,然后使用i,10%5=0

5 console.log(i);     //10

1 var a = 1;          //a的值1

2 var b = a++;       //b的值是1,a的值是2 。++写在后面,是先用再加

3 a += ++b;           //先把b加1,b就是2了,a原来是2,加上2,就是4

4 console.log(a);    //4

console.log(b);    //2

1 var a = 3;                //a的值是3

2 console.log(a++ + a++);  //计算从左到右的,所以第一次a++时用的是3,a变为4。

3                            //第二次遇见a++的时候,a用的是4,变为5

4                            //3 + 4 所以输出7

console.log(a);          //输出5

1 var a = 3;

2 console.log(a++ + ++a);  //8

console.log(a);           //5

总结:

其实++运算符非常的简单,只要你记住一句口诀:++在前下自加后运算;++在后先运算后自加;然后在细心点就好了

原文地址:https://blog.51cto.com/14573321/2456781

时间: 2024-11-08 18:43:58

好程序员web前端教程分享初学者搞懂i++和++i的相关文章

好程序员web前端教程分享异步加载CSS的一些方法

好程序员web前端教程分享异步加载CSS的一些方法,在我们写页面的时候,我们做最主要的任务就是提高页面的性能和弹性加载速度,以不会延迟页面的呈现的形式来加载CSS.这是因为在默认情况下, - 浏览器会同步加载外部的CSS - 在下载和解析CSS时会影响所有页面呈现 这两种情况都会导致潜在的延迟. 当然,这也是在开始渲染页面之前,应该至少加载网站的CSS的一部分,并且为了立即将该初始CSS添加到浏览器,我们建议内联css.对于整体数量较少的网站,仅此一项就足够了,但如果CSS很大(例如,大于15到

好程序员web前端教程分享js中的模块化一

好程序员web前端教程分享js中的模块化一:我们知道最常见的模块化方案有CommonJS.AMD.CMD.ES6,AMD规范一般用于浏览器,异步的,因为模块加载是异步的,js解释是同步的,所以有时候导致依赖还没加载完毕,同步的代码运行结束:CommonJS规范一般用于服务端,同步的,因为在服务器端所有文件都存储在本地的硬盘上,传输速率快而且稳定. 1.script标签引入 最开始的时候,多个script标签引入js文件.但是,这种弊端也很明显,很多个js文件合并起来,也是相当于一个script,

好程序员web前端教程分享前端javascript练习题之promise

好程序员web前端教程分享前端javascript练习题之promisepromise-ajax的封装function ajax(url){//创建promise对象var promise = new Promise(function(resolve,reject){//创建ajax对象if(window.XMLHttpRequest){var xhr = new XMLHttpRequest();}else{var xhr = new ActiveXObject("Microsoft.XMLH

好程序员web前端教程分享怎么用promise解决回调和异步

好程序员web前端教程分享怎么用promise解决回调和异步首先让我们看看下面这题输出什么? setTimeout(function() { console.log(1); },1000) console.log(2); 我们得到的结果是:先输出2,后输出1;这是什么原因呢?大家应该都知道定时器是异步的;所以先先输出2;那么我们的需求来了,怎么先输出1,然后输出2呢? function foo(callback) { setTimeout(function() { console.log(1);

好程序员web前端教程分享JavaScript简写方法

今天好程序员web前端教程为大家分享JavaScript简写方法,小伙伴们快来看一看吧. 1.三元操作符 当想写if...else语句时,使用三元操作符来代替. constx =20; let answer; if(x >10) { answer ='is greater'; }else{ answer ='is lesser'; } 简写: constanswer = x >10?'is greater':'is lesser'; 也可以嵌套if语句: constbig = x >10

好程序员web前端教程:对象

什么是对象? 对象的类型是Object. JavaScript 中的所有事物都是对象:字符串.数值.数组.函数... javaScript中万事万物皆对象 用官方一点的语言来解释对象: 什么是对象,其实就是一种类型,即引用类型.而对象的值就是引用类型的实例.在 ECMAScript 中引用类型是一种数据结构,用于将数据和功能组织在一起.它也常被称做为类,但 ECMAScript 中却没有这种东西.虽然 ECMAScript 是一门面向对象的语言,却不具 备传统面向对象语言所支持的类等基本结构.

好程序员web前端分享前端javascript练习题一

好程序员web前端教程将会为大家持续分享前端javascript练习题系列.Math 对象 1.编写一个函数,获得一个十六进制的随机颜色的字符串(例如:#20CD4F)方法:function f2(){var str="0123456789abcdef";var color="#";for(var i=0;i<6;i++){var num=Math.floor(Math.random()*str.length);color=color+str[num];}co

好程序员web前端分享CSS文件引用的最优方法

好程序员web前端分享CSS文件引用的最优方法,在html总引入css文件的方法: 1链接式: 2导入式: 区别: 使用链接式时,会在加载页面主体部分之前加载css文件,这样现实出来的页面一开始就是带有样式效果的,而使用导入式时,会在整个页面装载完成之后再装载css文件,对于有的浏览器来说,在一些情况下,如果页面文件的体积比较大,则会出现先现实无样式的页面,闪烁一下之后再出现设置样式的效果.从浏览者的感受来说,这是使用导入式的一个缺陷.** 链接式比导入式快. 当有多个文件链接到页面的时候会导致

好程序员web前端分享css常用属性缩写

好程序员web前端分享css常用属性缩写,使用缩写可以帮助减少你CSS文件的大小,更加容易阅读.css缩写的主要规则如下: 颜色 16进制的色彩值,如果每两位的值相同,可以缩写一半,例如: #000000可以缩写为#000;#336699可以缩写为#369; 盒尺寸 通常有下面四种书写方法: property:value1; 表示所有边都是一个值value1; property:value1 value2; 表示top和bottom的值是value1,right和left的值是value2 pr