牛客网刷题record

行内元素

行内元素典型代表 span ,a, ,strong , em, del, ins
特点：

在一行上显示
不能直接设置宽高
元素的宽和高就是内容撑开的宽高。

行内块元素（内联元素）典型代表 input img
特点：

在一行上显示
可以设置宽高

块元素典型代表,div,h1-h6,p,ul,li
特点:

独占一行
可以设置宽高
嵌套（包含）下，子块元素宽度（没有定义情况下）和父块元素宽度默认一致。

行内元素不可以设置宽高，但是可以设置左右padding、左右margin

`link`和`import`

link除了引用样式文件，还可以引用图片等资源文件，而import只引用样式文件
link属于html范畴 import属于css范畴

1	<link rel="icon" sizes="any" mask href="//www.baidu.com/img/baidu.svg">

兼容性不同，link不存在兼容性的问题，import在IE5以上支持，是css2.1新增的
在样式表文件可以使用import导入其它的样式表文件，而link不可以
link引用CSS时，在页面载入时同时加载；@import需要页面网页完全载入以后加载。
link支持使用Javascript控制DOM去改变样式；而@import不支持。
原文链接：https://blog.csdn.net/lxcao/article/details/52639442

DOM事件

onchange() 事件会在域的内容改变时发生
比如：<input type="text">, <select>, <textarea>

onblur() 会在对象失去焦点时发生

css选择器

这次主要错在了相邻兄弟选择器
eg

1	.a + .b{xxx}

这样的是选择兄弟中第一个叫b的人，而不是所有兄弟b

input的元素

text password radio checkbox submit reset file image search button
email url number range color
关于时间 (date, month, week, time, datetime, datetime-local)

获取用户位置H5

getCurrentPosition()

fieldset

audio和video

DHTML

DHTML 将 HTML、JavaScript、DOM 以及 CSS 组合在一起，用于创造动态性更强的网页。
通过 JavaScript 和 HTML DOM，能够动态地改变 HTML 元素的样式。

DHTML具有三个主要优点：动态样式、动态内容、动态定位

H5中可以省略结束标记的标签

选C，html5中可以省略结束标记的元素有
1、dd
2、dt
3、li
4、p
5、optgroup
6、option
7、rt
8、rp
9、thread
10、tfoot
11、tr
12、td
13、th

锚伪类

nthchild的n从0开始

xx

BFC

BFC(Block formatting context)直译为”块级格式化上下文”。它是一个独立的渲染区域，只有Block-level box参与,
哪些情况会产生BFC:
根元素
float属性不为none
position为absolute或fixed
display为inline-block, table-cell, table-caption, flex, inline-flex
overflow不为visible

H5新增的标签

新增header，footer，nav，article，section，aside，datalist，audio，video，embed，input属性
没有head！！！

ul和ol

<blockquote> 标签定义块引用。 <h1> - <h6> 标签可定义标题。 <strong> 标签和 <em> 标签一样，用于强调文本，但不加粗，是斜体。它强调的程度更强一些。 <a>标签定义超链接，用于从一张页面链接到另一张页面。 <p>标签定义段落。 <section> 标签定义文档中的节（section、区段）。 <nav> 标签定义导航链接的部分。 <ul> 标签定义无序列表。 <ol> 标签定义有序列表。

`button`不建议嵌套`a`

A：<p> 元素的父元素不能是 <a> 元素（最后一个 <p> 元素不满足这条件），见 MDN
B: <button> 是行内块元素，可以嵌套行内元素。但是，不推荐嵌套 <a> 元素！！！
   在比较多的 UI 库中，都是 <a> 元素嵌套 <button> 元素的。（自己试一下就知道区别了）
C：正确
D：<dl>、<dt>、<dd> 、<h>这些 标题标签 不推荐嵌套块级元素

`img`

img是src不是href

定位

relative是相对于自身进行偏移的

H5元素

h5没有删除small元素
废除了能用css代替的元素：basefont、big、center、font、s、strike、tt、u

空元素

address用于定义文档或文章的作者/拥有者的联系信息。
<embed> 标签定义嵌入的内容，比如插件。
<wbr>元素来添加 Word Break Opportunity（单词换行时机）。

date

<input type="datetime-local" >可以用来显示本地时间，且时间不可以修改

meta标签

meta标签是描述一些基本的元数据
head标签可以包含，title、meta、link、script 等

dl标签

