牛客网刷题笔记（第一天）

1.JavaScript数据类型

JavaScript是一种弱类型或者说动态语言。这意味着不用提前声明变量的类型,在程序运行过程中,类型会被自动确定,而且变量的数据类型是可以变化的。

JS把数据类型分为两类:

1. 简单数据类型(Number,String,Boolean,Undefined,Null)
2. 复杂数据类型(object)

2.元素显示模式

HTML一般分为块元素、行内元素和行内块元素

1. 常用的块元素： div、h1-h6、p、ul、ol、dl、li、table、form等
2. 常用的行内元素 a、strong、b、em、i、del、S、ins、u、span等
3. 常用的行内块元素 img、input、td等

3.页面性能指标

白屏时间（first Paint Time）——用户从打开页面开始到页面开始有东西呈现为止
首屏时间——用户浏览器首屏内所有内容都呈现出来所花费的时间
用户可操作时间(dom Interactive)——用户可以进行正常的点击、输入等操作，默认可以统计domready时间，因为通常会在这时候绑定事件操作
总下载时间——页面所有资源都加载完成并呈现出来所花的时间，即页面 onload 的时间
白屏时间first paint 和可交互时间dom ready的关系是：先触发first paint，后触发dom ready

4.文档类型和浏览器模式

浏览器有两种呈现模式：标准模式和混杂模式(quirks mode)。在标准模式中，浏览器根据规范呈现页面；在混杂模式中，页面以一种比较宽松的向后兼容的方式显示。

1.<!DOCTYPE> 声明位于文档中的最前面，处于html标签之前。告知浏览器的解析器，用什么文档类型规范来解析这个文档。
2.严格模式的排版和 JS 运作模式是以该浏览器支持的最高标准运行。在混杂模式中，页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作。
3.DOCTYPE不存在或格式不正确会导致文档以混杂(兼容) 模式呈现。

5.JS运算符

1.console.log(1+ +"2"+"2");

第一个+"2"中的加号是一元加操作符，相当于Number()函数，+"2"会变成数值2，因此1+ +“2"相当于1+2=3. 然后和后面的字符串“2”拼接，变成了字符串"32”.

2.console.log("A"- "B"+"2");

“A”-“B"的运算中，需要先把"A"和"B"用Number函数转换为数值，其结果为NaN，在减法操作中，如果有一个是NaN，则结果是NaN，因此"A”-"B"结果为NaN。
然后和"2"进行字符串拼接，变成了NaN2。

3.console.log("A"-"B"+2);

“A”-"B"结果为NaN，然后和数值2进行加法操作，在加法操作中，如果有一个操作数是NaN，则结果为NaN。

6.局部、全局变量

var a=b=3;

在函数体中这样的变量声明赋值相当于var a=3；b=3；其中a是局部变量，而b是全局变量

7.fieldset和legend标签

1. fieldset 标签可以将表单内的相关元素分组。
2. fieldset 标签会在相关表单元素周围绘制边框。
3. legend 标签为 fieldset 元素定义标题。

<form>
 <fieldset>
  <legend>Personalia:</legend>
  Name: <input type="text"><br>
  Email: <input type="text"><br>
  Date of birth: <input type="text">
 </fieldset>
</form>

8.DOM事件流

1. DOM0级事件
   就是直接通过 onclick 等方式实现相应的事件
   这说明 DOM0 级添加事件时，后面的事件会覆盖前面的事件，而 DOM2级则不会，多个事件都会执行；
   另外，DOM0级事件具有很好的跨浏览器优势，会以最快的速度绑定，但由于绑定速度太快，可能页面还未完全加载出来，以至于事件可能无法正常运行

2. DOM1级事件
   因为DOM 1一般只有设计规范没有具体实现,所以一般跳过

3. DOM2级事件
   主流浏览器 DOM2 级事件是通过以下两个方法用于处理指定和删除事件处理程序的操作
   只有DOM2事件流包括三个阶段：

1. 事件捕获阶段
2. 处于目标阶段
3. 事件冒泡阶段