1.常用知识
/*
只有一个div 高度时100%但是最后没有出现元素
这时候设置height: 100%;是无效的，在chrome的Elements中发现height仍然是0px.
设置高度100%时，div的高度会等同于其父元素的高度。
而上面中id为app的div(vue挂载的div)的父节点是body标签，
body标签的父节点是html标签。在默认情况下html和body标签的高度为auto，
而浏览器是不会自动给标签添加高度的，所以html和body标签就为0，
自然子div的高度设置为100%就不起作用了。
但是如果你给html body设置了高度那他就出现了 div占满屏
html设置height:100%;表示一屏高度，类似于100vh。未设置则根据子元素的高度来自适应高。
width不设置的话默认是auto 也就是最后算占地空间你应该多宽
width不继承
overflow 属性规定当内容溢出元素框时发生的事情。
默认值是visible 内容不会被修剪 超出了就显示
css可以被继承的属性 字体系列 比如font-size 文本系列 比如text-align color
元素可见性visibility 表格布局属性 opacity 光标属性cursor
css不可以继承的属性 display 文本属性比如vertical-align text-shadow text-decoration
盒子模型的属性 宽度高度编剧边框等等 浮动 定位 轮廓样式属性 size 等不可以被继承
display的值：none block inline inline-block table table-cell inherit
除非inherit手动继承 不然绝不继承
position：static relative fixed inherit initial(默认值 也就是static) sticky
initial可以用于css中所有属性 代表取默认值 sticky：当页面滚动但还没有超过此页面高度或宽度时候他自由跟着移动但当超过了他就跟fixed一样固定到某个地方了相当于relative和fixed的结合体 css3新特性
bfc的解决外边距重叠解决了 1.父子之间垂直方向取max 兄弟之间如果垂直的那margin取max
两栏布局：
calc动态获取宽度 利用block水平的元素宽度可以跟着父容器调节的流动特性
设置为块级元素并不是必须垂直一个一行一个了 而是可以用position去改变他 这个优先级是大的
div默认是块级元素 但也可以改为flex
一个是盒模型 一个是弹性布局还是很不一样的 flex也有div的特性
行内元素只不过是不能设置宽高 但可以设置左右边距
行内块元素可以设置宽高 以及外边距 块级元素的话啥都行而且还一行放一个呗
块级元素可以包含行内元素和块级元素。行内元素不能包含块级元素,只能包含文本或者其它行内元素
上右下左 ，上下 左右 ，上 左右 下
vertical-align:用来设置行内元素内容对齐方式的 就是display为inline，inline-block，inline-table的元素加上一个table-cell属性 让这种元素内部垂直方向的对齐方式
top：（内联）元素的顶边和行内最高元素的顶边对齐 每个行内元素之间的对齐方式 基线的top
top：使多个行内元素顶端对齐 （每个的水平线在顶端是齐的
*/
/*
注意inline-block之间会有间隙（3px chrom），可以在包含元素（父亲元素）中使用font-size：0消除
*/
/* 我更喜欢用border-box，因为border-box更灵活一点，举个例子，我在业务中遇到一个问题，我的商品详情页的一个盒子是高度自适应的，为146px，但是在ie8浏览器上显示为146.8px，如何解决，如果对盒子设置height:146px;则会出现被撑高的情况，因为box-sizing默认为content-box，你给元素设置宽高，只是给元素内容设置宽高，你元素的总高度是heigtht + border + padding所以就会出现撑高，解决方法就是给当前的盒子设置box-sizing: border-box这样你设置高度为146px时，会默然将元素内容的高度进行相应减少来保证整体高度为146px，这个最大的好处就是你这个盒子有好几个，而且有不同的padding和border值，解决这个的最好的方法就是给盒子设置border-box */
/*
bfc应用：1.父级元素设置bfc 可以清除内部浮动元素对腹肌元素高度造成0的影响
清除元素内部浮动：计算BFC的高度时，会检测浮动盒子的高度，撑开BFC的高度
2.两个盒子设置不同的bfc可以使其外边距不重叠 各自搞各的
解决外边距的合并问题：两个盒子创建不同的BFC，margin不会发生重叠
3.bfc盒子和外界无关 所以如果外面是浮动元素他不会与其重叠 而是紧贴
制作右侧自适应的盒子：如：图片（左侧）+文字（右侧），左侧图片浮动后，右侧文字不会环绕图片排列。即：BFC的区域不会与浮动盒子产生交集，而是紧贴浮动盒子的边缘，左侧盒子宽度变化会引起右侧盒子的宽度自适应。
margin-left指的是自己左边线距离外界有一个安全距离
top：50%指的是自己的左边线距离 父元素的一半高度
css中好像%都是对于父亲的
应该没有对元素中心进行距离偏移的 哦不对 其实相对距离一样 参照点不同而已其实一样的看中心或者是一条线
translate的是x正向的是右边 y正向的是下面 可以看做是中心平移多少也可以看做是左线平移多少 一样的
absolute定位原理剖析：
1.在父元素没有设置相对定位或绝对定位的情况下，元素相对于根元素定位（即html元素）（是父元素没有）。
2.父元素设置了相对定位或绝对定位，元素会相对于离自己最近的设置了相对或绝对定位的父元素进行定位（或者说离自己最近的不是static的父元素进行定位，因为元素默认是static）。
绝对定位不可以相对他的兄弟元素 只能是最近的父亲元素否则根
绝对定位是相对于父级元素来确定位置的。
兄弟元素可以使用padding或margin，这也是变相的绝对定位
justify-content: space-between;是贴边排的 但是有的可能有margin所以看着有空隙
around-between的话是两边有空隙的但一定比中间之间的空隙小
display: table-cell;
如果需要垂直居中
vertical-align: middle;
*/
？？自己写写再
两栏布局
html,body{
height: 100%;
margin: 0;
padding: 0;
}
.container{
/* height: 100%; */
position: relative;
/* width: 100%; */
background-color: blue;
/* overflow: hidden; */
}
.left{
width: 200px;
position: absolute;
background-color:blueviolet;
}
.right{
position: absolute;
left:200px;
background-color: rgb(163, 209, 228);
}
.container::after{
clear: both;
content: '';
display: block;
height: 0px;
visibility: hidden;
}
2.语义化标签
语义化标签是h5的新特性，让标签有自己的含义
便于代码结构清晰，有利于团队开发
便于各种设备解析，以语义的方式渲染页面 比如屏幕阅读器
利用搜索引擎优化
比如有{
title h1-h6 ul li header nav main article section aside
footer small em
}
开发常用标签
head内常用的是 meta link script style title
body内常用的是 div span img a ul li（无序） ol li（有序）input table th tr td form select
html：超文本标记语言
<!DOCTYPE> ’声明不是 HTML 标签；它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令；
- <title>：页面主体内容。
- <hn>：h1~h6，分级标题，<h1> 与 <title> 协调有利于搜索引擎优化。
- <ul>：无序列表。
- <li>：有序列表。
- <header>：页面。通常包括网站标志、主导航、全站链接、搜索框。
- <nav>：标记导航。仅对页面中重要的链接群使用。
- <main>：页面主要内容，一个页面只能使用一次。如果是web服务应用，
- <article>：定义外部的内容，其中的内容独立于文档的其余部分。
- <section>：定义文档中的节（section、区段）。比如章节、页眉、页脚或文档中的其他部分。
- <aside>：定义其所处内容之外的内容。如侧栏、文章的一组链接、广告、友情链接、相关产品列表等。
- <footer>：页脚，只有当父级是body时，才是整个页面的页脚。
4.js
ES6 中新增了一种 Symbol 。这种类型的对象永不相等，即始创建的时候传入相同的值，可以解决属性名冲突的问题，做为标记。
**值类型(基本类型)** ：字符串（String）、数字(Number)、布尔(Boolean)、对空（Null）、未定义（Undefined）、Symbol。
**引用数据类型**：对象(Object)、数组(Array)、函数(Function)。 date regexp
instanceof返回的是布尔值
__proto__叫做隐式原型 每个对象都有 而且函数也是对象
__proto__指向的是创建该对象的函数的prototype
typeof： 返回小写的字符串 number、boolean、symbol、string、object、undefined、function 除了null之外都能正确返回 引用类型只能分辨函数 其余都是object
instanceof：判断的是原型
**instanceof 只能用来判断两个对象是否属于实例关系** **， 而不能判断一个对象实例具体属于哪种类型。**
instanceof 能够判断出 [ ] 是Array的实例，但它认为 [ ] 也是Object的实例
当一个函数 F被定义时，JS引擎会为F添加 prototype 原型，然后再在 prototype上添加一个 constructor 属性，并让其指向 F 的引用。
null 和 undefined 是无效的对象，因此是不会有 constructor 存在的，这两种类型的数据需要通过其他方式来判断。
函数的 constructor 是不稳定的，这个主要体现在自定义对象上，当开发者重写 prototype 后，原有的 constructor 引用会丢失，constructor 会默认为 Object
toString() 是 Object 的原型方法，调用该方法，默认返回当前对象的 [[Class]] 。这是一个内部属性，其格式为 [object Xxx] ，其中 Xxx 就是对象的类型。
对于 Object 对象，直接调用 toString() 就能返回 [object Object] 。而对于其他对象，则需要通过 call / apply 来调用才能返回正确的类型信息。其他对象有重写tostring方法所以输出会不一样哦
let arr=new Array(1).fill(9)
console.log(arr.prototype)
实例对象（非构造函数）是没有prototype的
console.log(Array.__proto__) 为{}
Function.__proto__===Function.prototype true！
Array.__proto__===Array.prototype false
Array.prototype 是 Object(0) []
console.log(arr.__proto__)
实例对象的proto其实也是实例对象 所以当你输出的时候它输出的是此对象的值
console.log(Function.prototype+' a '+Object.prototype)
console.log(arr.toString())
输出：
undefined
{}
Object(0) []
function () { [native code] } a [object Object]
9
arr instanceof Array =>true
arr.construcor==Array
Object.prototype.toString.call(this) => 'Object' 'Array'
最佳方法
你不相信自己 面试官还不跟我说 太痛苦了
let s=new String('s')
console.log(s instanceof String)
true
console.log(Function.prototype+' '+Function.prototype.__proto__)
function(){[native code]} [object Object]
Object的输出就是tostring 【这种类型】
别的输出这个对象调用他们的tostring因为重写了所以各不相同
console.log(Function.__proto__+' '+Function.prototype.prototype)
function () { [native code] } undefined
let a=new A()
function A(){
}
console.log(a.prototype)
console.log(A.prototype)
console.log(a.__proto__)
console.log(A.__proto__)
undefined
{}
{}
{}
{}
5.aaa
null 不等于 []
object的__proto__ [object Object]
再往上就是null了
因为对象嘛他这么也忒有一个原型对象 所以 就有了当然这也是一个实例对象 至于输出就是Object类型 再往上就是null了 对象的原型不叫做他的构造函数
构造函数的原型 和他的实例对象的原型 一样 所以构造函数和实例对象地位平等
#### Object.prototype.proto === null
Object.proto==Function.prototype
Function.prototype 不就是对象实例么 不就是{}么
看我桌面上的图
Object,Number, Error等等这些函数都是Function创建的，下面就说明 这些的constructor就是Function，这里比较有意思的就是 Function.constructor也是Function。那就有Object.proto === Function.prototype === Function.protoObject.constructor.prototype === Function.prototype // trueFunction.constructor === Function// true
8.tcp ip http
TCP/IP协议
指的是利用ip进行通信时所必须用到的协议群的统称。http tcp udp ip ftp都属于tcp/ip协议
互联网的协议就是 TCP/IP，TCP/IP 就是互联网的协议
网络层中的ip协议包括ip地址（127.0.22.21这种）路由 ip分包与组包 ipv6
tcp协议是传输层中的 包括三次握手四次挥手 重发超时的确定 滑动窗口的控制 。是面向连接的可靠地流协议。可以保证发送信息的顺序。
udp是不可靠的 信息不一定送达 但是对于高速传输和实时性要求比较高的时候用它很棒
TCP 为提供可靠性传输，实行“顺序控制”或“重发控制”机制。此外还具备“流控制（流量控制）”、“拥塞控制”、提高网络利用率等众多功能。
HTTP 是一个属于应用层的面向对象的协议，
超文本传输协议 支持bs cs模式
B/S架构即浏览器和服务器架构*模式*
C/S*模式*就是指客户端/服务器*模式*
HTTP 协议一共有五大特点：1、支持客户/服务器模式；2、简单快速；3、灵活；**4、无连接；5、无状态**。**无连接的含义**是限制每次连接只处理一个请求。服务器处理完客户的请求，并收到客户的应答后，即断开连接。采用这种方式可以节省传输时间。**无状态**是指协议对于事务处理没有记忆能力，服务器不知道客户端是什么状态。即我们给服务器发送 HTTP 请求之后，服务器根据请求，会给我们发送数据过来，但是，发送完，不会记录任何信息。
*Window 对象*表示浏览器中打开的窗口。
是bom对象
js在运行时内置了一个global对象
这个对象和运行环境有关 浏览器运行环境下这个对象是window
nodejs中Global对象就是global对象
箭头函数郿自己的this 所以不能通过bind动态的去修改this
面试官一直挖坑 问我一些会报错或者根本不行的东西 所以他问我并不默认这是对的 跟tm考试一样
bind的原理就是把a对象的this都换成你的参数的那个对象
但是箭头函数都没有this 你搞个p 那是因为作用域链的原因所以你在箭头函数中找this会找得到 但其实他没有 而且bind的时候你也没办法覆盖this啊 bind是把函数里面那个this变量覆盖成设置的 但现在箭头函数里this是上一层的this 我根本拿不到去改变 而且你改变人家this 良心不痛么 this在上面你在自己函数里改 应该是常量也没法改
箭头函数的this无法通过bind，call，apply来直接修改（可以间接修改）。改变上层作用域中的this可以借此改变街头函数的this
函数作用域预编译 1.创建ao对象 AO{} 2.找形参和变量声明 将变量和形参名当做ao对象的属性名 值为undefined 3.实参和形参相统一 4.在函数体里面找函数声明 值赋予函数体 （函数声明不是函数表达式 var a=function(){}不叫函数声明 叫做函数表达式 function c(){}才是函数声明 全局作用域的预编译 1.创建go对象 2.找变量声明 将变量名作为go对象的属性名 值为undefined 3.找函数声明 值赋予函数体
## 函数作用域[[scope]]：
运行期上下文：当函数执行时，会创建一个名为执行期上下文的内部对象，它定义了一个函数执行时的环境。函数每次执行时其上下文是唯一的，多次调用一个函数会生成多个执行期上下文，当函数调用完，其对应的执行期上下文被销毁。查找变量时则从作用域的顶端开始查找。
作用域链？？看 一座大楼里面的几个小房间是当前作用域
用[[scope]]来得到
https://zhuanlan.zhihu.com/p/60279001
辣鸡回收机制：js中的
内存管理的概念是可达性
他是为了内存泄漏 把不可到达的变量清除掉 有一种方法是引用清除法
他是不断记录以来引用去把所有可达的变量做标记 然后最后把没有标记的变量清除掉 有几个优化的点是1可以分为新生代和老生代变量 新的就是用几次就清除掉了 老的就放晚点查 先把新的清除掉 2在cpu空闲的时候清除
基本的垃圾回收算法称为标记-清除 ，定期执行以下垃圾回收步骤:
- 垃圾回收器获取根并 **“标记”** (记住)它们。
- 然后它访问并“标记”所有来自它们的引用。
- 然后它访问标记的对象并标记它们的引用。所有被访问的对象都被记住，以便以后不再访问同一个对象两次。
- 以此类推，直到有未访问的引用(可以从根访问)为止。
- 除标记的对象外，所有对象都被删除。
最后删的是对象
引用和对象不一样 引用只是指针
算法题到最后一个 和到头已经到len了也不一样
注意不要惯性思维以为不行 其实仔细想想是不一样的 一个到len-1 一个到len了
垃圾回收就是收集那些已经不需要某块内存的内存 并释放掉
间歇的不定期的寻找不再使用的变量并释放其内存
还有一种算法 引用计数 标记清除
有一组基本的固有可达值，由于显而易见的原因无法删除。例如:
- 当前本地函数的局部变量和参数
- 当前嵌套调用链上的其他函数的变量和参数
- 全局变量
- 还有一些其他的，内部的
闭包上层函数可以是let 因为let的作用域也是那一块