dl标签定义一个描述列表
dl标签和dt标签（定义项目/名字）和dd标签（描述每一个项目/名字）一起使用
且dt和dd同级，但dt要在dd前面

radio属性与label绑定

input中的radio属性以name来划分组，有且仅有一个被选中
label和radio绑定有两种方法

label和input同级，label的for属性值与input的id相同

1 2	<input type="radio" id="radioA" name="radio1" /><label for="radioA">这是radioA</label> <input type="radio" id="radioB" name="radio1" /><label for="radioB">这是radioB</label>

label里面嵌套input
1
2
<label><input type="radio" name="radio2">这是radioA</label>
<label><input type="radio" name="radio2">这是radioB</label>
另外注意label只有两个属性for（规定 label 绑定到哪个表单元素）和form（规定 label 字段所属的一个或多个表单）

注释问题

object元素

称为html嵌入对象元素，表示引入一个外部资源，这个资源可能是一张图片，一个嵌入的浏览上下文，亦或是一个插件所使用的资源
param用来为object或applet元素定义的对象或小程序进行初始化参数设置，param为object、applet的子元素，因此param只可以放置在object、applet元素的标签内容中。

contextmenu 和 spellcheck

脱标

浮动（float）、固定定位（fixed）和绝对定位（absolute）都会使元素脱离文档流

track标签

标签为诸如 video 元素之类的媒介规定外部文本轨道。

用于规定字幕文件或其他包含文本的文件，当媒介播放时，这些文件是可见的。

标签是 HTML 5 中的新标签。
目前所有主流浏览器都不支持标签

canvas和svg比较

Canvas 与 SVG 的比较
下表列出了 canvas 与 SVG 之间的一些不同之处。

Canvas
依赖分辨率
不支持事件处理器
弱的文本渲染能力
能够以 .png 或 .jpg 格式保存结果图像
最适合图像密集型的游戏，其中的许多对象会被频繁重绘
Canvas 是逐像素进行渲染的。

在 canvas 中，一旦图形被绘制完成，它就不会继续得到浏览器的关注。如果其位置发生变化，那么整个场景也需要重新绘制，包括任何或许已被图形覆盖的对象。

什么是SVG?
SVG 指可伸缩矢量图形 (Scalable Vector Graphics)
SVG 用来定义用于网络的基于矢量的图形
SVG 使用 XML 格式定义图形
SVG 图像在放大或改变尺寸的情况下其图形质量不会有所损失
SVG 是万维网联盟的标准
SVG 与诸如 DOM 和 XSL 之类的 W3C 标准是一个整体
(SVG是HTML下的一个分支)

SVG
不依赖分辨率
支持事件处理器
最适合带有大型渲染区域的应用程序（比如谷歌地图）
复杂度高会减慢渲染速度（任何过度使用 DOM 的应用都不快）
不适合游戏应用

高亮显示

mark
jquery的话是highlight
（1）highlight jQuery中的，突出特效，通过改变背景颜色来隐藏或者显示一个元素
（2）mark h5中的标签，定义带有记号的文本，文本高亮显示
（3）strong HTML中的标签，定义重要文本，用来加粗文本
（4）blink 是js中的方法，用于显示闪动的字符串，不能用于ie，Chrome，Safari

form属性

首先form的methods里面只有get和post 其他的方法是在ajax里面的
然后enctype属性规定发送到服务器之前一个如何对表单数据进行编码，它的默认值是application/x-www-form-urlencoded

h5新特性

audio和video支持
Canvas
localStorage
WebSocket
…

属性值顺序

上右下左顺时针

获取selected文本框的值或文本

extra 知识

父类高度塌陷问题

如果子元素都是浮动

直接给父元素设置高度，在子元素改变的情况下，此方法使用起来比较繁杂。
给父元素直接设置 overflow:hidden;样式
父元结束标签之前加空div，样式为 clear：both；
伪元素选择器,父元素加上clearfix

jq滑动

slideUp()和slideDown都是jQuery函数，slideUp()通过使用滑动效果，隐藏被选元素，如果元素已显示出来的话。slideDown() 方法通过使用滑动效果，显示隐藏的被选元素。

WebStorage

其实就是localStorage和sessionStorage的统称。
WebStorage存储是HTML5为数据存储在客户端提供的一项重要功能，分为两种：sessionStorage(保存会话数据)和loaclStorage(在客户端长期保存数据)。

svg标签

