番茄味姜糖的博客

1. Web 缓存利用 HTTP 缓存来减少访问未被修改的资源，实现页面的快速加载2. HTTP 缓存主要由 强缓存（强制缓存）和协商缓存3. 强制缓存在规定时间内有效，可直接使用，且状态码为 200，若已失效则执行协商缓存4. 协商缓存利用发送给服务器特定字段，由服务器对字段进行校验，来确定是否使用缓存，可使用则状态码为 304

概述cookielocalStoragesessionStorage大小4Kb10MB5MB兼容H4、H5H5H5访问任何窗口任何窗口同一窗口有效期手动设置无到窗口关闭存储位置浏览器和服务器浏览器浏览器与请求一起发送是否否语法复杂简易简易HTTP 无状态两次连接同一个服务器，服务器意识不到是同一个用户发送的请求这种缺少状态的方式意味着每次连接服务器都需要传输一部分用户信息，降低了传输的效率

文章目录概述发展HTTP/0.9请求过程特点HTTP/1.1请求请求行请求头空行请求体响应状态行请求头空行响应体请求方法响应状态码概述超文本传输协议（Hyper Text Transfer Protocol，HTTP）HTTP 是客户端与服务端通信必须遵守的传输协议客户端要以 HTTP 协议要求的格式把数据提交到服务器服务器要以 HTTP 协议要求的格式把数据响应给客户端发展HTTP/0.9需求是仅用于传输简单的 HTML 文件请求过程根据 IP 地址、端口和服务器建立 T

1. 浏览器请求 HTML 文件，返回后开始解析，构建 DOM2. 遇到请求 CSS 的 link 标签开始请求和解析 CSS，构建 CSSOM，同时继续解析 HTML3. 遇到请求 js 的 script 标签，请求和解析 js 文件并阻塞 HTML 文件的解析4. js 文件和 CSS 文件的返回时间无法确定，但 js 代码的运行要在构建完 CSSOM 之后5. CSSOM 构建完毕开始运行 js，js 将操作 DOM 和 CSSOM6. js 操作完毕继续解析 HTML文件构建 DOM

行级/内联元素，内容决定元素所占位置，不可通过 CSS 改变高，可通过内外边距改变宽，块级元素独占一行，可通过 CSS 改变宽高

介绍了 div 盒子居中的五种方法，其中需要设置子元素宽高的有 第二种 定位 + 负边距 第四种 定位 + 外边距自适应

> 浮动的作用是使元素站队> 浮动元素产生浮动流> 含有浮动流的元素，会被块级元素忽略> 浮动元素可被 BFC，行内元素观察到

- 圣杯布局和双飞翼布局，都是事先三栏布局的方式，区别在于如何为左右两栏的元素预留位置，以及如何让左右两栏归位- 预留位置：圣杯布局使用中间三个元素的父元素盒子设置左右两侧内边距的方式，而双飞翼布局是使中间内容元素为左右两侧设置外边距- 归位：使用负边距 margin-left: -width; 方式，使元素左移到指定位置

1. 常用选择器优先级：!important > id > class > tag2. 两条样式同时使用 !important 权重高者生效3. 同一个样式，靠后的生效4. 选择器指向同一个元素，权重相同时，按就近原则渲染5. 选择器指向不同元素，按就近原则渲染选择器权重!importantInfinity行间样式1000id100class|属性|伪类10标签|伪元素1通配符0

伪类和伪元素，这一类选择器的数量众多，通常用于很明确的目的伪类用来对用户的某种行为来进行元素选择，而伪元素是在该元素周围以某种方式创建一个元素进行操作，或者选取该元素的某一部分进行操作

概念用于在页面中选取我们想要更改样式的元素分类简单选择器：元素选择器、类选择器、ID选择器、通用选择器（通配符选择器）、组合选择器属性选择器伪类、伪元素简单选择器元素选择器用元素的名称进行选择元素div { ...}button { ...}类选择器根据元素的类名选择元素.wrapper { ...}.content { ...}ID 选择器根据元素的 id 选择元素#user { ...}#name { ...}通用选

