输入url到页面渲染,new做了什么事情,简单描述原型链

76 阅读2分钟

输入url到页面渲染

1.DNS解析,将域名解析成IP地址
2.建立tcp连接(tcp的三次握手)

    什么是tcp的三次握手:
    第一次握手:由浏览器发起,告诉服务器,我要发送请求了。<br/>
    第二次握手:由服务器发起,告诉浏览器我准备接受了,你赶紧发送请求吧。<br/>
    第三次握手:由浏览器发起,告诉服务器,我马上就发请求了,准备好接受吧

3.发送请求:也就是请求报文(指的是,http协议的通信内容)
4.接受报文(也就是响应报文)
5.渲染页面:

    1.遇到HTML标记,浏览器调用HTML解析器解析成token并构建dom树。<br/>
    2.遇到style/link标记,浏览器调用css解析器,处理css标记并构建css树。<br/>
    3.遇到script标记,调用JavaScript解析器,处理script代码。<br/>
    4.将dom树和css树合并成一个渲染树。<br/>
    5.根据渲染树来计算布局,计算每个节点的几何信息(布局)。<br/>
    6.将各个节点颜色绘制到屏幕上(渲染)

6.断开连接:(Tcp的四次挥手)

    第一次挥手:由浏览器发起,发送给服务器,我东西发送完了(请求报文),你准备关闭把。<br/>
    第二次挥手:由服务器发起,告诉浏览器,我东西接收完了(请求报文),我准备关闭了,你也准备关闭把。<br/>
    第三次挥手:由服务器发起,告诉浏览器,我东西发送完了(响应报文),你准备关闭吧。<br/>
    第四次挥手:由浏览器发起,告诉服务器,我东西接收完了(响应报文),我准备关闭了,你也准备吧。

new做了什么事情

简单来说:会有如下的步骤

  1. 创建临时对象
  2. this = 临时对象
  3. this. __ proto __ === 构造函数的prototype
  4. 执行构造函数
  5. return this

简单描述原型链

实例的__proto__指向构造函数的prototype,而constructor(构造函数)又指向构造函数本身
实例. __ proto __ === 构造函数.prototype === Object. __ proto __ === null