SVG 即 Scalable Vector Graphics，是一种用来绘制矢量图的 HTML5 标签。你只需定义好XML属性，就能获得一致的图像元素。
svg的嵌入：使用object标签才行不能直接嵌入

怪异模式/兼容模式

在 HTML 中，文档类型 doctype 的声明是必要的。在所有文档的头部，你都将会看到”<!DOCTYPE html>” 的身影。这个声明的目的是防止浏览器在渲染文档时，切换到我们称为“怪异模式(兼容模式)”的渲染模式。“<!DOCTYPE html>” 确保浏览器按照最佳的相关规范进行渲染，而不是使用一个不符合规范的渲染模式。
也就是没有声明的话是进入怪异模式

h5跨文档消息传输

h5提供了网页文档之间发送信息和相互接收的功能。使用这个功能，只要获得网页窗口所在对象的实例，既可以实现同域跨域的通信

权重计算

1.通配符选择器和继承:权重为0， 2.标签选择器:权重为0001 3.类选择器:权重为0010 4.id选择器:权重为0100 5.行内样式:权重为1000 6.!important:权重为无穷大

另外值得一提的是继承的优先级是没有自身设置的高的即使继承的是!important

h5新增

border边框

none 无边框样式自然没有宽度这一说
0 边框宽度0
定义边框的时候除了设置宽度还要设置边框的样式才行

默认加粗

h1-6和th
em是斜体
caption是表格标题

hidden和none

hidden的元素没有被渲染但是元素内容是被创建了
none会触发回流
hidden会触发重绘
repaint(重绘) ，repaint发生更改时，元素的外观被改变，且在没有改变布局的情况下发生，如改变outline,visibility,background color，不会影响到dom结构渲染。

reflow(渲染)，与repaint区别就是他会影响到dom的结构渲染，同时他会触发repaint，他会改变他本身与所有父辈元素(祖先)，这种开销是非常昂贵的，导致性能下降是必然的，页面元素越多效果越明显。
回流一定会重绘重绘不一定回流

dom中htmldivelement的正确继承关系是

link标签的加载和解析

link标签是同时加载的先加载完成的优先解析
js才是先加完一个再加另外一个

input标签的readonly

readonly只读，用户不可以修改，但可以复制，也可以通过tab切换到该字段，还可以用js设置条件控制用户是否可以更改输入内容
step规定输入字段的合法数字间隔比如说2 那么合法数字就是-2 0 2 4等
为负数或0的时候默认为1
disabled指当 input 元素加载时禁用此元素。input内容不会随着表单提交
readonly规定输入字段为只读。input内容会随着表单提交。
无论设置readonly还是disabled，通过js脚本都能更改input的value（亲测可以）

h5新增的input元素的type属性

h5大小写

h5对大小写不敏感但为了规范推荐小写

h5的`data-`

h5允许使用data-xx来自定义数据

h5之前的版本是

优化滚动性能

重绘重排节流防抖

p元素a元素包含问题

p不能包含任何块级元素包括自身
a可以包含任何其他元素除了自身

document

dom树的根节点是document

getElementsByName()是获取name

a标签

有href才有下划线
href 属性的可选有：

1
2
3

1. 绝对路径（href = "https://www.baidu.com"）
2. 相对路径（href = "index.html"）
3. 锚（href = "#top"）

内容重要程度mark strong em b

重要程度递减

重绘和重排(重点)

td单元格

td标准意义指的是单元格而不是列

textarea标签

textarea不能设置宽度但是可以通过cols控制宽度

embed标签

定义嵌入的内容比如插件可以设置高度和宽度

head间的代码

其实页面是有能力进行响应式设计的，但是只是没有规范到合适的大小

vm视口单位

vm是视口单位，将视口分为100份

无继承性的属性值

有继承性的属性值

q标签

定义滑块range

上标文本sup下标文本sub

如上

manifest标签

应用缓存资源清单
带有缓存 manifest 的 HTML 文档（用于离线浏览）
manifest 文件是一个简单的文本文件，列举出了浏览器用于离线访问而缓存的资源。
HTML5 引入了应用程序缓存，即意味着 Web 应用程序可以被缓存，然后在无互联网连接的时候进行访问。
应用程序缓存使得应用程序有三个优点：

离线浏览 - 用户可以在离线时使用应用程序
快速 - 缓存的资源可以更快地加载
减少服务器加载 - 浏览器只从服务器上下载已更新/已更改的资源

h5新特性

HTML5 是作为Flash的替代技术出现

浏览器渲染流程

