阿里云——前端暑期实习一面面经( 2022-03-18 )

阿里云——前端暑期实习一面面经( 2022-03-18 )

1.自我介绍

2.你对成为前端工程师未来有什么思考?

3.你了解什么前端大牛?(我说了尤大,阮一峰,玉伯,朴灵之类的,尤大说的多一些)

4.前端框架为什么能流行?(我自己用的vue,说了一下优点)

5.http的请求方法(post,put,get,delete,patch,我说了这几个)

HTTP1.0定义了三种请求方法: GET, POST 和 HEAD方法。

HTTP1.1新增了五种请求方法:OPTIONS, PUT, DELETE, TRACE 和CONNECT 方法

  1. OPTIONS

返回服务器针对特定资源所支持的HTTP请求方法,也可以利用向web服务器发送‘*’的请求来测试服务器的功能性

  1. HEAD

向服务器索与GET请求相一致的响应,只不过响应体将不会被返回。这一方法可以再不必传输整个响应内容的情况下,就可以获取包含在响应小消息头中的元信息。

  1. GET

向特定的资源发出请求。注意:GET方法不应当被用于产生“副作用”的操作中,例如在Web Application中,其中一个原因是GET可能会被网络蜘蛛等随意访问。Loadrunner中对应get请求函数:web_link和web_url

  1. POST

向指定资源提交数据进行处理请求(例如提交表单或者上传文件)。数据被包含在请求体中。POST请求可能会导致新的资源的建立和/或已有资源的修改。 Loadrunner中对应POST请求函数:web_submit_data,web_submit_form

  1. PUT

向指定资源位置上传其最新内容

  1. DELETE

请求服务器删除Request-URL所标识的资源

  1. TRACE

回显服务器收到的请求,主要用于测试或诊断

  1. CONNECT

HTTP/1.1协议中预留给能够将连接改为管道方式的代理服务器。

注意:

  • 方法名称是区分大小写的,当某个请求所针对的资源不支持对应的请求方法的时候,服务器应当返回状态码405(Mothod Not Allowed);当服务器不认识或者不支持对应的请求方法时,应返回状态码501(Not Implemented)。
  • HTTP服务器至少应该实现GET和HEAD/POST方法,其他方法都是可选的,此外除上述方法,特定的HTTP服务器支持扩展自定义的方法。

https://www.cnblogs.com/weibanggang/p/9454581.html

6.进程和线程?

  1. 进程是资源分配的最小单位,线程是程序执行的最小单位(资源调度的最小单位)
  2. 进程有自己的独立地址空间,每启动一个进程,系统就会为它分配地址空间,建立数据表来维护代码段、堆栈段和数据段,这种操作非常昂贵。
    而线程是共享进程中的数据的,使用相同的地址空间,因此CPU切换一个线程的花费远比进程要小很多,同时创建一个线程的开销也比进程要小很多。
  3. 线程之间的通信更方便,同一进程下的线程共享全局变量、静态变量等数据,而进程之间的通信需要以通信的方式(IPC)进行。不过如何处理好同步与互斥是编写多线程程序的难点。
  4. 但是多进程程序更健壮,多线程程序只要有一个线程死掉,整个进程也死掉了,而一个进程死掉并不会对另外一个进程造成影响,因为进程有自己独立的地址空间。

7.三次握手

刚开始客户端处于 Closed 的状态,服务端处于 Listen 状态,进行三次握手:

  • 第一次握手:客服端给服务端发一个SYN报文,并指明客服端的初始化序列号ISN©。此时客服端处于SYN_SEND状态。
    首部的同步位SYN=1,初始序号seq=x,SYN=1的报文段不能携带数据,但是要消耗掉一个序号。

  • 第二次握手:服务端收到客服端的SYN报文之后,会以自己的SYN报文作为应答,并且也是指定了自己的初始化序列号ISN(s)。同时会把客服端的ISN+1作为ACK的值,表示自己已经收到了客服端的SYN,此时服务器处于SYN_RCVD的状态。
    在确认报文段中SYN=1,ACK=1,确认号ack=x+1,初始序号seq=y。

  • 第三次握手:客服端收到SYN报文之后,会发送一个ACK报文,当然,也是一样把服务器的ISN+1作为ACK的值,表示已经收到了服务端的SYN报文,此时客服端处于ESTABLISHED状态。服务器收到ACK报文之后,也处于ESTABLISHED状态,此时,双方已建立起了连接。
    确认报文段ACK=1,确认号ack=y+1,序号seq=x+1(初始为seq=x,第二个报文段所以要+1),ACK报文段可以携带数据,不携带数据则不消耗序号。
    发送一个SYN的一端将执行主动打开(active open),接收这个SYN并发回下一个SYN的另一端执行被动打开(passive open)。

