js面试题总结1

投时

已于 2022-03-23 10:32:03 修改

阅读量288

点赞数

分类专栏：面试题文章标签： javascript

于 2022-02-27 22:38:33 首次发布

本文链接：https://blog.csdn.net/gxll499294075/article/details/123171326

版权

面试题专栏收录该内容

11 篇文章 1 订阅

订阅专栏

本文探讨了JavaScript的延迟加载技术async和defer的区别，介绍了基本数据类型和null/undefined的含义，并剖析了单线程下如何通过事件循环处理异步。同时，揭示了JavaScript的垃圾回收机制及其在开发中的重要性。

摘要由CSDN通过智能技术生成

持续更新中。。。。

1. 延迟加载JS有哪些方式？

方式有很多，如：动态创建script标签的方式，或者定时器的方式。

这里需要的回答的是 async 和 defer 的区别。

async和defer的原理：

async vs defer attributes - Growing with the Web

正常情况下执行代码是从上往下依次执行，但是如果在head引入js文件处理body中dom元素，就会报错，所以一般情况下把引入外部的放在代码后面引入；async、 defer可以延迟加在js，保证代码不会出错。

答案：

延迟加载js： async、 defer

例如：<script defer type="text/javascript" src="script.js"></script>

defer：等html全部解析完成，才会执行js代码，顺次执行js脚本。

async：async是和html解析同步的（一起的），不是顺次执行js脚本（谁先加载完谁先执行）。所以一般有相互依赖的js引入，就使用defer比较好。

2. js数据类型有哪些？

基本类型：string、number、boolean、undefined、null、symbol、bigint（争议中）

引用类型：object

NaN是一个数值类型，但不是一个具体的数字。

3. null和undefined的区别

理解文档：

一、奇怪点

有点奇怪的是，JavaScript语言居然有两个表示“无”的值：undefined和null，这是为什么？

二、历史原因

1995年JavaScript诞生时，最初像java一样，只设置了null作为表示“无”的值。根据 C语言的传统，null被设计成可以自动转为0.

但是，JavaScript的设计者，觉得这样还不够，主要有以下两个原因。

1.null像在java里一样，被当成一个对象，但是，JavaScript的数据类型分成原始类型（primitive）和合成类型（complex）两大类，作者觉得表示“无”的值最好不是对象。

2.JavaScript的最初版本没有包括错误处理机制，发生数据类型不匹配时，往往是自动转换类型或者默默失败。作者觉得，如果null自动转换为0，很不容易发现错误。

因此，作者又设计了一个undefined。

这里注意：先有null后有undefined，出来undefined是为了填补之前的坑。

三、具体区别

JavaScript的最初版本是这样区分的：null是一个表示“无”的对象（空对象指针），转为数值为0； undefined是一个表示“无”的原始值，转为数值为NaN。

console.log(Number(undefined));    // NaN
console.log(Number(null));    // 0

答案：

1.作者在设计js是先设计了null（为什么设计了null：最初设计js的时候借鉴了java的语言）

2.null会被隐式转换为 0，很不容易发现错误。

3.先有null后有undefined，出来undefined是为了填补之前的坑。

具体区别：JavaScript的最初版本是这样区分的：null是一个表示“无”的对象（空对象指针），转为数值时为0；undefined是一个表示“无”的原始值，转为数值时为NaN

4. == 和 === 有什么不同？

console.log(1 == '1');      // true
console.log(true == 1);     // true
console.log(null == undefined);     // true
console.log([1, 2] == '1,2');   // true

var s = '2';
if (s == 2) {
    console.log(typeof s);  // true
}

//验证 == 隐式转换的方式是否用 valueOf()
Object.prototype.valueOf = function () {
    console.log(123);
}
var arr = [1, 2];
var str = '1,2';
console.log(arr == str);  // false
// 从原型更改 valueOf() 就会发现 == 隐式转换失败，不能进行隐式转换

valueOf() 方法讲解：

JavaScript valueOf() 方法

答案：

== ：比较值

string == number || boolean || number ... 都会进行隐式转换

通过 valueOf 转换（valueOf() 方法通常由JavaScript在后台自动转换）

=== ：除了表较值，还比较类型

5. JS微任务&宏任务

理解过程：

一、为什么 JavaScript是单线程的？

JavaScript 语言的一大特点就是单线程，也就是说，同一个时间只能做一件事，那么，为什么JavaScript不能有多个线程呢？这样能提高效率啊。

JavaScript的单线程，与它的用途有关，作为浏览器脚本语言，JavaScript的主要用途是与用户交互，以及操作DOM，这就决定了它只能是单线程，否则会带来很复杂的同步问题。比如，假定JavaScript同时有两个线程，一个线程在某个DOM节点上添加内容，另一个线程删除这个节点，这时浏览器应该以哪个线程为准？

所以，为了避免复杂性，从一诞生，JavaScript就是单线程，这已经成了这门语言的核心特性，将来也不会改变。

二、JavaScript是单线程，怎么执行异步的代码？

单线程就意味着，所有任务需要排队，前一个任务结束，才会执行后一个任务。如果前一个任务耗时很长，后一个任务就不得不一直等着。

消息队列：消息队列是一个先进先出的队列，它里面存放着各种消息。

事件循环：事件循环是指主线程重复从消息队列中取消息，执行的过程。

实际上，主线程只会做一件事件，就是从消息队列里面取消息。执行消息、再取消息，再执行，当消息队列为空时，就会等待直到消息队列变成非空。而且主线程只有在当前的消息执行完成后，才会取下一个消息，这种机制就叫做事件循环机制。

答案：

1.js是单线程的语言。

2.js代码执行流程：同步执行完 ==> 事件循环

同步的任务都执行完了，才会执行事件循环的内容

进入事件循环：请求、定时器、事件...

3.事件循环中包含：【微任务、宏任务】

微任务：promise.then

宏任务：setTimeout..

要执行宏任务的前提是清空了所有的微任务。

流程：同步 ===》事件循环【微任务和宏任务】===》微任务 ===》宏任务 ==》微任务...

6.js垃圾回收机制

7.vue路由模式

8.js如何实现异步加载原理（多线程）

9.js继承方式

10.jquery的链式编程原理

11.$router 和 $route

12. 前端优势

13.http状态码的区别

14.排序的方式

15.hml5的一些属性

16.webstome

17.冒号和双冒号的区别

18

window.addEventListener('load', function () {
    //页面的全部资源加载完才会去执行，包括图片，视频
})
document.addEventListener('DOMContentLoaded', function() {
    //DOM 渲染完即可执行，此时图片，视频还可能没有加载完成
})