没有合适的资源?快使用搜索试试~ 我知道了~
首页前端面试八股文-超详细的前端基础知识的应用与技巧
前端面试宝典:巩固基础知识与框架技巧
需积分: 0 6 下载量 178 浏览量
更新于2024-06-13
1
收藏 1.01MB PDF 举报
"《前端面试八股文-超详细的前端基础知识的应用与技巧》是一份专门为前端开发者设计的面试复习资料,内容涵盖了HTML、CSS、JavaScript基础及进阶,以及React和Vue等热门前端框架的面试问题。这份资源强调实战应用和理解,适合求职者准备前端岗位面试,经验丰富的前端工程师强化知识体系,以及初学者了解前端核心要点。 JavaScript部分详细讲解了八种数据类型,包括原始数据类型(如Undefined、Null、Boolean、Number、String)和引用数据类型(如Object、Symbol、BigInt)。原始数据类型存储在栈中,占用空间小且固定,适合频繁使用的数据。引用数据类型则存储在堆中,通过指针指向对象,占用空间大且大小不固定。例如,Symbol用于解决全局变量冲突,BigInt则允许处理超出Number范围的大整数。 资源还介绍了数据类型检测的方法,如使用`typeof`关键字检查类型,虽然数组和对象会被误判为`object`,但可以通过`instanceof`来精确判断对象是否为某个特定类型,包括其原型链。同时,讲解了JavaScript中的内存管理,如栈区主要用于存放函数参数和局部变量,操作遵循先进后出原则,而堆区主要由开发者管理,用于存储对象实例。 通过学习本资源,开发者不仅能掌握JavaScript基础,还能提升算法和数据结构的理解,增强编程能力和逻辑思维。在阅读时,作者建议边做题边看解析,对于不清楚的问题,先独立思考,再参考答案,同时做好笔记整理,以便于巩固所学知识,并关注前端领域的最新动态。这份资源对于提升前端面试表现和职业发展具有显著价值。"
资源详情
资源推荐
![](https://csdnimg.cn/release/download_crawler_static/89246121/bg10.jpg)
的脚本按规范来说最后是顺序执行的,但是在一些浏览器中可能不是
这样。
async 属性:给 js 脚本添加 async 属性,这个属性会使脚本异步
加载,不会阻塞页面的解析过程,但是当脚本加载完成后立即执行 js
脚本,这个时候如果文档没有解析完成的话同样会阻塞。多个 async
属性的脚本的执行顺序是不可预测的,一般不会按照代码的顺序依次
执行。
动态创建 DOM 方式:动态创建 DOM 标签的方式,可以对文档的加载
事件进行监听,当文档加载完成后再动态的创建 script 标签来引入
js 脚本。
使用 setTimeout 延迟方法:设置一个定时器来延迟加载 js 脚本文
件
让 JS 最后加载:将 js 脚本放在文档的底部,来使 js 脚本尽可能
的在最后来加载执行。
18. 什么是 DOM 和 BOM?
DOM 指的是文档对象模型,它指的是把文档当做一个对象,这个对象
主要定义了处理网页内容的方法和接口。
BOM 指的是浏览器对象模型,它指的是把浏览器当做一个对象来对待,
这个对象主要定义了与浏览器进行交互的法和接口。BOM 的核心是
window,而 window 对象具有双重角色,它既是通过 js 访问浏览器
窗口的一个接口,又是一个 Global(全局)对象。这意味着在网页
中定义的任何对象,变量和函数,都作为全局对象的一个属性或者方
法存在。window 对象含有 location 对象、navigator 对象、screen
14
![](https://csdnimg.cn/release/download_crawler_static/89246121/bg11.jpg)
对象等子对象,并且 DOM 的最根本的对象 document 对象也是 BOM
的 window 对象的子对象。
19. escape、encodeURI、encodeURIComponent 的区别
encodeURI 是对整个 URI 进行转义,将 URI 中的非法字符转换为合
法字符,所以对于一些在 URI 中有特殊意义的字符不会进行转义。
encodeURIComponent 是对 URI 的组成部分进行转义,所以一些特殊
字符也会得到转义。
escape 和 encodeURI 的作用相同,不过它们对于 unicode 编码为
0xff 之外字符的时候会有区别,escape 是直接在字符的 unicode
编码前加上 %u,而 encodeURI 首先会将字符转换为 UTF-8 的格式,
再在每个字节前加上 %。
20. 对 AJAX 的理解,实现一个 AJAX 请求
AJAX 是 Asynchronous JavaScript and XML 的缩写,指的是通过
JavaScript 的 异步通信,从服务器获取 XML 文档从中提取数据,
再更新当前网页的对应部分,而不用刷新整个网页。
创建 AJAX 请求的步骤:
创建一个 XMLHttpRequest 对象。
在这个对象上使用 open 方法创建一个 HTTP 请求,open 方法所需
要的参数是请求的方法、请求的地址、是否异步和用户的认证信息。
在发起请求前,可以为这个对象添加一些信息和监听函数。比如说可
以通过 setRequestHeader 方法来为请求添加头信息。还可以为这个
对象添加一个状态监听函数。一个 XMLHttpRequest 对象一共有 5
个状态,当它的状态变化时会触发 onreadystatechange 事件,可以
15
![](https://csdnimg.cn/release/download_crawler_static/89246121/bg12.jpg)
通过设置监听函数,来处理请求成功后的结果。当对象的 readyState
变为 4 的时候,代表服务器返回的数据接收完成,这个时候可以通
过判断请求的状态,如果状态是 2xx 或者 304 的话则代表返回正常。
这个时候就可以通过 response 中的数据来对页面进行更新了。
当对象的属性和监听函数设置完成后,最后调用 sent 方法来向服务
器发起请求,可以传入参数作为发送的数据体。
使用 Promise 封装 AJAX:
16
![](https://csdnimg.cn/release/download_crawler_static/89246121/bg13.jpg)
21. 什么是尾调用,使用尾调用有什么好处?
尾调用指的是函数的最后一步调用另一个函数。代码执行是基于执行
栈的,所以当在一个函数里调用另一个函数时,会保留当前的执行上
下文,然后再新建另外一个执行上下文加入栈中。使用尾调用的话,
因为已经是函数的最后一步,所以这时可以不必再保留当前的执行上
下文,从而节省了内存,这就是尾调用优化。但是 ES6 的尾调用优
化只在严格模式下开启,正常模式是无效的。
22. ES6 模块与 CommonJS 模块有什么异同?
ES6 Module 和 CommonJS 模块的区别:
CommonJS 是对模块的浅拷⻉,ES6 Module 是对模块的引⽤,即 ES6
Module 只存只读,不能改变其值,也 是指针指向不能变,类似 const;
import 的接⼝是 read-only(只读状态),不能修改其变量值。 即
不能修改其变量的指针指向,但可以改变变量内部指针指向,可以对
commonJS 对重新赋值(改变指针指向),但是对 ES6 Module 赋值会
编译报错。
ES6 Module 和 CommonJS 模块的共同点:
CommonJS 和 ES6 Module 都可以对引⼊的对象进⾏赋值,即对对象内
部属性的值进⾏改变。
23. for...in 和 for...of 的区别
for…of 是 ES6 新增的遍历方式,允许遍历一个含有 iterator 接口
的数据结构(数组、对象等)并且返回各项的值,和 ES3 中的 for…
in 的区别如下
for…of 遍历获取的是对象的键值,for…in 获取的是对象的键名;
![](https://csdnimg.cn/release/download_crawler_static/89246121/bg14.jpg)
17
剩余203页未读,继续阅读
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![docx](https://img-home.csdnimg.cn/images/20210720083331.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://profile-avatar.csdnimg.cn/c6d9d943a7504fada11278970215eaa1_2201_75539691.jpg!1)
![](https://csdnimg.cn/release/wenkucmsfe/public/img/user-vip.1c89f3c5.png)
小z前端笔记
- 粉丝: 5964
- 资源: 13
上传资源 快速赚钱
我的内容管理 收起
我的资源 快来上传第一个资源
我的收益
登录查看自己的收益我的积分 登录查看自己的积分
我的C币 登录后查看C币余额
我的收藏
我的下载
下载帮助
![](https://csdnimg.cn/release/wenkucmsfe/public/img/voice.245cc511.png)
会员权益专享
最新资源
- GO婚礼设计创业计划:技术驱动的婚庆服务
- 微信行业发展现状及未来发展趋势分析
- 信息技术在教育中的融合与应用策略
- 微信小程序设计规范:友好、清晰的用户体验指南
- 联鼎医疗:三级甲等医院全面容灾备份方案设计
- 构建数据指标体系:电商、社区、金融APP案例分析
- 信息技术:六年级学生制作多媒体配乐古诗教程
- 六年级学生PowerPoint音乐动画实战:制作配乐古诗演示
- 信息技术教学设计:特点与策略
- Word中制作课程表:信息技术教学设计
- Word教学:制作课程表,掌握表格基础知识
- 信息技术教研活动年度总结与成果
- 香格里拉旅游网设计解读:机遇与挑战并存
- 助理电子商务师模拟试题:设计与技术详解
- 计算机网络技术专业教学资源库建设与深圳IT产业结合
- 微信小程序开发:网络与媒体API详解
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈
![](https://img-home.csdnimg.cn/images/20220527035711.png)
![](https://img-home.csdnimg.cn/images/20220527035711.png)
![](https://img-home.csdnimg.cn/images/20220527035111.png)
安全验证
文档复制为VIP权益,开通VIP直接复制
![](https://csdnimg.cn/release/wenkucmsfe/public/img/green-success.6a4acb44.png)