8.https建立的过程?

  • 客服端发起https连接

当用户在浏览器输入地址的时候,浏览器去到DNS服务器获取此url对应的ip,然后客户端连接上服务端的443端口,将此请求发送给到服务端,此时客户端同时将自己支持的加密算法带给服务端;

  • 服务端发送证书

    在讲这一段之前插播一条小知识点:私钥加密的密文只有公钥才能解开;公钥加密的密文只有私钥才能解开。
    服务端收到这套加密算法的时候,和自己支持的加密算法进行对比(也就是和自己的私钥进行对比),如果不符合,就断开连接;如果符合,服务端就将SSL证书发送给客户端,此证书中包括了数字证书包含的内容:1、证书颁发机构;2、使用机构;3、公钥;4、有效期;5、签名算法;6、指纹算法;7、指纹。

    这里服务端发送的东西是用私钥进行加密的,公钥都能解开,并不能保证发送的数据包不被别人看到,所以后面的过程会和客户端商量选择一个对称加密来对传输的数据进行加密。非对称、对称加解密相关问题

  • 客户端验证服务端发来的证书

  1. 验证证书

客户端验证收到的证书,包括发布机构是否合法、过期,证书中包含的网址是否与当前访问网址一致等等。
2. 生成随机数(此随机数就是后面用的对称加密的私钥)

客户端验证证书无误后(或者接受了不信任的证书),会生成一个随机数,用服务端发过来的公钥进行加密。如此一来,此随机数只有服务端的私钥能解开了。

  1. 生成握手信息

用证书中的签名hash算法取握手信息的hash值,然后用生成的随机数将握手信息和握手信息的hash值进行加密,然后用公钥将随机数进行加密后,一起发送给服务端。其中计算握手信息的hash值,目的是为了保证传回到服务端的握手信息没有被篡改。

  1. 服务端接收随机数加密的信息,并解密得到随机数,验证握手信息是否被篡改。

服务端收到客户端传回来的用随机数加密的信息后,先用私钥解密随机数,然后用解密得到的随机数解密握手信息,获取握手信息和握手信息的hash值,计算自己发送的握手信息的hash值,与客户端传回来的进行对比验证。

如果验证无误,同样使用随机字符串加密握手信息和握手信息hash值发回给到客户端

  1. 客户端验证服务端发送回来的握手信息,完成握手

客户端收到服务端发送过来的握手信息后,用开始自己生成的随机数进行解密,验证被随机数加密的握手信息和握手信息hash值。

验证无误后,握手过程就完成了,从此服务端和客户端就开始用那串随机数进行对称加密通信了(常用的对称加密算法有AES)。

9.从输入url到浏览器显示页面发生了什么?

域名解析 --> 发起TCP的3次握手 --> 建立TCP连接后发起http请求 --> 服务器响应http请求,浏览器得到html代码 --> 浏览器解析html代码,并请求html代码中的资源(如js、css、图片等) --> 浏览器对页面进行渲染呈现给用户。

10.js数组

11.promise方法加三种状态

  • pending - 进行中
  • fulfilled - 成功
  • rejected - 失败

Promise对象,可以将异步操作以同步操作的流程表达出来,避免了层层嵌套的回调函数,但Promise对象的状态不受外界影响,Promise对象代表一个异步操作,有三种状态:pending(进行中)、fulfilled(已成功)和rejected(已失败),只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态,这也是Promise这个名字的由来,它的英语意思就是“承诺”,表示其他手段无法改变。

状态的改变(或者说决议)不可逆,一旦决议就不能再更改。

任何时候都可以得到这个结果,Promise对象的状态改变,只有两种可能:从pending变为fulfilled和从pending变为rejected,只要这两种情况发生,状态就凝固了,不会再变了,会一直保持这个结果,这时就称为 resolved(已定型),如果改变已经发生了,你再对Promise对象添加回调函数,也会立即得到这个结果,这与事件(Event)完全不同,事件的特点是,如果你错过了它,再去监听,是得不到结果的。

