数据类型之 undefined 和null
1. 含义：
是JavaScript 中的数据类型
2. 区别：
undefined：表示没有数值（应该是有数值，但是现在没有）
eg. 定义int1，但是没有赋值数据
var int1；
console.log（int1）
null：表示数值为空 （表示有数值，但是数值为空）
3. 注：
也可以给直接赋值undefined和null，但是必须小写。
eg. 定义一个变量，直接给变量赋值undefined和null
var int2 =null；
console.log(int2);
执行结果：null
var int3 =undefined；
console.log（int3）；
执行结果：undefined
4. 总结：
1> 在JS中，表示的是一种数值。
2> 赋值时，必须严格遵守大小写规范。
3> 并且，不能带引号，如果有引号，就是字符串，就不是原有的数据了。
5. 定义未赋值变量和未定义变量的区别：
1> 定义未赋值，只是定义了变量，但是没有给变量进行赋值效果
eg.
var int 1;
console.log(int1)
未赋值，所以执行结果是undefined
2> 直接使用一个没有定义过的变量
eg.
console.log(int2)
未定义，执行结果是报错
大家好 我是逆战班的学员 来做个知识点的总结:
flex布局
Flex弹性布局元素，主要分为两种：
1>语法添加到父容器上（display:flex）
2>语法添加到子容器上
1.添加到父容器上的语法
(1) display:flex
(2) flex-direction::(row:布局的排列方向)主轴排列方向
值：row(默认值) 显示为行，方向为当前文档水平流方向，默认从左往右。
row-reverse:显示为行，方向和row属性相反
column：显示为列
colum-reverse：显示为列，属性和column属性相反
(3)flex-wrap:用来控制弹性盒是否进行换行处理
值：no-wrap：（默认）不换行
wrap：换行处理
wrap-reverse：（折行的反向操作）反向换行
(4) flex-flow:是flex-direction和flex-warp的复合写法，第一个值表示方向，第二个是换行
(5)justify-content:决定了主轴方向上子项的对齐和分布方式
值：flex-start：（默认值）表现为子项都去起始位置对齐
flex-end:子项都去结束位置对齐
center：子项都去中心位置对齐
space-between：表现为两端对齐，between是中间的意思，意思是多余的空白间距只是元素中间分配区域。
space-around：意思是每个flex子项两侧都环绕互不干扰的等宽的空白间距，最终视觉上边缘两侧的空白只有中间空白宽度一半
space-evenly:每个flex子项两侧空白间距完全相等。
(6)align-items: 指的是flex所有每一行中的子元素上下对齐方式。
值：stretch:（默认）flex子项拉伸
flex-start：表现为容器子项顶对齐
center：表现为中心对齐
flex-end：表现为底部对齐
(7) align-content : 跟justify-content相反的操作。侧轴的对齐方式。(最少需要两行才能看出效果，因为他是多行的一个上下对齐方式)
值：stretch:（默认）每一行子元素都等比拉伸
space-around：每一行元素上下都享有独立不重叠的空白空间
space-evenly:每一行元素都上下等分
flex-start：表现为起始位置对齐
flex-end:表现为结束位置对齐
center：表现为中心位置对齐
space-between：表现为两端对齐，
2.作用在flex子项上的css属性
（1）order：所有flex子项order默认值为0（排序）
（2）flex-grow: 扩展 ( 想看到扩展的效果，必须有空隙 )
值：0 : 默认值 , 不去扩展
1 : 去扩展 , 会把空白区域全部占满
（子元素会按照设置的比例值来分配空隙，如果比例值总和小于1，那么会有空隙，如果比例值总和大于等于1，那么就没有空隙。）
（3）flex-shrink : 收缩
值：1（默认值）表示收缩
0表示不收缩，.5收缩小一些，2收缩大一些。（大小是跟正常缩放1进行比较的）
（4）flex-basis：跟flex-shrink/flex-grow很像。
flex-shrink/flex-grow是设置一个比例值，flex-basis是设置一个具体值。
（5）flex : 一种复合写法
flex-grow flex-shrink flex-basis
flex:1;
flex : 1 1 0
flex:0;
flex : 0 1 0
（6）algin-self:：控制单独某一个子项的垂直对齐方式
值：stretch:（默认）flex某一个子项拉伸
flex-start：表现为顶对齐
center：表现为中心对齐
flex-end：表现为底部对齐
注意点：
1>：默认情况下，在弹性盒子中的子元素的左右排列的。
2>水平是主轴的时候：默认情况下，当宽高不写的时候，宽度由内容决定，高度由父容器决定。
3>垂直是主轴的时候：默认情况下，当宽高不写的时候，宽度由父容器决定，高度由内容决定。
4>当子项的总宽度大于父容器的时候，会自动收缩的（弹性的优先级是大于自身固定大小的）
5>当子项的内容已经达到了父容器最小宽高的时候，就会出现溢出的现象。