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

简介:

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

总结:

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

相关文章
|
9天前
|
编解码 前端开发 JavaScript
构建高效响应式Web界面:现代前端框架的比较
【4月更文挑战第9天】在移动设备和多样屏幕尺寸盛行的时代,构建能够适应不同视口的响应式Web界面变得至关重要。本文深入探讨了几种流行的前端框架——Bootstrap、Foundation和Tailwind CSS,分析它们在创建响应式设计中的优势与局限。通过对比这些框架的栅格系统、组件库和定制化能力,开发者可以更好地理解如何选择合适的工具来优化前端开发流程,并最终实现高性能、跨平台兼容的用户界面。
|
10天前
|
前端开发 JavaScript 关系型数据库
从前端到后端:构建现代化Web应用的技术探索
在当今互联网时代,Web应用的开发已成为了各行各业不可或缺的一部分。从前端到后端,这篇文章将带你深入探索如何构建现代化的Web应用。我们将介绍多种技术,包括前端开发、后端开发以及各种编程语言(如Java、Python、C、PHP、Go)和数据库,帮助你了解如何利用这些技术构建出高效、安全和可扩展的Web应用。
|
11天前
|
编解码 前端开发 JavaScript
Web 前端开发中的最佳实践
本文将介绍 Web 前端开发中的最佳实践,包括代码组织、性能优化、响应式设计和用户体验等方面。通过遵循这些实践,开发人员可以提高开发效率,优化用户体验,并减少潜在的问题和错误。
|
4天前
|
前端开发 搜索推荐 数据安全/隐私保护
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
13 1
|
4天前
|
前端开发 JavaScript vr&ar
前端新技术探索:WebAssembly、Web Components与WebVR/AR
【4月更文挑战第12天】WebAssembly、Web Components和WebVR/AR正重塑Web应用的未来。WebAssembly允许C/C++等语言在Web上高效运行,提供接近原生的性能,如游戏引擎。Web Components通过Custom Elements和Shadow DOM实现可复用的自定义UI组件,提升模块化开发。WebVR/AR(现WebXR)则让VR/AR体验无需额外应用,直接在浏览器中实现。掌握这些技术对前端开发者至关重要。
12 3
|
25天前
|
机器学习/深度学习 前端开发 算法
利用机器学习优化Web前端性能的探索与实践
本文将介绍如何利用机器学习技术来优化Web前端性能,探讨机器学习在前端开发中的应用,以及通过实际案例展示机器学习算法对前端性能优化的效果。通过结合前端技术和机器学习,提升Web应用的用户体验和性能表现。
|
26天前
|
API
2024常用Web支付开发讲解教程
本教程为web支付开发,讲解了最常用的两钟支付:支付宝支付和微信支付,服务器配置和API对接,学完本课程可以学会微信支付、和支付宝支付开发。
17 2
2024常用Web支付开发讲解教程
|
26天前
|
架构师 前端开发
web全栈架构师第16期教程
互联网时代已进入后半场,行业环境发生了显著变化。互联网人,尤其是技术人员,如何在加速更迭的技术浪潮中持续充电,提升自身价值,是当下必须面对的挑战。课程涉及了现下前端实际开发时所需要的各块内容,并深度对标 阿里 P6+级别所具备的知识储备及开发技能,奠定源码阅读基础和全栈开发能力。
19 3
web全栈架构师第16期教程
|
27天前
|
移动开发 前端开发 HTML5
Web前端全栈HTML5通向大神之路
本套课程共三大阶段,六大部分,是WEB前端、混合开发与全栈开发必须要掌握的技能,从基础到实践,是从编程小白成长为全栈大神的最佳教程!
34 3
Web前端全栈HTML5通向大神之路
|
8月前
|
Web App开发 前端开发 JavaScript
前端学习笔记202307学习笔记第五十七天-模拟面试笔记react-fiber解决了什么问题
前端学习笔记202307学习笔记第五十七天-模拟面试笔记react-fiber解决了什么问题
95 0