解析HTML并构建DOM树
构建render树
布局render树
绘制render树

创建带有id的dom元素有什么副作用

首先会增加内存负担，然后是会创建同名的全局变量，可以用window['xx']访问

css加载

css加载不会阻塞DOM树的解析
css加载会阻塞DOM树的渲染
css加载会阻塞后面js语句的执行

优化滚动性能

在滚动中对滚动函数进行节流处理
滚动中减少导致重绘的操作
滚动中减少导致重排的操作
对滚动事件进行防抖处理

web表单的图形验证码

最好不要把验证码文本放在客户端否则虫或者是恶意程序依旧可以通过各种手段获取你嵌入在html文本或者保存在cookie中的正确验证码文本，模拟表单提交来达到攻击的目的。
浏览器也不能判断验证码
正确的方式是：发送到客户端的只有图片形式的验证码，服务器端保存cookie对应的图形验证码的正确文本。客户端表单提交时到服务器端验证。

外边距塌陷问题

当两个在标准流中相邻（兄弟或父子关系）的块级元素的外边距组合在一起的时候，垂直方向上会发生外边距塌陷的问题，计算方式：

两个都为正，取最大
一正一负加起来
两个负取绝对值最大

clientWidth和offsetWidth

window对象

如果页面中包含框架，那么每个框架都拥有自己的window对象

a标签

在a标签的href中添加javascript:;可以使页面不跳转
#不是，是当前位置

json和xml比较

JSON 和 XML 优缺点的比较 （1）【XML】的优缺点 优点： （1）格式统一，符合标准； （2）容易与其他系统进行远程交互，数据传输比较方便。 缺点： （1）XML文件庞大，文件格式复杂，传输占带宽； （2）服务器端和客户端都需要花费大量代码来解析XML，导致服务器端和客户端代码变得异常复杂且不易维护； （3）客户端不同浏览器之间解析XML的方式不一致，需要重复编写很多代码； （4）服务器端和客户端解析XML花费较多的资源和时间。 那么除了XML格式，还有一种叫JSON （2）【JSON】的优缺点 优点： （1）数据格式比较简单，易于读写，格式都是压缩的，占用带宽小； （2）易于解析，客户端JavaScript可以简单的通过eval_r()进行JSON数据的读取； （3）支持多种语言，包括ActionScript, C, C#, ColdFusion, Java, JavaScript, Perl, PHP, Python, Ruby等服务器端语言，便于服务器端的解析； （4）在PHP世界，已经有PHP-JSON和JSON-PHP出现了，偏于PHP序列化后的程序直接调用，PHP服务器端的对象、数组等能直接生成JSON格式，便于客户端的访问提取； （5）因为JSON格式能直接为服务器端代码使用，大大简化了服务器端和客户端的代码开发量，且完成任务不变，并且易于维护。 缺点： （1） 没有XML格式这么推广的深入人心和喜用广泛，没有XML那么通用性； （2）JSON格式目前在Web Service中推广还属于初级阶段

跨域

字体有的可能会受到影响
图片和css这类的采用src的一般不会因为src本质是get请求

enctype属性

html全局属性

html全局属性就是所有标签都能用的属性

margin外边距

margin:auto是根据剩余的长度居中对齐并不是0

定位

absolute是基于第一个static定位以外的父元素进行定位
static定位就是默认值没有定位

overflow

参数是scroll时候，必会出现滚动条。
参数是auto时候，子元素内容大于父元素时出现滚动条。
参数是visible时候，溢出的内容出现在父元素之外。
参数是hidden时候，溢出隐藏。

页面元素的优先显示以及优先级

在不涉及样式的情况下优先显示指的是html文档加载时从上到下加载只与标签的上下顺序有关，与标签的选用无关。
优先级是帧元素比表单元素优先表单元素比非表单元素优先

浮动元素重叠

行内元素和浮动元素发生重叠的时候，行内元素的边框背景内容都会在浮动元素之上
块状元素和浮动元素发生重叠的时候，边框，背景在浮动元素之下，内容在浮动元素之上

`:before`选择器

早在css2.1的时候就已经定义了

`background-position`背景定位

