- 响应式布局vw+vh+rem屏幕适配方案
vm vh是基于视口的布局方案，所以这个meta元素的视口必须声明（解决宽高自动适配）
<meta name="viewport" content="width=device-width,initial-scale=1.0">
rem布局解决字体适配
根据css的媒体查询功能，更改html根字体大小，实现字体大小随屏幕尺寸变化
@media only screen and(max-width:1600px) and (min-width:1280px){
html{
font-size:14px;
}
vm vh rem 的使用
width:50vw代表了此div占据视口宽度的50%，
height：20vh代表高度占据视口高度的20%并且会随着视口的变化而变化 自适应
font-size:1.5rem 是字体是1.5倍的html跟字体大小，并且根据媒体查询进行字号变化
em是一个相对长度单位，相对于当前对象内文本的字体尺寸。
rem和em用法基本一致但他的所有元素都是相对于根元素，而不是父元素，减少了我们的计算成本。
经常用rem，易于维护，rem兼容性和em一样且都是基于像素点适配的
vmin是选取vw和vh最小的那个，手机竖屏的时候1vmin=1vw
vmax就是最大的，手机竖屏1vmax=1vh
在移动端适配方案中，我们可以通过与less、scss、postcss等预编译期相结合，通过定义一些函数或者使用一些插件，根据设计稿，定一个基准尺寸，根据这个尺寸，计算出相对应的vh、vw元素块大小。从而做到自适应适配。
- token的原理及其实现
之前的为了区分用户，（因为http是无状态的无法记录这几次请求是不是同一个用户发出的）所以有了session id会话标识，但是客户端只需要保存自己的session id，而服务器需要保存所有客户端的session id这样太浪费了严重限制了服务器扩展能力，所以有了token
服务器不需要存储token的信息，而是通过cpu的计算+数据的加密解密再核对token的方式来验证用户是否合法（http请求信息有没有被篡改）来使服务器内存得到释放。
session id可以被伪造，因为他没有采取加密的方法，所以一旦攻击者通过session id伪造攻击就会给服务器带来压力甚至可击垮
token是通过加密算法比如HMAC-SHA256算法来实现session对象验证，这样攻击者无法伪造token来攻击服务器。
所以token：1.节省服务器内存 2.数据签名防伪造攻击
- token的优势
- 1.无状态，可扩展 tokens是无状态的
- 2.安全性 发送cookie可以防止csrf（跨站请求伪造），token是有时效的一段时间之后用户需要重新验证，也可以撤回token，
- 3.多平台跨域 cors跨域资源共享 ，只要用户有一个通过了验证的token，数据和资源就能在任何域上被请求到。token过期后再请求的就是一个新的token，但 是同一个用户哦，所以一个用户会有很多token存在过，而且token服务器不存，token本身就可以解析到用户信息名字密码等，所以直接解密就可以得到并发送信息给客户端。
token实现原理
1.将荷载payload（用户信息可鉴别唯一用户的）以及Header信息进行Base64加密，形成密文payload密文，header密文
2.将形成的密文用‘.’链接并且用服务端秘钥进行HS256加密，生成签名
3.将前面两个密文 再加上 前面生成的签名 用‘.’链接（不加密了）就生成了token返回给服务端
1）用户请求时携带token（包含header密文，payload密文，签名）到服务端，服务端解析头部密文用base64课得知用什么算法进行签名的
2）服务端使用自己原来的密钥和前两个密文 生成签名2 与token自己携带的签名进行对比，若一致则发个，否则就是原文被修改。
3）当客户端解密payload密文时可以得知荷载授权时间以及有效时间，然后与当前时间对比得知token是否过期
服务器端采用filter过滤器进行token校检，成功则返回请求数据否则返回错误码。
3.清除浮动的方法
- 清除浮动主要是为了解决父元素因为子级元素浮动引起的内部高度为0的问题。也就是当父元素不给height时内部元素不浮动时会撑开但浮动的时候父元素就会变成一条线。
- clear：both;本质是闭合浮动，让父盒子闭合出口和入口，不让子盒子出来。
1.额外标签法
在最后一个浮动标签后新加一个标签给其设置clear:both （不推荐）因为这个添加了无意义标签，语义化差
2.父级添加overflow属性（也就是父元素添加overflow：hidden） 也不推荐
通过触发bfc方式实现清除浮动
BFC块级格式化上下文
{
bfc的原理（渲染规则）
在bfc这个元素的垂直方向边距会发生重叠
bfc的区域不会与浮动元素的box重叠，可以用来清楚浮动布局
bfc是一个独立的容器，外面的元素不会影响里面的元素，同时里面的元素不会影响外面的元素
计算bfc元素高度时，浮动元素也会参与计算
创建bfc：
1.float不为none
2.position不为默认值static时也是设置了bfc
3.display属性为table，table-cell等于table相关的都是设置了bfc
4.overflow：auto/hidden
}
IFC内联格式化上下文（了解即可）
回到正题：清除浮动也可以用触发bfc方式
但是内容增多的时候容易造成不会自动换行导致内容被隐藏掉，无法显示要溢出的元素 因为hidden就是隐藏的意思
3.使用after伪元素清楚浮动 推荐使用
.clearfix:after{
content:'';
display:block;
height:0;
clear:both;
visibility:hidden;
}
4.使用before和after双伪元素清除浮动
.clearfix:after,.clearfix:before{
content:'';
display:table;
}
.clearfix:after{
clear:both;
}
.clearfix{
*zoom:1;
}
<div class="father clearfix">
<div class="big">s</div>
<div .....>
</div>
也推荐使用
伪元素：
他们并不是真正的页面元素但是其用法和表现和真的页面元素一毛一样，css有一系列伪元素:before :after :first-line :first-letter
1.首先是after和before
是在真正页面元素内部之前和之后添加新内容
p:before是指添加在p内部的第一个元素为 一般默认伪元素是行内元素span形式inline元素呗 content表示内容
必须设置content且内容可以有字符串/attr(attr_name)/url()/counter()
2.伪元素不占用dom元素节点，但能达到元素效果，他不属于文档所以js无法操作他，伪元素属于主元素 P：after指的是p为主元素，所以点击伪元素触发的是主元素的click时间
大部分行级元素也可以设置伪元素
而且当外部资源加载失败时候设置的伪元素也可以起作用，若正确加载则覆盖伪元素内容
伪元素不利于seo，无法审查元素
具体其他作用可见
https://www.cnblogs.com/wonyun/p/5807191.html
5.react生命周期
- ？？？待补充 6.html dom self属性
- window.self 可返回对窗口自身的只读引用等价于window属性 7.react的ref的三种方式
1.string类型 字符串起名字吧
可能会被以后react遗弃
<input type='text' ref="inputRef"/>
focus=()=>{
this.refs.inputRef.focus();
}
2.react.CreateRef()
在类中定义一些引用变量
inputRef=React.createRef();
<input ... ref={this.inputRef} />
focus=()=>{
this.inputRef.current.focus();
}
3.函数形式 这种方法可以将子组件暴露给父组件以是的父组件可以调用子组件的方法
inputRef=null
fnRef= el=>this.inputRef=el;
<input .. ref={this.fnRef} />
https://www.cnblogs.com/lanpang9661/p/12604712.html
下午敲代码这个蛮不错的
但是react并不推荐过渡使用ref
8.邻接矩阵
-
逻辑结构分为两部分：V和E集合，其中，V是顶点，E是边。因此，用一个一维数组存放图中所有顶点数据；用一个二维数组存放顶点间关系（边或弧）的数据，这个二维数组称为邻接矩阵。邻接矩阵又分为有向图邻接矩阵和无向图邻接矩阵（一般对称）。
-
一般都是行->列号 2->3号点
-
邻接矩阵空间时间复杂度都是n方，而对于系数图来说邻接表最合适 他都是m
-
邻接表就是用链表保存的都是从顶点i出发的所有边。用u v w三个数组记录每条边具体信息 i只是第几条边的意思 w存权值 第i条边是u【i】号顶点到v【i】号顶点
-
或者用一共n个顶点然后每个顶点蔓延出小链表连着此号点相关的边，每个节点记录着value和下个节点地址and自己的号。有向无向都可用
11.e.preventDefault()阻止默认操作
一些默认操作如：
1.把单击事件处理程序注册到一个锚元素，而不是一个外层的上，那么就要面对另外一个问题：当用户单击链接时，浏览器会加载一个新页面。
2.当用户在编辑完表单后按下回车键时，会触发表单的submit事件，在此事件发生后，表单提交才会真正发生。这种行为与我们讨论的事件处理程序（更微观细小）不是同一个概念，它是单击标签元素的默认操作（对象的表象默认操作，更宽阔一些概念）。
ps 像冒泡这种不是默认行为而是我们指的事件处理程序 ，阻止靠别的
3.当对象默认行为被取消时候，调用此语句时不起效果的
window.event.returnValue=false;
4.return flase也可以阻止也会停止冒泡，
当当当：
1.event.stopPropagation()事件处理过程中阻止了事件冒泡但不会阻止默认行为（比如执行超链接的跳转）
2.return flase 事件处理过程中阻止了事件冒泡，也阻止了默认行为
3.event.preventDefault()事件处理过程中不阻止事件冒泡但阻止默认行为
event代表事件的状态，例如触发event对象的元素、鼠标的位置及状态、按下的键等等；
event对象只在事件发生的过程中才有效。
12.required 属性规定必需在提交之前填写输入字段。 13.