https://www.jianshu.com/p/6abbfc6d2332

12.object方法

  • Object.assign(target,source1,source2,…)

该方法主要用于对象的合并,将源对象source的所有可枚举属性合并到目标对象target上,此方法只拷贝源对象的自身属性,不拷贝继承的属性。

  • Object.create(prototype,[propertiesObject])

使用指定的原型对象及其属性去创建一个新的对象

  • Object.defineProperties(obj,props)

直接在一个对象上定义新的属性或修改现有属性,并返回该对象。

  • Object.defineProperty(obj,prop,descriptor)

在一个对象上定义一个新属性,或者修改一个对象的现有属性, 并返回这个对象。

  • Object.keys(obj)

返回一个由一个给定对象的自身可枚举属性组成的数组,数组中属性名的排列顺序和使用 for…in 循环遍历该对象时返回的顺序一致 (两者的主要区别是 一个 for-in 循环还会枚举其原型链上的属性)。

  • Object.values()

方法返回一个给定对象自己的所有可枚举属性值的数组,值的顺序与使用for…in循环的顺序相同 ( 区别在于 for-in 循环枚举原型链中的属性 )。

  • Object.entries()

返回一个给定对象自身可枚举属性的键值对数组,其排列与使用 for…in 循环遍历该对象时返回的顺序一致(区别在于 for-in 循环也枚举原型链中的属性)。

  • hasOwnProperty()

判断对象自身属性中是否具有指定的属性。

  • Object.getOwnPropertyNames()

返回一个由指定对象的所有自身属性的属性名(包括不可枚举属性但不包括Symbol值作为名称的属性)组成的数组。

  • isPrototypeOf()

判断一个对象是否存在于另一个对象的原型链上。

  • Object.setPrototypeOf(obj,prototype)

设置对象的原型对象

  • Object.is()

判断两个值是否相同。

  • Object.freeze()

冻结一个对象,冻结指的是不能向这个对象添加新的属性,不能修改其已有属性的值,不能删除已有属性,以及不能修改该对象已有属性的可枚举性、可配置性、可写性。也就是说,这个对象永远是不可变的。该方法返回被冻结的对象。

  • Object.isFrozen()

判断一个对象是否被冻结。

  • Object.preventExtensions()

对象不能再添加新的属性。可修改,删除现有属性,不能添加新属性。

https://www.cnblogs.com/mopagunda/p/8328084.html

13.this指向

函数的调用方式决定了 this 的指向不同

  • 普通函数调用,此时 this 指向 window

  • 构造函数调用, 此时 this 指向 实例对象

  • 对象方法调用, 此时 this 指向 该方法所属的对象

  • 通过事件绑定的方法, 此时 this 指向 绑定事件的对象

  • 定时器函数, 此时 this 指向 window

更改this指向的三个方法

  • call() 方法

  • apply() 方法

  • bind()方法

https://blog.csdn.net/xuehangongzi/article/details/80841167

14.bind和apply区别?

bind和apply,call的区别在于,bind返回一个方法,用于后面调用,apply和call会直接执行

https://www.cnblogs.com/fiona-zhong/p/11369534.html

15.事件冒泡事件捕获的不同

  • 冒泡事件:是指子元素向父元素传递的过程
  • 捕获事件:是指父元素向子元素传递的过程

16.eventloop

Event Loop即事件循环,是指浏览器或Node的一种解决javaScript单线程运行时不会阻塞的一种机制,也就是我们经常使用异步的原理。

  1. 所有同步任务都在主线程上执行,形成一个执行栈(execution context stack)。
  2. 主线程之外,还存在一个"任务队列"(task queue)。只要异步任务有了运行结果,就在"任务队列"之中放置一个事件。
  3. 一旦"执行栈"中的所有同步任务执行完毕,系统就会读取"任务队列",看看里面有哪些事件。那些对应的异步任务,于是结束等待状态,进入执行栈,开始执行。
  4. 主线程不断重复上面的第三步。
    主线程从任务队列中读取事件,这个过程是不断循环的,所以整个的运行机制称为event loop

https://www.jianshu.com/p/9f1fbe935b06

17.交流一下想问啥

你可能感兴趣的:(公司面试,#,阿里,javascript,typescript,前端,前端框架)