用处：配合background-image属性一起使用，用于设置背景图片在盒子中的位置
参数：xpos ypos |x% y% |x y三种,
如果只写第一个参数那么第二个参数会默认为center|50%|容器高度一半的px
Xpos：规定水平方向的对齐方式,值有left,right,center
Ypos：规定垂直方向的对齐方式,值有top,bottom,center
x%:规定图片水平方向的距离。
你会不会以为这个x%就是父级容器宽度的x%？那你就想错了哦，这里的x%指的是父级容器的宽度减去图片的宽度后的差值的x%。
举个栗子：background-position：50%，20%；
图片的宽度为 imgwidth：100px；高度为 imgheight：100px；
容器的宽度为 conwidth：200px；高度为 conheight：200px；
那么此时图片的左顶点距离容器的左顶点的水平距离就是(conwidth-imgwidth)50%=50px,而不是conwidth50%=100px；(很好理解的吧，不然盒子宽度200px，图片宽度100px，又距离左边100px，岂不是50%没实现水平居中而紧靠右了吗？)
由此也可以算出图片的左顶点距离容器的左顶点的垂直距离为20px
y%:对应x%
x:图片距离容器水平方向距离
y:图片距离容器垂直方向距离

字体三个单位

em的值并不是固定的，会继承父级元素的字体大小。px为固定单位。 pt 绝对长度单位

动画

css sprite

CSS Sprites在国内很多人叫css精灵，是一种网页图片应用处理方式。它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去，这样一来，当访问该页面时，载入的图片就不会像以前那样一幅一幅地慢慢显示出来了。
利用CSS的“background-image”，“background- repeat”，“background-position”的组合进行背景定位，background-position可以用数字精确的定位出背景图片的位置。
利用CSS Sprites能很好地减少网页的http请求，从而大大的提高页面的性能，这也是CSS Sprites最大的优点，也是其被广泛传播和应用的主要原因；
CSS Sprites能减少图片的字节，曾经比较过多次3张图片合并成1张图片的字节总是小于这3张图片的字节总和。所以C错误
解决了网页设计师在图片命名上的困扰，只需对一张集合的图片上命名就可以了，不需要对每一个小元素进行命名，从而提高了网页的制作效率。
更换风格方便，只需要在一张或少张图片上修改图片的颜色或样式，整个网页的风格就可以改变。维护起来更加方便。

cellpadding和cellspacing

div 元素的哪些 CSS 属性的默认值为 0？

`text-shadow`属性

1	text-shadow: h-shadow v-shadow blur color;

h-shadow指的是水平阴影，必需
v-shadow是垂直阴影，必需
blur模糊 color颜色
可以说是：
阴影离开文字的横方向距离，阴影离开文字的纵方向距离，阴影的模糊半径，阴影的颜色

百分比单位

宽泛的讲这个百分比单位应该是相对于父元素的，但也有特例的情况：

line-height的百分比是相对于自身字体的大小
fixed定位的百分比是相对于视口的

理论上的最小动画间隔

多数显示器的刷新率是60hz 即每秒刷新60次，所以理论上最小间隔是1/60*1000ms=16.7ms

css预编译工具

CSS 预编译工具有stylus，sass，less

`list-style-type`

//标记圆圈（默认）
list-style-type:circle;
//方块
list-style-type:square;

伪类和伪元素的区别

1	伪类 :link :hover 伪元素 ::before ::after

其中伪类和伪元素的根本区别在于：它们是否创造了新的元素,, 这个新创造的元素就叫 “伪无素” 。
伪元素/伪对象：不存在在DOM文档中，是虚拟的元素，是创建新元素。这个新元素(伪元素) 是某个元素的子元素，这个子元素虽然在逻辑上存在，但却并不实际存在于文档树中.
伪类：存在DOM文档中，(无标签,找不到, 只有符合触发条件时才能看到 ), 逻辑上存在但在文档树中却无须标识的“幽灵”分类。

css继承

只有颜色，文字，字体间距行高对齐方式，和列表的样式可以继承

`text-overflow`

text-overflow: ellipsis;使超出的文字部分变成「…」()

`@font-face`

css使用服务端字体的方式@font-face

`currentColor`

css3拓展了颜色值包括了currentColor关键字，它的值是计算之后的color值，当它被应用在color属性自身，相当于color: inherit

css注释

1	/this is a comment/

变量提升，函数提升

用var声明的变量会先在全局创建好然后赋值为undefined，最后在赋值为相应的值。

var jojo = 'jostar';
//其实是
var jojo = undefined;
jojo = 'jostar'

这就是变量提升。如果有多个同名变量提升，后面会覆盖前面的
函数提升的话，是js引擎把函数声明提前到了整个作用域的顶部，
举例

