| |
|
开发:
C++知识库
Java知识库
JavaScript
Python
PHP知识库
人工智能
区块链
大数据
移动开发
嵌入式
开发工具
数据结构与算法
开发测试
游戏开发
网络协议
系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程 数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁 |
-> JavaScript知识库 -> b站前端老猫总结面试题 -> 正文阅读 |
|
[JavaScript知识库]b站前端老猫总结面试题 |
文章目录在浏览器中输入URL并回车后都发生了什么?一、解析URL URL(Universal Resource Locator):统一资源定位符。俗称网页地址或者网址。 URL主要由以下几个部分组成: · a.传输协议 · b.服务器 · c.域名 · d.端口 · e.虚拟目录 · f.文件名 · g.锚 · h.参数 现在来讨论URL解析,当在浏览器中输入URL后,浏览器首先对拿到的URL进行识别,抽取出域名字段。 二、DNS解析 DNS解析(域名解析),DNS实际上是一个域名和IP对应的数据库。 IP地址往都难以记住,但机器间互相只认IP地址,于是人们发明了域名,让域名与IP地址之间一一对应,它们之间的转换工作称为域名解析,域名解析需要由专门的域名解析服务器来完成,整个过程是自动进行的。 可以在浏览器中输入IP地址浏览网站,也可以输入域名查询网站,虽然得出的内容是一样的,但是调用的过程不一样,输入IP地址是直接从主机上调用内容,输入域名是通过域名解析服务器指向对应的主机的IP地址,再从主机调用网站的内容。 在进行DNS解析时,会经历以下步骤: 1. 查询浏览器缓存(浏览器会缓存之前拿到的DNS 2-30分钟时间),如果没有找到,那么-> 2. 检查系统缓存,检查hosts文件,这个文件保存了一些以前访问过的网站的域名和IP的数据。它就像是一个本地的数据库。如果找到就可以直接获取目标主机的IP地址了。没有找到的话,那么-> 3. 检查路由器缓存,路由器有自己的DNS缓存,可能就包括了这在查询的内容;如果没有,那么-> 4. **查询ISP DNS 缓存:**ISP服务商DNS缓存(本地服务器缓存)那里可能有相关的内容,如果还不行的话,那么-> 5. 递归查询:从根域名服务器到顶级域名服务器再到极限域名服务器依次搜索对应目标域名的IP。 通过以上的查找,就可以获取到域名对应的IP了。接下来就是向该IP地址定位的HTTP服务器发起TCP连接。 三、浏览器与网站建立TCP连接(三次握手) 第一次握手:客户端向服务器端发送请求(SYN=1) 等待服务器确认; 第二次握手:服务器收到请求并确认,回复一个指令(SYN=1,ACK=1); 第三次握手:客户端收到服务器的回复指令并返回确认(ACK=1)。 通过三次握手,建立了客户端和服务器之间的连接,现在可以请求和传输数据了。 四、请求和传输数据 比如要通过get请求访问“http://www.dydh.org/”,通过抓包可以看到: 请求网址(url):http://www.dydh.org/ 响应头中有一个:Set-Cookie:“PHPSESSID=c882giens9f7d3oglcakhrl994; path=/”,说明浏览器中没有关于这个网站的cookie信息。 当我们下一次访问相同的网站时: 可以看到,请求头中包含了这个cookie信息, Cookie:"PHPSESSID=c882giens9f7d3oglcakhrl994; CNZZDATA1253283365=1870471808-1473694656-%7C1473694656" cookie可以用来保存一些有用的信息:Cookies如果是首次访问,会提示服务器建立用户缓存信息,如果不是,可以利用Cookies对应键值,找到相应缓存,缓存里面存放着用户名,密码和一些用户设置项。 通过这种GET请求,和服务器的响应。可以将服务器上的目标文件传输到浏览器进行渲染。 五、浏览器渲染页面 客户端拿到服务器端传输来的文件,找到HTML和MIME文件,通过MIME文件,浏览器知道要用页面渲染引擎来处理HTML文件。 1. 浏览器会解析html源码,然后创建一个 DOM树。 在DOM树中,每一个HTML标签都有一个对应的节点,并且每一个文本也都会有一个对应的文本节点。 2. 浏览器解析CSS代码,计算出最终的样式数据,形成css对象模型CSSOM。 首先会忽略非法的CSS代码,之后按照浏览器默认设置——用户设置——外链样式——内联样式——HTML中的style样式顺序进行渲染。 3. 利用DOM和CSSOM构建一个渲染树(rendering tree)。 DOM树完全和html标签一一对应,但是渲染树会忽略掉不需要渲染的元素,比如head、display:none的元素等。 而且一大段文本中的每一个行在渲染树中都是独立的一个节点。 4. 浏览器就根据渲染树直接把页面绘制到屏幕上。 你是如何理解html语义化标签的?
闭包闭包是有权访问其他函数的局部变量的一个函数。
由于在js中,变量的作用域属于函数作用域,在函数执行后,作用域就会被清理、内存说也随之被收回,但是由于闭包是建立在另一个函数内部的子函数,由于其可访问上级作用域的原因,即使上级函数执行完,作用域也不会随之销毁,这是的子函数就是闭包,也就拥有了访问上级作用域中的变量的权限,即使上级函数执行完后,作用域的值也不会被销毁。 闭包的作用?
闭包有哪些应用场景? 闭包随处可见,一个ajax的请求的成功回调,一个事件绑定的回调方法,一个setTimeout的延时回调,或者一个函数内部返回另一个匿名函数,这些都是闭包。简而言之,无论使用何种方式对函数类型的值进行传递,当函数在别处被调用时都有闭包的影子。 闭包的注意点? 由于闭包会使得函数中的变量都保存在内存中,内存消耗很大,所以不能滥用闭包,否则会造成网页的性能问题,在ie中可能导致内存泄漏,解决方法是,在退出函数之前,将不使用的局部变量全部删除。 内存泄漏: 程序的运行需要内存。对于持续运行的服务进程,必须及时释放不在用到的内存,否则占用越来越高,轻则影响系统性能,重则导致进程崩溃。不在用到的内存。没有及时释放,就叫做内存泄漏。 什么是作用域链?当代码在一个环境中执行时,会创建变量对象的一个作用域链(scope chain)。作用域链的用途,是保证对执行环境有权访问的所有变量和函数的有序访问。作用域链的前端,始终都是当前执行的代码所在环境的变量对象。如果这个环境是函数,则将其活动对象(activation object)作为变量对象。活动对象在最开始时只包含一个变量,即 arguments 对象(这个对象在全局环境中是不存在的)。作用域链中的下一个变量对象来自包含(外部)环境,而再下一个变量对象则来自下一个包含环境。这样,一直延续到全局执行环境;全局执行环境的变量对象始终都是作用域链中的最后一个对象。
对vue生命周期的理解开场可以这么说,vue实例从创建到销毁的过程就是生命周期。即指从创建、初始化数据、编译模板、挂载Dom到渲染、更新到渲染、销毁等一系列过程。它主要分为8个阶段,创建前后、载入前后、更新前后、销毁前后以及一些特殊场景的生命周期(activated keep-alive缓存的组件激活时、deactivated keep-alive缓存的组件停用时调用、errorCapured 捕获一个来自子孙组件时的错误时调用),在说一下vue生命周期的整体流程。如图
两者的相同点是都能拿到实例对象的属性和方法,但是如果放在mounted请求,有可能导致页面闪动,但是如果在页面加载前完成就不会出现此情况。 vue数据绑定的理解首先要了解vue的响应式原理:
以上回答也是不行的,我们要抓住响应式原理中三个最最要的对象: Observer、Wathcer、Dep 这三个对象的含义分别是:
当属性变化时会执行主题对象Oberver的dep.notify方法,这个方法会遍历订阅者Watcehr列表向其发送消息。watcher会执行run方法去更新视图。 接着我们需要补充的是: 模板编译过程中的指令和数据绑定都会生成Watcher实例,vm实例中的watce属性也会生成Watcher实例。 webpack中的loader和plugin的区别首先,loader是什么? 基本数据类型和引用数据类型的区别首先来说一下基本数据类型。
var 和let和const的区别从以下三个方面来说:
let和const不存在变量提升问题即它们所声明的变量一定要在声明后使用,否则报错。注意,这里的let和const,其实是有提升的,只不过是let和const具有一个暂时性死区的概念,也就是没有到其赋值时,之前就不能用。
可能面试官会问你:如何使const声明的对象内属性不可变,只可读呢?我们要知道,如果const声明了一个对象,对象里的属性是可以改变的。来看这样一段代码,因为const声明的obj只是保存着其对象的引用地址,只要地址不变,就不会出错。 ajax、fetch、axios的区别Ajax是什么,Ajax是Asynchronous JavaScript and XML的缩写。现也就是,允许浏览器与服务器通信而无须刷新当前页面的技术都被叫做Ajax。核心使用XMLHttpRequest对象。 ansyc和defer的区别在script标签内有这两个属性,async和defer。 ansyc await 对比promise的区别首先来说一下async await的优点。 cookie和session的区别cookies和session的区别。
get和post的区别GET 是将参数写在 URL 中问号(?)的后面,并用and符号(&)分隔不同参数;而 POST 是将信息存放在 Message Body 中传送,参数‘不会’显示在 URL 中,Restful规范中是这样,但post在有需要时可以把参数放URL里。GET方式需要使用Request.QueryString来取得变量的值,而POST方式通过Request.Form来获取变量的值。也就是说Get是通过地址栏来传值,而Post是通过提交表单来传值。
因为get的记录会保存在浏览器,上传日志中,而使用Post,因为数据不会记录存储在浏览器的记录和网址访问记录中,这样会有更大的安全性。 px em rem vw vh的区别px: px就是pixel的缩写,意为像素。px就是一张图片最小的一个点,一张位图就是千千万万的这样的点构成的。 http和ttpps的区别1,HTTP 是明文传输,数据都是未加密的,安全性较差,HTTPS即SSL+HTTP,数据传输过程是加密的,安全性较好。
无状态协议对于事物处理没有记忆能力,缺少状态,意味着如果后续需要处理,需要前面提供的信息。克服无状态协议缺陷的办法是方向代理(Reverse Proxy)是指通过代理服务器来接受互联网上的连接请求。然后请求转发给内部网络上的服务器,并把从服务器上得到的结果返回给互联网上请求连接的客户端,此时代理服务对外就表现为一个反向代理服务器
http通常承载与tcp之上,在http和tcp之间添加一个安全协议层(ssl或tsl)这时候就成了我们常说的https。http默认端口号为80,https默认端口号为443
在网络请求中有很多服务器,路由器的转发其中的节点可能篡改信息,如果使用https秘钥在终点站才有,https之所以比http更安全,是因为他里用了ssl/tsl协议传输,它包含证书、卸载、流量转发、负载均衡、页面适配、浏览器适配、refer传输保障了传输过程中的安全性 js中的栈和堆和队列的区别
栈先进后出,动态分配空间,一般由程序员分配释放,若程序员不释放,程序结束时可能由os回收,分配方式类似链表。堆先进先出,由操作系统自动分配释放 存放函数的参数值,局部变量的值等,其操作方式类似于数据结构中的栈。
栈只允许表尾一端进行插入和删除,队列只允许在表尾一端进行插入,在表头一端进行删除,栈是先进后出,队列是先进先出 tcp和udp的区别
那如何断开连接呢?简单的过程如下: 假设Client端发起中断连接请求,也就是发送FIN报文。Server端接到FIN报文后,意思是说 整个过程Client端所经历的状态如下:
答:虽然按道理,四个报文都发送完毕,我们可以直接进入CLOSE状态了,但是我们必须假象网络是不可靠的,有可以最后一个ACK丢失。所以TIME_WAIT状态就是用来重发可能丢失的ACK报文。 |
|
JavaScript知识库 最新文章 |
ES6的相关知识点 |
react 函数式组件 & react其他一些总结 |
Vue基础超详细 |
前端JS也可以连点成线(Vue中运用 AntVG6) |
Vue事件处理的基本使用 |
Vue后台项目的记录 (一) |
前后端分离vue跨域,devServer配置proxy代理 |
TypeScript |
初识vuex |
vue项目安装包指令收集 |
|
上一篇文章 下一篇文章 查看所有文章 |
|
开发:
C++知识库
Java知识库
JavaScript
Python
PHP知识库
人工智能
区块链
大数据
移动开发
嵌入式
开发工具
数据结构与算法
开发测试
游戏开发
网络协议
系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程 数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁 |
360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 | -2024/11/24 7:52:49- |
|
网站联系: qq:121756557 email:121756557@qq.com IT数码 |