位置: IT常识 - 正文
【学姐面试宝典】前端基础篇Ⅳ（JavaScript）(学长学姐面试要注意哪些细节)
编辑：rootadmin推荐整理分享【学姐面试宝典】前端基础篇Ⅳ（JavaScript）(学长学姐面试要注意哪些细节)，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:面试官是学姐怎么称呼,学长学姐面试,面试学弟学妹问题,学长学姐面试,学长学姐面试怎么称呼,学长学姐面试怎么称呼,学长学姐面试怎么称呼,面试官是学姐怎么称呼,内容如对您有帮助，希望把文章链接给更多的朋友！
前言
博主主页👉🏻蜡笔雏田学代码 专栏链接👉🏻【前端面试专栏】 今天继续学习前端面试题相关的知识！ 感兴趣的小伙伴一起来看看吧~🤞
文章目录webpack 的作用什么是按需加载如何理解前端模块化讲讲 JS 的语言特性get 请求传参长度的误区补充 get 和 post 请求在缓存方面的区别说一下闭包图片的懒加载和预加载JS 实现跨域onmouseover 和 onmouseenter 的区别======和=========、以及 Object.is 的区别null == undefined 为什么this 的指向有哪几种写一个函数，第一秒打印 1，第二秒打印 2JS 的各种位置，比如 clientHeight、scrollHeight、offsetHeight、以及 scrollTop、clientTop的区别将原生的 ajax 封装成 promise性能优化webpack 的作用webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。当webpack 处理应用程序时，它会递归地构建一个依赖关系图(dependency graph)，其中包含应用程序需要的每个模块，然后将所有这些模块打包成一个或多个 bundle。
什么是按需加载当用户触发了动作时才加载对应的功能。触发的动作，是要看具体的业务场景而言，包括但不限于以下几个情况：鼠标点击、输入文字、拉动滚动条、鼠标移动、窗口大小更改等。加载的文件，可以是 JS、图片、CSS、HTML 等。
如何理解前端模块化
前端模块化就是复杂的文件编程一个一个独立的模块，比如 JS 文件等等，分成独立的模块有利于重用（复用性）和维护（版本迭代），这样会引来模块之间相互依赖的问题，所以有了 commonJS 规范，AMD，CMD 规范等等，以及用于 JS 打包（编译等处理）的工具 webpack。
讲讲 JS 的语言特性运行在客户端浏览器上不用预编译，直接解析执行代码是弱类型语言，较为灵活与操作系统无关，跨平台的语言脚本语言、解释性语言get 请求传参长度的误区误区：我们经常说 get 请求参数的大小存在限制，而 post 请求的参数大小是无限制的。 实际上 HTTP 协议从未规定 GET/POST 的请求长度限制是多少。对 get 请求参数的限制是来源于浏览器或 web 服务器，浏览器或 web 服务器限制了 url 的长度。 为了明确这个 概念，我们必须再次强调下面几点：
HTTP 协议未规定 GET 和 POST 的长度限制。GET 的最大长度显示是因为浏览器和 web 服务器限制了 URL 的长度。不同的浏览器和WEB 服务器，限制的最大长度不一样。要支持 IE，则最大长度为 2083byte，若只支持 Chrome，则最大长度 8182byte。补充 get 和 post 请求在缓存方面的区别get 请求类似于查找的过程，用户获取数据，可以不用每次都与数据库连接，所以可以使用缓存。post 不同，post 做的一般是修改和删除的工作，所以必须与数据库交互，所以不能使用缓存。因此 get 请求适合于请求缓存。说一下闭包一句话可以概括：闭包就是指有权访问另外一个函数作用域中的变量的函数。或者子函数在外调用， 子函数所在的父函数的作用域不会被释放。
闭包就是函数的局部变量集合，只是这些局部变量在函数返回后会继续存在。闭包就是函数的“堆栈”在函数返回后并不释放，我们也可以理解为这些函数堆栈并不在栈上分配而是在堆上分配。当在一个函数内定义另外一个函数就会产生闭包。
图片的懒加载和预加载预加载：提前加载图片，当用户需要查看时可直接从本地缓存中渲染。懒加载：懒加载的主要目的是作为服务器前端的优化，减少请求数或延迟请求数。两种技术的本质：两者的行为是相反的，一个是提前加载，一个是迟缓甚至不加载。 懒加载对服务器前端有一定的缓解压力作用，预加载则会增加服务器前端压力。JS 实现跨域JSONP：通过动态创建 script，再请求一个带参网址实现跨域通信。CORS：服务端设置 Access-Control-Allow-Origin 即可，前端无须设置，若要带 cookie 请求，前后端都需要设置。代理跨域：开启一个代理服务器，实现数据的转发。 可参考之前一篇文章详细讲解了跨域相关知识onmouseover 和 onmouseenter 的区别onmouseover：当鼠标移入元素或其子元素都会触发事件，所以有一个重复触发冒泡的过程。对应的移出事件是onmouseout。onmouseenter：当鼠标移入元素本身（不包含元素的子元素）会触发事件，也就是不会冒泡，对应的移出事件是onmouseleave。======和=========、以及 Object.is 的区别== 主要存在：强制转换成 number，null==undefined" "==0 //true"0"==0 //true" " !="0" //true123=="123" //truenull==undefined //trueObject.is（）方法判断两个值是否是相同的值，主要的区别就是+0 != -0，而 NaN======NaN (相对比=========和======的改进)null == undefined 为什么要比较相等性之前，不能将 null 和 undefined 转换成其他任何值，但 null == undefined 会返回 true 。ECMAScript 规范中是这样定义的。
this 的指向有哪几种默认绑定：全局环境中，this 默认绑定到 window。隐式绑定：一般地，被直接对象所包含的函数调用时，也称为方法调用，this 隐式绑定到该直接对象。隐式丢失：隐式丢失是指被隐式绑定的函数丢失绑定对象，从而默认绑定到 window。显式绑定：通过 call()、apply()、bind()方法把对象绑定到 this 上，叫做显式绑定。new 绑定：如果函数或者方法调用之前带有关键字new，它就构成构造函数调用。对于 this 绑定来说，称为 new 绑定。写一个函数，第一秒打印 1，第二秒打印 2//方法一：用 let 块级作用域for (let i = 1; i < 6; i++) { setTimeout(() => { console.log(i) }, 1000 * i) }//方法二：闭包for (var i = 1; i < 6; i++) { (function (i) { setTimeout(function () { console.log(i) }, 1000 * i) })(i) }JS 的各种位置，比如 clientHeight、scrollHeight、offsetHeight、以及 scrollTop、clientTop的区别clientHeight：表示可视区域的高度，不包含 border 和滚动条。offsetHeight：表示可视区域的高度，包含了 border 和滚动条。scrollHeight：表示了所有区域的高度，包含了因为滚动被隐藏的部分。clientTop：表示边框 border 的厚度，在未指定的情况下一般为 0。scrollTop：滚动后被隐藏的高度，获取对象相对于由 offsetParent 属性指定的父坐标(css定位的元素或 body 元素)距离顶端的高度。将原生的 ajax 封装成 promisevar myNewAjax = function (url) { return new Promise(function (resolve, reject) { var xhr = new XMLHttpRequest(); xhr.open('get', url); xhr.send(data); xhr.onreadystatechange = function () { if (xhr.status == 200 && readyState == 4) { var json = JSON.parse(xhr.responseText); resolve(json) } else if (xhr.readyState == 4 && xhr.status != 200) { reject('error'); } } })}性能优化减少 HTTP 请求使用内容发布网络（CDN）添加本地缓存压缩资源文件将 CSS 样式表放在顶部，把 javascript 放在底部（浏览器的运行机制决定）避免使用 CSS 表达式减少 DNS 查询使用外部 javascript 和 CSS避免重定向图片 lazyLoad今天的分享就到这里啦✨\textcolor{red}{今天的分享就到这里啦✨}今天的分享就到这里啦✨
原创不易，还希望各位大佬支持一下\textcolor{blue}{原创不易，还希望各位大佬支持一下}原创不易，还希望各位大佬支持一下
🤞 点赞，你的认可是我创作的动力！\textcolor{green}{点赞，你的认可是我创作的动力！}点赞，你的认可是我创作的动力！
⭐️ 收藏，你的青睐是我努力的方向！\textcolor{green}{收藏，你的青睐是我努力的方向！}收藏，你的青睐是我努力的方向！
✏️ 评论，你的意见是我进步的财富！\textcolor{green}{评论，你的意见是我进步的财富！}评论，你的意见是我进步的财富！
上一篇：javascript常用的数组方法(javascript常用的数据类型)
下一篇：使用您自己的计算机训练 Stable Diffusion 和 Bloom (175B) 等模型(让我用用你的计算机)