function hoistFunction() {
    foo(); // output: I am hoisted

    function foo() {
        console.log('I am hoisted');
    }
}

hoistFunction();
//实际上是
function hoistFunction() {
    function foo() {
        console.log('I am hoisted');
    }

    foo(); // output: I am hoisted
}

hoistFunction();

如果有多个同名函数提升后面的会覆盖前面的
那么会考察到变量提升和函数提升是什么时候呢？

var a = 1;
function fn(){
    var a = 2;
    function a(){console.log(3);}
    return a;
    function a(){console.log(4);}
}
var b = fn();
console.log(b);

这个时候是输出什么呢？
可以知道函数提升是大于变量提升的，所以此时的预编译应该是

function fn(){
    function a(){console.log(4);}
    var a;
    a=2;
    return a;
}
var a;
var b;
a=1;
b=fn();
console.log(b);//2

==与null与undefined

在==的情况下，null和undefined与其他任何有意义的值比较都是返回false，只有它们两个比较的时候会返回true

split

split方法只能检测正则或者字符串，如果不是则返回typeerror

history的back go forward

go里面带数字正数表示前进负数表示后退

JavaScript的全局函数

个人记忆方法：6（编码相关）+ 2（数据处理）+ 4（数字相关）+ 1（特殊）
编码相关：
escape()、unescape()、encodeURI()、decodeURI()、
encodeURIComponent()、decodeURIComponent()
数据处理：
Number()、String()
数字相关：
isFinite()、isNaN()、parseFloat()、parseInt()
特殊：
eval()

ps:对于 getClass() 方法不确定，菜鸟教程上没有，Chrome 控制台也没提示。

类型转换

在js中任何对象转化为布尔值都是true
只有0,-0,NaN,"",null,undefined这六个值转化为布尔值才是false

js原始值

ECMAScript中，变量可以存放两种类型的值，即原始值和引用值。
原始值是存储在栈中的简单数据段，也就是说，它们的值直接存储在变量访问的位置。
引用值是存储在堆中的对象，也就是说，存储在变量处的值是一个指针，指向存储对象的内存处。
ECMAScript中有5种原始类型，即undefined、null、number、string、boolean。
选项中的值分别是：string、number、null，而最后一个是数组，数组是一个对象，所以是引用值。

对话框

prompt()

defineProperty

defineProperty为对象设置属性后，该属性的描述符writable、configurable以及enumberable默认为false。
configurable：可否修改，false则不能被删除等
enumberable：可否枚举，false则不能被遍历，输出长度没有该项，不能打印该项

Math函数

call 、bind 、 apply

返回的第一个参数都是this指向的对象，区别在第二个参数，
call的第二个参数必须用逗号分割p1,'xx1','xx2'
apply的第二个参数必须用数组p1,['xx1','xx2']
bind和call一样除了返回是函数
有两种情况需要注意，传null或undefined时，将是JS执行环境的全局变量。浏览器中是window，其它环境（如node）则是global。

请求头

支持冒泡的函数

symbol

this

在本题中，var func = user.getCount其实相当于var func = function(){return this.count}this指向的是window而不是user 所以会返回undefined

`var a=b=3`

相当于var a=3 b=3此时b是全局变量

定义函数的方式

点操作符

通过点操作符添加的属性会添加到数组最后一位
不可以用foreach遍历
不会影响length的值
可以用forin遍历此时遍历出来的只有点操作符添加的属性

+和-

在+的情况下，如果有一者为字符串那么最后返回的结果是字符串
在-的情况下，返回数字

==的隐式转化

在==的隐式转化中，是对两边进行Number(),
Number(true) = 1

闭包

in操作符

对于数组属性需要指定数字形式的索引值来表示数组的属性名称所以1 in [1],其中[1]的索引是0 返回false

&&和>

>的权重大于&&优先执行

微任务和宏任务

promise是微任务在当轮事件循环结束前执行
setTimeout是宏任务在下一轮事件循环执行

isNaN方法

如果不是数字，才返回true
escape方法：该方法返回对一个字符串编码后的结果字符串
eval方法：该方法将某个参数字符串作为一个JavaScript执行

`Object.is()`

其行为与===基本一致，不过有两处不同： +0不等于-0。 NaN等于自身。

CommonJS规范，在任何模块代码的作用域下内置了以下哪些变量？

浏览器不兼容CommonJS的根本原因，在于缺少四个Node.js环境的变量。 module exports require global 来自阮一峰

