我们最开始接触 javascript 应该大部分是从 html 中的 js 脚本开始, 但是这种看似简单的语言稀里糊涂的用了好几年, 也没有搞清楚它的一些原理机制, 有没有躺枪!
起码 javascript 在操作 dom 的时候用了各种事件回调, 比如按钮, 链接的点击, 鼠标经过, 获取焦点等等.
在这个过程中, 我们在 dom 上绑定一个事件回调函数 比如 onclick="doCheck()" 这个过程就是给 dom 元素注册了一个 click 事件, 并且绑定了一个事件回调函数 doCheck().
当鼠标点击这个元素的时候, 触发了事件, 马上执行事件绑定函数并回.
再后来是接触到 jquery 的时候, 大量的
- $("#id").click(function() {
- alert('点击事件');
- });
这种 jquery 的语法写的越来越多似乎已经习惯了, 但是你是都留意过前面的选择器只是选择过滤 dom 节点, 接着的 click 就是一个事件注册, 而里面的 function(){} 其实是一个参数, 事件绑定函数的参数, 这里面就要求你熟悉 javascript 的语法了.
function 在 javascript 中是一个对象, 对象就可以指世界的万事万物, 所以对象可以包含很多属性, 方法等.
既然是对象, 那就可以当做一个参数去传递, 这种函数叫做 高阶函数.
而且这种函数没有定义名称对不对, 当然你可以一个名称, 然后把名称传过来也是一样的, 但是没有意义, 因为这里的函数对象其实是一个形参, 所以我们习惯的不给这种函数起名字, 这就是常说的匿名函数.
接着上面的 $("#id").click 说起, 当点击事件被触发时, 就要执行事件绑定函数. 和上面直接在 dom 上给定 onclick 方法是一样的效果.
假设浏览器里有多个线程去操作脚本的话, 你能想象到他的乱吗? 线程一正要去修改元素 A 的 value 值, 结果没想到线程二已经把元素 A 从 dom 树删除节点, 这时线程一只好操作失败报错. 这样的情况是不糟透了, 要么浏览器无维护多个线程数据的一致性, 要么前端工程师自己去维护, 所以...... 浏览器只有一个线程去操作 dom, 这样省去了很多不必要的麻烦.
- setTimeout(function() {
- alert('弹出');
- },
- 300);
- while (true) {........
- }
你觉得 300 毫秒后 alert('弹出') 还有戏吗
没有了, 永远没有戏了, 等待 300 毫秒只是骗取你的感情的. 因为浏览器是单线程模式执行脚本.
一旦线程处于死循环模式下去执行 while 语句, 你的 setTimeout 再也不会起任何作用了.
进而我们走入了 node.js 世界, 它完全保留了 javascript 在浏览器的特性, 单线程异步回调, 也正是因为这个特点它才是它, 假如 node.js 是一门同步语言, 就算所有的 npm 包都是 c++ 扩展的 (速度够快吧) 再快你也比不过 c 语言处理速度是不是, 那么 node.js 可能还没有出世就已经被 php 鄙视了.
正是因为它的异步回调 IO, 更能提高他的效率, 让我想起以前学校的一种快餐店和学校食堂的对比情况:
食堂是所有学生拿着盘子在窗口排成一字型队, 打饭的妹妹一个一个盛好了, 挨个端上饭走了. 这是同步处理结果.
学校快餐店也是学生排队点餐, 但是点完餐拿上你的呼叫器就可以离开找位置去了. 这样单位时间内服务员可以为很多人提供服务, 而且点好餐的同学可以找位置做自己其他事情, 而不用傻傻地站到窗口等饭, 直到你的饭出来的那一刹那, 服务器会根据单号按下编码, 这时你桌上的呼叫器会响起, 你去取餐就好了. 这是异步处理. 那个呼叫器响起就是触发事件.
单线程可以减少多线程之间状态切换引起的资源浪费和维护困难, 当然也有专门的第三方包来支持多核多线程的情景, 你可以自己权衡.
以上就是关于 JS 单线程回调的全部信息内容,如有大家在学习的时候还有其他的疑问,可以在下面的留言区域讨论。
来源: http://www.jb51.net/article/129573.htm