2024年最全啃掉前端JavaScript面试题_前端面试懒加载(1)，2024年最新阿里巴巴前端面经

最新推荐文章于 2024-10-15 15:24:52 发布

2401_84418948

最新推荐文章于 2024-10-15 15:24:52 发布

阅读量789

点赞数 17

分类专栏：程序员文章标签：前端面试学习

本文链接：https://blog.csdn.net/2401_84418948/article/details/138863207

版权

程序员专栏收录该内容

188 篇文章 0 订阅

订阅专栏

后话

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

对于面试，说几句个人观点。

面试，说到底是一种考试。正如我们一直批判应试教育脱离教育的本质，为了面试学习技术也脱离了技术的初心。但考试对于人才选拔的有效性是毋庸置疑的，几千年来一直如此。除非你有实力向公司证明你足够优秀，否则，还是得乖乖准备面试。这也并不妨碍你在通过面试之后按自己的方式学习。
其实在面试准备阶段，个人的收获是很大的，我也认为这是一种不错的学习方式。首先，面试问题大部分基础而且深入，这些是平时工作的基础。就好像我们之前一直不明白学习语文的意义，但它的意义就在每天的谈话间。

所谓面试造火箭，工作拧螺丝。面试往往有更高的要求，也迫使我们更专心更深入地去学习一些知识，也何尝不是一种好事。

在DOM标准事件模型中，是先捕获后冒泡，但是如果反向，对于同一个事件，监听捕获和冒泡，分别对应相应的处理函数，监听到捕获事件，先暂缓执行，直到冒泡事件被捕获后再执行捕获之前的操作。

6.事件委托

事件委托是指，不再事件的发生地上设置监听函数，而是在其父元素上设置监听函数，通过事件冒泡，父元素可以监听到子元素上事件的触发，通过判断事件发生元素DOM的类型，来做出不同的响应。

比如：在ul上添加事件监听，不在li上添加事件监听。

7.图片的懒加载和预加载

预加载：提前加载图片，当用户需要查看时可以直接从本地缓存中渲染。
懒加载：懒加载的主要目的是作为服务器前端的优化，减少请求数或延迟请求数。
两种技术的本质：两者的行为是相反的，一个是提前加载，一个是延缓甚至不加载。
懒加载对服务器前端有一定的缓解压力的作用，预加载则会增加服务器前端压力。

8.mouseover和mouseenter

**mouseover：**当鼠标移入元素或其子元素都会触发事件，所以有一个重复触发，冒泡的过程。对应移除mouseout；

**mouseenter：**当鼠标移除元素本身会触发事件，不包含元素的子元素，没有冒泡过程。对应移除mouseleave；

9.js的new操作符做了哪些事情

new操作符新建了一个空对象，这个对象原型指向构造函数的prototype，执行构造函数后返回这个对象。

10.改变函数内部this指针的指向函数（bind,apply,call区别）

通过apply和call改变函数的this指向，他们两个函数的第一个函数都是一样的表示要改变指向的那个对象，第二个参数，apply是数组，而call则是arg1，arg2这种形式。
通过bind改变this作用域会返回一个新的函数，这个函数不会马上执行。

11.js拖拽功能的实现

首先是三个事件，分别是mousedown，mousemove，mouseup
当鼠标点击按下的时候，需要一个tag标识此时已经按下，可以执行mousemove里面的具体方法。
clientX,clientY标识是鼠标的坐标，分别标识横坐标和纵坐标
offsetX和offsetY来表示初始的横纵坐标

12.异步加载js的方法

defer：通过给<script>标签设置defer属性，将脚本文件设置为延迟加载，当浏览器遇到带有defer属性的<script>标签时，会再开启一个线程去下载js文件，同时继续解析HTML文档，等等HTML全部解析完毕DOM加载完成之后，再去执行加载好的js文件。
这种方式只适用于引用外部js文件的<script>标签，可以保证多个js文件的执行顺序就是它们在页面中出现的顺序，但是要注意，添加defer属性的js文件不应该使用document.write方法。
async：和defer属性类似，也是会开启一个线程去下载js文件，但和defer不同的时，它会在下载完成后立刻执行，而不是会等到DOM加载完成之后再执行，所以还是有可能会造成阻塞。
同样的，async也是只适用于外部js文件，也不能在js中使用document.write方法，但是对多个带有async的js文件，它不能像defer那样保证按顺序执行，它是哪个js文件先下载完就先执行哪个。