zoukankan      html  css  js  c++  java
  • js中关于执行的顺序及变量存放方式的一点记录

    Markdown在线编辑器 - www.MdEditor.com

    1 首先关于数据类型,有基本数据类型,和引用数据类型

    基本数据类型有:number,string,boolean等;引用数据类型一般指object
    栈:大小固定;堆:大小不固定;栈中存放一些基本的数据类型,和引用数据类型的地址;堆中存放引用数据类型的实际值。

    造成问题,当两个变量指向同一个地址时,引起数据的同步修改

    1. <script>
    2. window.onload =function(){
    3. var arr1 =[1,2,3,4,5];
    4. //浅拷贝
    5. var arr2 = arr1;
    6. arr2[2]=100;
    7. console.log(arr1);//[ 1, 2, 100, 4, 5 ]
    8. console.log(arr2);//[ 1, 2, 100, 4, 5 ]
    9. //深拷贝
    10. var arr3 =[];
    11. for(let i in arr1){
    12. arr3[i]= arr1[i];
    13. }
    14. arr3[2]=555;
    15. console.log(arr1);//[ 1, 2, 100, 4, 5 ]
    16. console.log(arr3);//[ 1, 2, 555, 4, 5 ]
    17. }
    18. </script>

    2 js是单线程的语言,只有一个执行的进程,在解析执行js文件的时候,对一些造成异步的函数,会将该处理事件放入宏任务待执行队列,和微任务待执行队列

    宏任务与微任务的执行顺序是,执行一个宏任务后,执行所有的微任务,在接着执行宏任务
    宏任务:setTimeout,setInterval等;微任务:Promise.then catch finally;process.nextTick;等
    1. <script>
    2. window.onload =function(){
    3. setTimeout(()=>{
    4. console.log('1级宏事件1');
    5. newPromise((resolve)=>{ resolve()})
    6. .then(()=>{
    7. console.log('2级微事件3');
    8. })
    9. });
    10. console.log('主事件1');
    11. newPromise((resolve)=>{
    12. console.log('主事件2');
    13. resolve()
    14. }).then(()=>{
    15. console.log('1级微事件1');
    16. setTimeout(()=>{console.log('2级内宏事件2')});
    17. }).then(()=>{
    18. console.log('1级微事件2')
    19. })
    20. }
    21. </script>

    输出:
    主事件1
    主事件2
    1级微事件1
    1级微事件2
    1级宏事件1
    2级微事件3
    2级内宏事件2


  • 相关阅读:
    netty 学习总结
    tps 真正理解
    Eureka 学习
    h5前端编译项目问题
    web自动化学习
    python unittest自动化执行的几种方式
    python pip install XX 出现Could not fetch URL https://pypi.python.org/simple/pool/: There was a problem confirming
    TypeError: 'module' object is not callable
    简明HTML+CSS实现圣杯布局方法及要点(浮动实现)
    负Margin技术,轻松实现 1.自适应两列布局,2.元素垂直居中(相对定位)
  • 原文地址:https://www.cnblogs.com/Zxq-zn/p/11742122.html
Copyright © 2011-2022 走看看