前端每日一面05

1、描述浏览器的渲染过程？，DOM树和渲染树的区别？
浏览器的渲染过程：

解析 HTML 构建 DOM(DOM树)，并行请求 css/image/js
CSS 文件下载完成，开始构建 CSSOM(CSS树)
CSSOM 构建结束后和 DOM 一起生成 Render Tree(渲染树)
布局(Layout)：计算出每个节点在屏幕中的位置
显示(Painting)：通过显卡把页面画到屏幕上

2、Javascript 如何实现继承？
        实例继承：将子构造函数的 prototype 指向父构造函数的一个实例
        原型继承：将子构造函数的 prototype 指向父构造函数的 prototype
        构造函数绑定：使用 call 或 apply 方法，将父对象的构造函数绑定在子对象上
        拷贝继承：如果把父对象的所有属性和方法，拷贝进子对象
        ES6 语法 extends：class ColorPoint extends Point {}

3、Javascript 作用域链?

如果当前作用域没有找到属性或方法，会向上层作用域查找，
直至全局函数，这种形式就是作用域链

4、eval是做什么的？
eval 的功能是把对应的字符串解析成 JS 代码并运行

应该避免使用 eval，不安全，非常耗性能（先解析成 js 语句，再执行）
由 JSON 字符串转换为 JSON 对象的时候可以用 eval('('+ str +')');

5、js延迟加载的方式有哪些？
动态创建 DOM 方式（用得最多）、defer 和 async标签属性

6、defer 和 async区别
defer 并行加载 js 文件，会按照页面上 script 标签的顺序执行
async 并行加载 js 文件，下载完成立即执行，不会按照页面上 script 标签的顺序执行

7、同步和异步的区别?

同步: 下面代码会等待上面同步代码执行完毕
异步: 下面代码不会等待上面异步代码执行完毕
同步：浏览器访问服务器请求，用户看得到页面刷新，重新发请求,等请求完，页面刷新，
新内容出现，用户看到新内容,进行下一步操作
异步：浏览器访问服务器请求，用户正常操作，浏览器后端进行请求。
等请求完，页面不刷新，新内容也会出现，用户看到新内容

8、documen.write 和 innerHTML 的区别

document.write 只能重绘整个页面
innerHTML 可以重绘页面的某一部分

9、说说你对闭包的理解
闭包有三个特性：

函数嵌套函数
函数内部可以引用外部的参数和变量
参数和变量不会被垃圾回收机制回收,会永远留驻在内存中

使用闭包主要是为了设计私有的方法和变量。
优点：是可以避免全局变量的污染，

缺点：是闭包会常驻内存，会增大内存使用量，使用不当很容易造成内存泄露。

10、把 <script> 放在 </body> 之前和之后有什么区别？
        浏览器会如何解析它们？
        按照HTML标准，在结束后出现<script>或任何元素的开始标签都是解析错
        虽然不符合 HTML 标准，但浏览器会自动容错，
        使实际效果与写在</body>之前没有区别
        浏览器的容错机制会忽略<script>之前的，视作<script>仍在 body 体内。

11、为什么 JS 是单线程, 而不是多线程 [常考]

单线程是指 JavaScript 在执行的时候，有且只有一个主线程来处理所有的任务。
目的是为了实现与浏览器交互。
我们设想一下，如果 JavaScript 是多线程的，现在我们在浏览器中同时操作一个
DOM，一个线程要求浏览器在这个 DOM 中添加节点，
而另一个线程却要求浏览器删掉这个 DOM 节点，
那这个时候浏览器就会很郁闷，他不知道应该以哪个线程为准。
所以为了避免此类现象的发生，降低复杂度，JavaScript
选择只用一个主线程来执行代码，以此来保证程序执行的一致性。

12、 DOM树和渲染树的区别？

DOM 树与 HTML 标签一一对应，包括 head 和隐藏元素
渲染树不包括 head 和隐藏元素，大段文本的每一个行都是独立节点，
每一个节点都有对应的 css 属性

后面更新的面试题都集合在这个链接里面2022最全最新前端面试题（附加解答）_心如天然薄荷清凉的博客-CSDN博客_前端面试题

猜你喜欢