• JavaScript面试必问 上

    文章目录

    前言

    本文讲解了JavaScript面试时会问的几种问题，如果觉得对你有所帮助，请三连支持博主，你的支持就是我更新的动力。

    以下是本篇文章正文内容

    一、JS延迟加载有哪些方式

    为什么需要延迟加载

    js 的加载、解析和执行会阻塞页面的渲染过程，因此我们希望 js 脚本能够尽可能的延迟加载，提高页面的渲染速度

    延迟加载Js的方法其实有很多这里我们之讲async跟defer 属性，首先我们先看一个案例。

    <!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript" src="new_file.js">
			
		</script>
	</head>
	<body>
		<div id="box">
			1111
		</div>
	</body>
</html>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    console.log()

    • 1

    结果：

    在这里插入图片描述
    可以看到没有办法获取到，但是我们加入了async跟defer 属性就可以获取的到了。

    <!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script async type="text/javascript" src="new_file.js">
			
		</script>
	</head>
	<body>
		<div id="box">
			1111
		</div>
	</body>
</html>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15

    在这里插入图片描述

    那async跟defer 的区别是什么?

    async

    async是和html同步解析的，不是顺次执行js脚本（谁先加载完谁执行）

    官方语言：
    async 属性是一个布尔属性。

    async 属性一旦脚本可用，则会异步执行。

    注意：async 属性仅适用于外部脚本（只有在使用 src 属性时）。

    注意：有多种执行外部脚本的方法：

    如果 async=“async”：脚本相对于页面的其余部分异步地执行（当页面继续进行解析时，脚本将被执行）
    如果不使用 async 且 defer=“defer”：脚本将在页面完成解析时执行
    如果既不使用 async 也不使用 defer：在浏览器继续解析页面之前，立即读取并执行脚本

    defer

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

    官方语言：
    defer 属性是一个布尔属性。

    defer 属性规定当页面已完成加载后，才会执行脚本。

    注意：defer 属性仅适用于外部脚本（只有在使用 src 属性时）。

    注意：有多种执行外部脚本的方法：

    如果 async=“async”：脚本相对于页面的其余部分异步地执行（当页面继续进行解析时，脚本将被执行）
    如果不使用 async 且 defer=“defer”：脚本将在页面完成解析时执行
    如果既不使用 async 也不使用 defer：在浏览器继续解析页面之前，立即读取并执行脚本

    二、null和undefined的区别

    大家都知道null是空 而 undefined是未定义的 ，但是很多人都不知道如何用简单明了的语言来讲述他们的区别，那么JavaScript语言为什么会设置两个表示“无”的值呢？

    原因

    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.

    三、== 和 ===的不同

    首先我们都知道两个都是来做比较的，是来判断两边是否相等的

    == ：比较的是值

    如果两个值类型相同，再进行三个等号(===)的比较
    如果两个值类型不同，也有可能相等、需根据以下规则进行类型转换在比较：
    如果一个是null，一个是undefined，那么相等
    如果一个是字符串，一个是数值，把字符串转换成数值之后再进行比较

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

    • 1
    • 2
    • 3
    • 4

    在这里插入图片描述

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

    (1)如果类型不同，就一定不相等
    (2)如果两个都是数值，并且是同一个值，那么相等；如果其中至少一个是NaN.那么不相等。（判断一个值是否是NaN、只能使用isNaN()来判断)
    (3)如果两个都是字符串，每个位置的字符都一样，那么相等，否则不相等。
    (4)如果两个值都是true，或是false，那么相等
    (5)如果两个值都引用同一个对象或是函数，那么相等，否则不相等
    (6)如果两个值都是null，或是undefined.那么相等

    完

    在这里插入图片描述

  • 相关阅读:
    2023年最全的外贸建站新手教程
    （附源码）spring boot流浪动物救助系统 毕业设计 180920
    DGIOT短信字段与腾讯云服务器短信字段的对应关系
    nginx
    基于SSM的教师办公管理的设计与实现（有报告）。Javaee项目。
    使用 PyTorch 实现 Word2Vec 中Skip-gram 模型
    正则表达式相关概念
    shell 的 ${ }中 ##、%%、// 使用方法及举例
    Redis
    web前端期末大作业：HTML+CSS+JavaScript绿色的盆栽花店网站响应式模板 大学生鲜花网页设计
  • 原文地址：https://blog.csdn.net/weixin_71170351/article/details/125388655