Home

事件循环：微任务与宏任务 JavaScript 的执行流，无论是浏览器还是 Node.js，都是基于事件循环。 理解事件循环能够让我们写出更可靠的高性能代码。 让我们先介绍一下事件循环的原理，然后再来看看实际应用。 事件循环（Event Loop） 事件循环的概念非常简单。它就是一个无止境的循环，JavaScript 引擎等待任务（tasks）出现，然后执行任务，执行完毕后继续等待任务出现。 JavaScript 引擎对事件循环的算法为： 当发现任务时： 执行任务，从最先进入队列的任务开始 等待其他任务出现，然后执行步骤 1。 当浏览网页时，就是以这种方式呈现。JavaScript 引擎在大部分时间都处于空闲状态，仅在被...

纯函数就是一个函数，只不过具有一些特点，你可能平时开发中都有用到，只是没有意识到这是一个纯函数。 纯函数（Prue function）具有以下特点： 纯函数每一次调用时传入同样的参数，返回的都是同样的结果；它不会改变参数的值，也不会改变外部变量的值；它不会依赖于外部的变量，仅依赖于你传入的参数； 纯函数没有其他副作用（side effect） 如果你每次传入的参数一样，但是返回的结果不一样，则不是一个纯函数 Just show me the code: 这是一个纯函数: /* 它接受两个参数：一个数组和一个要添加的项 然后根据这两个参数，返回一个新的数组 它没有改变原来参数的值 每次调用时传递相同的值，返回的结果永远一样 ...

avaScript延迟脚本之async和defer的区别 defer 和 async 都是<script>标签的属性，属于 HTML4 的规范，作用是延迟加载脚本和异步执行 JS 代码。 defer 属性 浏览器在解析 HTML 文档时，如果遇到有 defer 属性的<script>标签，会立即下载该文件，下载的同时不阻塞 HTML 的解析与渲染，一旦页面解析和渲染完毕，就会执行该文件。 在 HTML5 的规范中，规定了多个带有 defer 属性的<script>标签在执行时按照在页面中的先后顺序来执行，并且执行的时机是在页面的 DomContentLoaded() 事件之前。 但是在现实中，多个 defer 属性并不一定按照顺序执行，也不一...

目录 对象类型转换时的分类 对象转换时的步骤 Symbol.toprimitive toString和valueOf 必须返回一个基础类型 存在显示的 toString 方法 摘要 对象转换时先要确定转换的类型，这个类型在对象的[Symbol.toPrimitive]属性值-函数的参数中可以拿到，一共有三种： string number default string 以下两种情况会将确定对象的转换类型为 string： 使用alert(person) 将对象看做是一个对象的属性来取值时，例如family[person] number 以下两种情况会将确定对象的转换类型为 number： 使用一元数学操作符，...

JavaScript 的内存管理（垃圾回收机制） 在 JavaScript 中，内存管理是自动执行并且不可见的。我们创建原始数据类型，对象，函数…，都需要占用内存。 当有些变量不再需要的时候会发生什么呢？Javascript 引擎是怎么发现它并且清除它的呢？ 可达性（Reachablity） 在内存管理中，主要的概念就是可达性。 简单来说，可达性就是指那些可以访问到的或者可以使用的数据。这些数据被存放在内存当中。 有一系列默认拥有可达性特点的值，它们无法被显示删除。 例如： 当前函数的参数和局部变量 嵌套的函数调用链中的其他函数的参数和变量 全局变量 （其他一些内在的值） 这些值被称之为根值（roots） ...

HTTP（Hypertext Transfer Protocol）和 HTTPS（Hypertext Transfer Protocol Secure）是两种用于在计算机网络上传输数据的协议。它们的主要区别在于安全性： 安全性： HTTP： HTTP 是一种不加密的协议，意味着通过 HTTP 传输的数据在网络上是明文可见的。这使得数据容易受到窃听、篡改和其他安全风险的威胁。 HTTPS： HTTPS 通过使用 SSL（Secure Sockets Layer）或 TLS（Transport Layer Security）加密协议来保护传输的数据。这意味着通过 HTTPS 传输的数据在传输过程中是加密的，从而更难以被窃听和篡改。 ...

CSS 层叠（Cascading）指的是某个元素会根据样式规则的优先级来设置某个元素的外观。 层叠样式的优先级主要有三方面： 根据样式域判断，是用户代理样式（user agent stylesheet），还是我们自己写的样式；是否存在 !important 标识； 根据元素样式属性判断，是否是写在元素行内的 style 属性中； 根据选择器判断。 用户代理样式是什么？ 基本上所有浏览器都有默认的样式，例如 <h1>-<h6>，<p> 标签都有默认的上边距和下边距，这是由浏览器默认设置的，所以叫用户代理样式。 如果一个元素身上有很多相同的样式规则，那么到底该应用哪一条呢？ 首先，浏览器会先判断当前样式是用户代理样式还是我们自...

浏览器的渲染流程分为三步：布局（Layout）、绘制（Paint）、混合（Composite）。 当浏览器计算出哪条样式是作用在哪个元素身上以后，就需要将样式转换成 px 并显示在屏幕上。这个过程就是渲染（rendering），整个过程可以分为三步：布局，绘制，混合。 布局 渲染的第一步是布局，浏览器计算每个元素要在文档中占据的空间。因为有默认的文档流，元素的大小和位置会影响到页面中其他元素的大小和位置。布局就是将他们计算出来。 任何时候改变一个元素的宽高或者调整它的定位偏移值（Left / top 等），浏览器就会重新计算这个元素的布局。同样的，如果插入一个元素到文档流中，或者通过 JS 从文档流中移除一个元素，浏览器也会重新计算该元素的布局。当一个元素的布局发生改变，浏...