JavaScript高级-04_线程机制与事件机制

柔情只为你懂 2022-05-17 02:36 193阅读 0赞

## 线程与进程 ##

*  进程:
    
     *  程序的一次执行, 它占有一片独有的内存空间
     *  可以通过windows任务管理器查看进程
 *  线程:
    
     *  是进程内的一个独立执行单元
     *  是程序执行的一个完整流程
     *  是CPU的最小的调度单元
 *  关系
    
     *  一个进程至少有一个线程(主)
     *  程序是在某个进程中的某个线程执行的

## 浏览器内核模块组成 ##

*  主线程
    
     *  js引擎模块 : 负责js程序的编译与运行
     *  html,css文档解析模块 : 负责页面文本的解析
     *  DOM/CSS模块 : 负责dom/css在内存中的相关处理
     *  布局和渲染模块 : 负责页面的布局和效果的绘制(内存中的对象)
 *  分线程
    
     *  定时器模块 : 负责定时器的管理
     *  DOM事件模块 : 负责事件的管理
     *  网络请求模块 : 负责Ajax请求

## js线程 ##

*  js是单线程执行的(回调函数也是在主线程)
 *  H5提出了实现多线程的方案: Web Workers
 *  只能是主线程更新界面

## 定时器问题: ##

*  定时器并不真正完全定时
 *  如果在主线程执行了一个长时间的操作, 可能导致延时才处理

## 事件处理机制(图) ##

*  代码分类
    
     *  初始化执行代码: 包含绑定dom事件监听, 设置定时器, 发送ajax请求的代码
     *  回调执行代码: 处理回调逻辑
 *  js引擎执行代码的基本流程:
    
     *  初始化代码===>回调代码
 *  模型的2个重要组成部分:
    
     *  事件管理模块
     *  回调队列
 *  模型的运转流程
    
     *  执行初始化代码, 将事件回调函数交给对应模块管理
     *  当事件发生时, 管理模块会将回调函数及其数据添加到回调列队中
     *  只有当初始化代码执行完后(可能要一定时间), 才会遍历读取回调队列中的回调函数执行

## H5 Web Workers ##

*  可以让js在分线程执行
 *  Worker
    
        var worker = new Worker('worker.js');
        worker.onMessage = function(event){event.data} : 用来接收另一个线程发送过来的数据的回调
        worker.postMessage(data1) : 向另一个线程发送数据
 *  问题:
    
     *  worker内代码不能操作DOM更新UI
     *  不是每个浏览器都支持这个新特性
     *  不能跨域加载JS
 *  svn版本控制
 *  svn server