- 文档流就是将元素放在浏览器视窗中的系统，可将放在里面的元素笼统的分为行级元素和块级元素- 所谓定位，就是使得元素脱离文档流进行放置的属性- 静态定位是元素的默认定位方式- 相对定位是相对于原来位置进行定位，虽然元素脱离了原来的位置，但它原来的位置并不会被其它元素占据- 绝对定位脱离原来位置进行定位，元素在离开原来位置后，其位置会被顺延至下一个元素- 固定定位根据视窗进行定位，常用于制作导航栏- z-index 可以确定重叠元素的排列顺序

介绍了标准盒模型和 IE 盒模型，分析了盒子模型的两个缺陷/bug：margin 塌陷和 margin 合并，并给出了解决办法

var、let、const 三种变量声明方式的区别，主要在能否重复定义，能否变量提升，值能否修改，能否形成块作用域，可否运用于循环中

概念柯里化是把接受多个参数的函数变换成接受一个单一参数（最初函数的第一个参数）的函数，并且返回接受余下的参数而且返回结果的新函数的技术第一个例子 — 参数复用// 普通封装方法// 一次传入三个参数，但像协议 protocol 这种可以复用的参数就需要传入多次function URI(protocol, hostname, pathname) { return `${protocol}${hostname}${pathname}`}// 运用柯里化封装一个 URI 函数// 这样封装

call、apply 和 bind 的主要作用，都是改变当前对象的执行期上下文；区别是，call 和 apply 是立即执行的，只在参数传递方式上有区别，而 bind 返回一个函数引用，需要加上执行符号才能执行

立即执行函数没有声明，在执行一次后释放，针对初始化功能的函数只有表达式才会被执行符号 () 执行先看两种情况function foo() { console.log('我会执行吗？') }()function foo() { console.log('现在我会执行吗？') }(1)揭晓结果第一种情况是一个函数声明后紧跟一个括号，而要执行函数应该是函数引用+括号，显然不能实现执行函数。此时这个括号仅仅是表达运算计算次序的符号第二种情况，表示执行括号中的表达式，对执行左侧声明的

执行期上下文三个重要属性变量对象 — Variable Object VO作用域链 — Scope Chainthisthis函数预编译过程中 this 指向 window全局作用域中 this 指向 windowcall 和 apply 可以改变函数运行时 this 的指向obj.func()、func() 里面的 this 指向 obj箭头函数中，this 指向其所在作用域，无论谁调用试一试// 分析以下代码执行结果var name = '222'var a =

闭包定义 一 — 内部函数总是可以访问其所在的外部函数中声明的参数和变量，即使在其外部函数被返回（寿命终结）了之后。定义 二 — 1. 即使创建它的上下文已经销毁，它仍然存在（比如，内部函数从父函数中返回）2. 在代码中引用了自由变量广义闭包：所有的函数。因为它们都在创建的时候就将上层上下文的数据保存起来了。哪怕是简单的全局变量也是如此，因为函数中访问全局变量就相当于是在访问自由变量，这个时候使用最外层的作用域。复习 — 函数执行过程var scope = "global scope"fun

作用域执行期上下文：变量对象 VO、作用域链 Scope、this作用域 ：[[scope]] 存储执行期上下文集合，函数创建时，就会保存所有父变量到其中作用域链：[[scope]] 中的执行期上下文集合呈链式连接，这种连接称为作用域链function fun1() { function fun2() {}}// 函数创建时 分析以上两个函数的作用域fun1.[[scope]] = { GO}fun2.[[scope]] = { fun1.AO GO}// 函数激活时

文章目录执行期上下文运行三部曲预编译四部曲执行期上下文当函数开始执行前一刻，会做一些准备工作，先创建一个称为执行期上下文的内部对象执行期上下文定义了函数执行时的环境多次调用一个函数会创建多个执行期上下文，函数执行完毕即销毁运行三部曲JavaScript 单线程的解释性语言语法分析预编译解释执行预编译四部曲创建 AO — Activation Object 对象，即执行期上下文寻找形参和变量声明，将变量和形参都作为 AO 的属性名，值设为 undefined形参实参相统

文章目录原型链继承借用构造函数 --- 经典继承组合继承 --- 最常用原型式继承寄生式继承寄生组合式继承原型链继承// 在 Father 构造函数中声明默认属性function Father() { this.age = 13}// 在 Father 的原型中定义方法Father.prototype.getAge = function () { console.log(this.age)}// 将 Son 的原型设为 Father 的实例 --- 继承function Son() {

文章目录原型原型