onerror事件

onerror 事件当图片不存在时,将触发；

delete篇

delete删除的是对象的属性或者说如果不是对象上的比如let const 这种不会挂载到window对象上面的属性就不能删除

js中的内置对象

`'0\0'`

在js中允许0作为除数，只有'0\0'的结果为NaN 其他都是Infinitely

动态语言和静态语言

看变量使用之前需不需要类型声明，需要的是静态不需要的是动态
静态语言（强类型语言）
静态语言是在编译时变量的数据类型即可确定的语言，多数静态类型语言要求在使用变量之前必须声明数据类型。
例如：C++、Java、Delphi、C#等。

动态语言（弱类型语言）
动态语言是在运行时确定数据类型的语言。变量使用之前不需要类型声明，通常变量的类型是被赋值的那个值的类型。
例如PHP/ASP/Ruby/Python/Perl/ABAP/SQL/JavaScript/Unix Shell等等。

运算

块内声明函数

在非严格模式下，块内声明函数可以用函数表达式的形式声明

构造器

构造函数的原型对象的构造器指回构造函数本身
构造函数里面如果不写return 那么返回创建的实例对象
写return 且return是一个基本数据类型的话还是返回创建的实例对象
return的是一个对象的话则返回该对象原本指向实例对象的this会被无效化

trycatch

try后面一定要接catch或者finally 也可以先catch后finally
然后如果存在finally 就一定会执行finally里面的内容
且如果finally是return的话，那么后面的内容就不会执行了。没有return才会执行后面的内容

数组api

filter是过滤出符合条件的元素。
every是检测数组是否所有元素都满足条件。
some是检测数组是否有满足条件的元素。
map是遍历数组，且对每个元素进行操作。

NaN相关

会改变数组的方法以及不会改变数组的方法

原型覆盖

如果用点操作符提前定义了原型中的一个属性，那么后面再定义原型的话会开辟新的空间覆盖掉原先的点操作符属性
如果点操作符后定义，那么原型中会增加属性

typeof

length

length是数组的属性不是方法且不用带括号

class

在class的方法里，前面有static 那么this指向类本身
没有static this指向类的实例化对象
类方法中有static 只能通过类调用不能通过实例化对象调用
类方法前面没有static 那该方法只能通过实例化对象调用不能通过类调用

foreach

该方法会忽略掉空元素

toString

toString会优先将小数点解析为数字小数点
所以存在这种情况会报错
2.toString()
正确的写法应该是
2. toString()
or
(2).toString()

跨域

只要协议、域名、端口有任何一个不同, 都被当作是不同的域。

函数的执行与赋值

以一道题来讲解

如果此时注释掉1
那么对于11行来说只是将a这个函数赋值给了btn，所以会在整个执行结束之后输出1，点击的时候不会执行b的内容
如果此时注释掉2
那么对于10行来说，函数a执行输出1 返回一个函数给btn 所以点击btn的时候会输出2

join方法

join是针对数组的把数组的内容拼接成字符串如果join内不加符号或者undefined默认用逗号隔开，如果是''则没有间隔

不支持冒泡

妈（mouseenter）妈（mouseleave）不（blur）（unload）让（resize）浪（load）费（focus）

eval

eval 将会返回对最后一个表达式的求值结果。

`hasOwnProperty`和`isPrototypeOf`

hasOwnProperty：是用来判断一个对象是否有你给出名称的属性或对象。不过需要注意的是，此方法无法检查该对象的原型链中是否具有该属性，该属性必须是对象本身的一个成员。
isPrototypeOf : 是用来判断要检查其原型链的对象是否存在于指定对象实例中，是则返回true，否则返回false。

函数加括号调用引号调用不加括号调用

加括号相当于立刻执行
不加括号正常执行
引号调用正常执行

`parseInt`

parseInt在第一个字符是非数字的时候返回NaN
在后面有字符是非数字的时候返回前面的数字

// 2. parseInt(string,raix)函数有两个参数
 // 2.1 注意:string字符串只会被解析从第一个字符开始直到不是数字的字符部分
 console.log(parseInt('223'));//223
 // 2.2 当字符串中间存在非数字,那么就只解析前面是数字的部分字符
 console.log(parseInt('22e3'));//22
 // 2.3 如果字符串中第一个字符就不是数字,那么返回NaN 
 console.log(parseInt('e21'));//NaN

原型和隐式原型

注意只有实例化的对象才有隐式原型

判断一个对象是否存在

