JavaScript 运行机制详解

前言：

JavaScript 运行机制，提出三个概念：引擎，Web Api，事件循环，回调队列

---

javascript引擎

1. 流行的javascript引擎，就是chrome的v8引擎
2. 引擎：内存管理，和堆栈。

---

javascipt的堆栈调用（调用栈）

首先：任何程序的执行都需要开辟空间，即在内存中占用一定的空间

1. 堆栈的概念
   在javascript中，堆和栈是两种数据结构。

    堆：也叫队列，**先进先出，**由操作系统自动分配释放 ，存放函数的参数值，局部变量的值等，javascript引用类型的对象，存放在`堆（heap）`内存中，堆提供的是这个对象的指针，即内存地址，可以通过这个指针找到内存中的对象。
    栈：**栈(stack)内存** 先进后出； 一般由程序员分配释放内存， 若程序员不释放，程序结束时可被垃圾回收，javascript中5种`Undefined、Null、Boolean、Number 和 String`基本数据类型可以直接访问，内存空间是按值分配的，数据大小确定，内存大小可分配
   

   原图请点击

2. 浅拷贝和深拷贝的理解

    在进行javascript的运算中，如果针对基础数据类型的拷贝，因为他们是按值存在stack中的，所以不存在深浅拷贝的问题，但是，在堆引用对象的使用中，就会显出。
   

   浅拷贝：即假如调用的对象，赋值给一个新的对象，我们操控新对象的时候，对新对象进行属性操作，发现同样更改了原对象的属性

     例：
     let a ={
         'id':1,
         'name':'lv',
    };
    let c = a ;
    c.name = 'jing';
    console.log(a)    // a = {'id':1,'name':'jing'}
    这是因为a、c对象是引用类型的数据，所以存在heap中，在使用的时候，使用的是这个对象的指针，和内存址的指向，所以a，c两个对象操作的时候改变的是对象的属性，这就是浅拷贝，通俗的讲，也叫引用对象的地址拷贝

深度拷贝：其实就是拷贝一个对象，以后，两者的内存地址指向是互不影响的，在stack中存的地址不一样，指向不同的heap内存。

     方法： function deepCopy(obj) {
                return JSON.parse(JSON.stringify(obj));
            }

其他深度拷贝的方法请参考

---

Web Api

所谓的web api就是由浏览器提供的W3C标准，类似与DOM,AJAX,setTimeout以及其它

---

javascript单线程    阮一峰的网络日志

1. javascript的运行平台是浏览器端，为了防止多个线程进行对同一个行为进行操作的复杂性，所以javascript脚本运行时保证同一时间操作的唯一性
2. 正像阮老师书中写到：’假定javascript有两个线程，用户触发增，删两个不同的行为操作同一个dom，其中一个线程发生阻塞，就会影响用户的操作准确性，跟数据库的锁机制是一样的’，我认为如果多线程的话，复杂性高，而且可能有必要添加类型数据库死锁之类的考虑。
3. 但是其实单线程也有他的劣处：就是没有充分利用多核cpu的计算能力，在计算量大的情况下，cpu利用率高，但是在浏览器端，大多数情况是与服务器端进行数据交互，如果是I/O很慢，这个时候主线程会阻塞，cpu性能就浪费了，所以出现了，类似ajax之类的异步交互，包括现在的promise，async，await。都是异步任务。以及包含现在node中出现的创建子线程child_process

---

Event Loop详解（事件循环）

1. 主线程不断循环的从任务队列中读取事件的整个循环机制称为Event Loop（事件循环）任务队列也叫异步任务
2. 主进程的同步任务执行完毕以后，才会执行任务队列中事件，
3. 简言之就是JS只有一个主线程，主线程执行完执行栈的任务后去读取异步的任务队列，如果异步事件触发，则将其加到主线程的执行栈。
4. 执行栈可能不能在一个loop内被执行完，我觉得被挂起取决于运行环境和执行的操作种类。所以被挂起后前面注册的callback还是有可能先于执行栈剩余的代码触发。

---

调用栈

javascript是单线程，所以只有一个栈内存，一个调用栈，（stack）