1、 通过jsonp跨域
2、 document.domain + iframe跨域
3、 location.hash + iframe
4、 window.name + iframe跨域
5、 postMessage跨域
6、 跨域资源共享（CORS）
7、 nginx代理跨域
8、 nodejs中间件代理跨域
9、 WebSocket协议跨域
各屏幕的适配，有两种方案，flexible + rem 与 vw。
1、0.5px边框
2、使用border-image实现
3、使用background-image实现
4、多背景渐变实现
5、使用box-shadow模拟边框
6、viewport + rem 实现
7、伪类 + transform 实现
Flexbox 布局（也叫Flex布局，弹性盒子布局）目标在于提供一个更有效地布局、对齐方式，并且能够使父元素在子元素的大小未知或动态变化情况下仍然能够分配好子元素之间的间隙。
Flex布局的主要思想是使父元素能够调节子元素的高度、宽度和排布的顺序，从而能够最好地适应可用布局空间（能够适应不同的设备和不同大小的屏幕）。设定为flex布局的元素能够放大子元素使之尽可能填充可用空间，也可以收缩子元素使之不溢出。
最重要的是，与传统布局中块状元素按照垂直方向摆放，行内元素按照水平方向摆放相比，flex布局是无方向的。传统布局在应对大型复杂的布局时缺乏灵活性，特别是在改变方向、改变大小、伸展、收缩等等方面。
vertical-align只对 table-cell 以及 inline-element 起作用，vertical-align 的值是相对于其父元素的，父元素必须是行内元素
line-hight
CSS表格法适用于table-cell配合vertical-align
绝对定位和负边距法
绝对定位和拉伸法
浮动元素法
相对于margin left/top，实现居中，浏览器不会对原文档重新布局（重新计算位置与尺寸），只会通过GPU进行页面渲染，从而节省CPU资源，不会阻塞主线程JS代码的执行。
浅拷贝：通常我们重新对变量赋值a=b，只是将b的内存地址给了a，ab公用一个内存地址，在使用中往往出现修改b，a也被修改了。
深拷贝：一般可以使用JSON互转实现，或者for循，如果变量纯在更深层次对象，需进行迭代遍历。
通过FileReader的slice属性进行文件切割，然后声明form表单，通过XMLHTTPRequest上传文件。
因为原页面用 form 提交到另一个域名之后，原页面的脚本无法获取新页面中的内容。所以浏览器认为这是安全的。所以浏览器这个策略的本质是，一个域名的 JS ，在未经允许的情况下，不得读取另一个域名的内容。但浏览器并不阻止你向另一个域名发送请求。
Async/await 是建立在 Promises上的，不能被使用在普通回调以及节点回调
Async/await 和 Promises 很像，不阻塞
Async/await 代码看起来像同步代码。
主要通过setTimeout来完成，同时注意this和e事件对象的处理。
观察者模式（又被称为发布-订阅（Publish/Subscribe）模式，属于行为型模式的一种，它定义了一种一对多的依赖关系，让多个观察者对象同时监听某一个主题对象。这个主题对象在状态变化时，会通知所有的观察者对象，使他们能够自动更新自己。
中介者模式(Mediator Pattern)定义：用一个中介对象来封装一系列的对象交互，中介者使各对象不需要显式地相互引用，从而使其耦合松散，而且可以独立地改变它们之间的交互。中介者模式又称为调停者模式，它是一种对象行为型模式。
观察者模式规定发布者与订阅者是同步的，发布者发布信息，就立刻通知对应的订阅者，而发布订阅模式，发布者与订阅者是通过一个叫消息代理的中间件，进行消息传递的，也就是说发布者与订阅者相互互不相知，这时当有多个消息同时传递时，消息将存放在消息队列里，是异步的。
浏览器的事件流向分：捕获阶段和冒泡阶段，他们的方向互为相反，存在先后顺序，先捕获，后冒泡，同时如果绑定多个事件，以处理程序的调用顺序来决定。
优点：减少事件注册，节省内存；减少了dom节点更新的操作，处理逻辑只需在委托元素上进行；
缺点：事件委托基于冒泡，对于onfoucs和onblur等事件不支持，层级过多，冒泡过程中，可能会被某层阻止掉（建议就近委托）
作为对象方法调用
作为函数调用
作为构造函数调用
使用 apply 或 call 调用
第一种通过History API，将浏览地址，压入栈中
第二种通过监听hash及#，和url地址是否变化。
事实上关于Web性能有很多可以优化的点，其中涉及到的知识大致可以划分为几类：度量标准、编码优化、静态资源优化、交付优化、构建优化、性能监控。
- import { Button } from 'antd'，打包的时候只打包button，分模块加载，是怎么做到的
- 使用
import时，webpack对node_modules里的依赖会做什么
将在项目中使用的模块进行抽取然后再打包，也就是 require / import 的东东，对于js、css项目（比如webpack打包的），不论是依赖，还是dev依赖，在线上都不用部署这些，因为遇到require和import的语句，webpack会帮您打包模块进去，线上服务器连nodejs的程序都不用安装，js是丢给浏览器解析的。
它们由三个部分组成：对报文进行描述的起始行（start line）、包含属性的首部（header）块，以及可选的，包含数据的主体（body）部分。
cookie放哪里，cookie能做的事情和存在的价值
cookie存放在浏览器专门的文本文件里，cookie可以存放一些浏览器与服务器交付的凭证和一些有用的数据，
cookie和token都存放在header里面，为什么只劫持前者
因为传统的cookie保存的session id，服务器会根据这个session id，确保服务器与客户端对话；这是的cookie是有状态的，意味着验证记录或者会话需要一直在服务端和客户端保持。而token是无状态的，服务器不记录哪些用户登录了或者哪些 JWT 被发布了，只判断token是否有效，通常我们都会给token设置有效时间，来确保不被劫持。所有劫持cookie比劫持token，更有效，毕竟cookie在某种情况下可以一直使用下去，而token不行。
cookie和session有哪些方面的区别
cookie存放在浏览器端，session存放在服务器端。
多个参数的函数变换成接受一个单一参数（最初函数的第一个参数）的函数
- 实现对象的只读
ES6，5使用object.definePropertype,设置相应的属性，兼容IE使用闭包实现
loader用来对各种封装语法进行预编译，编译为能被浏览器执行的通用代码，plugin则各种不同的工具，对代码进行一些处理，例如混淆，压缩，拆分等。
抽象语法树是用来将代码解析为树型结构，再转换为字节码或直接生成机器码。在转换的过程中，我们可以实现代码的检查，提示，高亮等。
intent来传递参数，或者intent通过全局变量传递
同过activity之间的静态变量来传递，通过剪切板传递参数
都是用来改变this的指向，第一个参数都是this，都是利用后续参数进行传参，但bind返回的是一个函数，call的参数是单个变量，apply的参数是数组
css3可直接使用flex布局，css2可使用父类相对布局，左右子绝对布局，中间部分用相应的margin撑开。
- Promise有几个状态
Promise对象代表一个异步操作，有三种状态：pending（进行中）、fulfilled（已成功）和rejected（已失败）。一旦状态改变，就不会再变，任何时候都可以得到这个结果。Promise对象的状态改变，只有两种可能：从pending变为fulfilled和从pending变为rejected。
闭包就是调用函数返回函数，并在返回函数中生成一个不能被回收的对象。
父给子通过props传参，子通过this.$emit事件传参，甚至没有父子关系可通过公共实例文件，通过$emit，$on来做到。
- 处理 HTML 标记并构建 DOM 树。
- 处理 CSS 标记并构建 CSSOM 树。
- 将 DOM 与 CSSOM 合并成一个渲染树。
- 根据渲染树来布局，以计算每个节点的几何信息。
- 将各个节点绘制到屏幕上。
定位，好的网站定位是成功的一半
描述，好的描述让你的流量翻倍
关键词，好多关键词可以确认到你的而核心竞争力
内容，好的内容，能给你带来源源不断的流量
友情链接，好的友情链接可以快速的提高你的网站权重
外链，高质量的外链，会给你的网站提高源源不断的权重提升
1*：服务器接受了请求或正在流程化操作；
2*：服务器响应里的请求，并给与了回答；
3*：重定向。客户端需要进一步的操作才能获取数据；
4*：客户端存在问题，例如语法错误，未认证，拒接请求等；
5*：服务器错误，例如服务挂了，不支持某请求等；
Cache-Control，Expires，Pragma
1、客户端发送https的请求。
2、服务器收到后，向客户端发送证书和服务器的公用密钥。
3、客户端收到证书后，使用根证书对服务器发来的证书进行验证，如果证书不可信，那么访问终止
4、客户端随机生成一个对称密钥，使用公钥进行加密，并向服务器发送加密后的对称密钥。
5、服务器收到加密后的对称密钥后使用私有密钥进行解密。
6、這样，双发都有了对称密钥，可以进行加密通信了。
资源的合并与压缩
图片编解码原理和类型选择
浏览器渲染机制
懒加载预加载
浏览器存储
缓存机制
PWA
Vue-SSR
页面设计，排版，响应优化，效果优化，导航栏优化。
PWA渐进式网页应用：
渐进式：针对不同版本不同内核的浏览器，它的功能能够渐进式的增强，随着用户与应用之间的联系加深，如果用户需要，网页可以渐进式地变成App，比如被添加到主屏幕、全屏方式运行、离线工作、推送通知消息等。但它仍是 Web 而非放到 App Store 里。
响应式：适应多种运行环境，无论是移动端、web端还是平板电脑等等。
对网络环境的弱依赖： 得益于谷歌的service worker技术，使PWA极大降低对网络环境的依赖，能够在离线或者网络极差的环境下工作。
持续更新：同样由于service worker的存在，应用能够轻松实现持续更新。
类原生体验：有像原生应用般的交互和导航给用户原生应用般的体验，如果用户愿意，特闷可以选择将PWA应用添加到手机主屏幕，同样得益于service worker，它甚至可以让PWA应用像原生应用一样接收消息推送。
安全：通过 HTTPS 来提供服务来防止网络窥探，保证内容不被篡改。
A：将明文进行摘要运算后得到摘要（消息完整性），再将摘要用A的私钥加密（身份认证），得到数字签名，将密文和数字签名一块发给B。
B：收到A的消息后，先将密文用自己的私钥解密，得到明文。将数字签名用A的公钥进行解密后，得到正确的摘要（解密成功说明A的身份被认证了）。
对明文进行摘要运算，得到实际收到的摘要，将两份摘要进行对比，如果一致，说明消息没有被篡改（消息完整性）。
疑问：
摘要使用A的私钥加密，如果被拥有A的公钥的第三者截获，不就可以获取到摘要了么？会不会对安全造成威胁。
不会。因为摘要是不可逆推出原文的。
get,post,put,delete
交互验证；在请求头部中加入随机token，验证；
联调是前后端一起见证靠谱的测试结果
给需求方提供一个正确的需求验证环境
尽早暴露前后端实现的问题
画三角原理是利用盒模型，border在连接处成45度，一边成梯形；
width: 0;
height: 0;
border: 50px solid transparent;
border-top: 50px solid blue;===严格判断两边变量的类型，数值，内容是否相等，而==判断数值和内容，在判断过程中会帮你转换数据类型，再进行比较
权重的级别根据选择器被划分为四个分类：行内样式、id、类，属性选择器和伪类选择器、元素和伪元素。
过度，动画，形状转换，阴影，渐变，弹性布局，栅格布局等
堆内保存的引用数据类型，例如array，object；栈内存中存储基础数据类型，例如常量，function；队列中存储异步任务，例如定时器，http请求等；