symbol

symbol不参与运算会报错

集合A转化为数组？

Array.from(arr, mapfn,thisArg)方法，用于将两类可以把对象转换为真正的数组：类似数组的对象和可遍历的对象（部署了Iterator接口的，String，ES6新增的Map和Set）。可以传3个参数，其中第一个是数组，必传；第二个是一个函数（类似map函数），对数组元素进行操作后再返回数组，可选；第三个是对于this关键字的指向，可选。
slice() 方法可从已有的数组中返回选定的元素。
返回值：返回一个新的数组，包含从 start 到 end （不包括该元素）的 arrayObject 中的元素。
说明
请注意，该方法并不会修改数组，而是返回一个子数组。如果想删除数组中的一段元素，应该使用方法 Array.splice()。
所以在这里就是对集合A应用slice，返回一个新的数组，不对数组做任何改变。
展开运算符，把A集合的元素展开后，用数组[]承载，返回新的数组。
map() 方法返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。
map() 方法按照原始数组元素顺序依次处理元素。
注意： map() 不会对空数组进行检测。
注意： map() 不会改变原始数组。
所以map方法返回了一个新的数组，并且数组中每个元素是A里面的元素。

`Object.defineProperty(obj

不能监视数组的变化。原因：defineProperty是监视对象的属性，且对于数组来说，要监听到length的变化首先就必须设置configurable为真，但是各大浏览器不允许这样设置吗，所以导致push``pop等修改数组原长度的方法无法被监听到。
vue能实现数组的监听原理是将一个新数组赋值给旧数组而不是修改原数组，这样的话性能开销其实还是有点大。

hash模式原理

通过onhashchange事件，监听url的修改
优点是可以快速上线，直接使用缺点是不美观且移动端有限制会报错
history模式是传统的url模式，优点是不会影响到url的美感，缺点是需要后端的配合。

挂载

如果不是在脚手架环境下，vue的挂载需要el（重要！！）

nextTick

在created等还没生成dom的钩子中，想要操作dom可以将操作放到nextTick的回调函数里。
因为nextTick是等dom更新完后才执行操作

父子组件的生命周期

加载渲染过程：（注意是子先挂载完毕）
父beforeCreate 父created 父beforeMount 子beforeCreate 子created 子beforeMount
子mounted 父mounted
子组件更新过程：
父 beforeUpdate 子beforeUpdate 子updated 父updated
父组件更新过程：
父 beforeUpdate 父updated
销毁过程：（子先销毁完毕）
父beforeDestroy 子beforeDestroy 子destoryed 父destoryed

watch初始化监听第一次

加immediate:true

`vue-lazyload`

vue的懒加载插件
img标签中使用懒加载：v-lazy 代替 v-bind:src ；
背景图片中使用懒加载：v-lazy:background-image = "" ==>> 注意图片和盒子大小问题，否则显示可能有问题哦。
使用的时候不一定要加上:key属性因为可能会由于key相同导致图片不刷新

全局路由守卫的钩子

全局路由守卫的钩子函数有： beforeEach（全局前置守卫）、beforeResolve（全局解析守卫）、afterEach（全局后置守卫）

服务端渲染和客户端渲染

vuex的ajax

actions一般操作异步 mutations同步所以写在actions里面

钩子间共享数据

`keep-alive`

组件设置了该属性才会有activated和deactivated两个钩子
max属性控制最多可以缓存多少组件实例。一旦这个数字达到了，在新实例被创建之前，已缓存组件中最久没有被访问的实例会被销毁掉

show和if

v-show本质是通过设置css中的display:none来控制隐藏
v-if本质是动态的向dom树添加或者删除元素
经常切换用show 反之用if

promise的状态

pending进行中
fulfilled已成功
rejected已失败

promise的固化

如果已经走了resolve 就不会继续走下一步了

返回值

promise的return值如果是个常量会包装成一个成功的promise对象

如果没有return 那么默认是return一个undefined 而undefined也属于常量所以是成功的回调
如果返回的不是常量就看情况定

宏任务和微任务

微任务：promise
宏任务：setTime系列
微任务在js机制中会被放到宏任务的前面，所以微任务先执行

`async`和`await`

await返回的是一个promise 然后包括async之后返回的也是一个promise
并且await的函数执行完才执行下一步，且下一步的任务是微任务（！！！）
如果await执行的函数没有返回return Promise.reject(new Error())那么就是一个成功的回调

async是同步函数