MyNotes

---

---

Flex布局

一、Flex布局表示弹性布局，为盒模型提供最大灵活性

​ webkit内核浏览器，需要加上 -webkit前缀
​ 在父级元素设置为flex布局后，子元素的float，clear，vertical-align属性失效

二、flex 容器的一些属性

​ 1.flex-direction ： 设置容器主轴的方向
​ flex-direction:row | row-reverse | column | column=reverse;
​ row：【默认】表示沿水平方向，由左到右。
​ row-reverse ：表示沿水平方向，由右到左。
​ column：表示垂直方向，由上到下。
​ column-reverse:表示垂直方向，由下到上

2.flex-wrap ： 用于设置当项目在容器中一行无法显示的时候如何处理。
flex-wrap:nowrap | wrap | wrap-reverse;
nowrap：表示不换行。
wrap：正常换行，第一个位于第一行的第一个。
wrap-reverse：向上换行，第一行位于下方。

3.flex-flow ： flex-deriction和flex-wrap属性的简写，默认值为[row nowrap];

4.justify-content ： 用于设置项目在容器中的对齐方式。
justify-content: flex-start | flex-end | center |space-between | space-around
flex-start：【默认】，左对齐
flex-end：右对齐。
center：居中对齐。
space-between：两端对齐。
space-around：每个项目两侧的间距相等。

5.align-items
align-items:flex-start | flex-end | center | baseline | stretch
flex-start:交叉轴的起点对齐。
flex-end 交叉轴的终点对齐。
center 交叉轴居中对齐。
baseline 项目的第一行文字的基线对齐。
stretch：【默认】：如果项目未设置高度或者高度为auto，将占满整个容器的高度

6.align-content
只适用多行的flex容器（也就是flex容器中的子项不止一行时该属性才有效果），它的作用是当flex容器在交叉轴上有多余的空间时，
将子项作为一个整体（属性值为：flex-start、flex-end、center时）进行对齐。

7.order 属性 ： 设置项目排序的位置，默认值为0，数值越小越靠前
order:;

8.flex-grow 属性 ： 用来控制当前项目是否放大显示。默认值为0，表示即使容器有剩余空间也不放大显示。如果设置为1，则平均分摊后放大显示。
flex-grow:2;

9.flex-shrink 属性 ： 表示元素的缩小比例。默认值为1，如果空间不够用时所有的项目同比缩小。如果一个项目的该属性设置为0，则空间不足时该项目也不缩小。

10.flex-basis ： 表示表示项目占据主轴空间的值。默认为auto，表示项目当前默认的大小。如果设置为一个固定的值，则该项目在容器中占据固定的大小。

11.flex ： 表示flex-grow属性、flex-shrink属性、flex-basis属性的简写。默认值为：0 1 auto；
flex:(0 1 auto) | auto(1 1 auto) | none (0 0 auto)

12.align-self属性 ： 表示当前项目可以和其他项目拥有不一样的对齐方式
align-self: flex-start | flex-end | center | baseline | stretch

---

---

Promise（异步操作编程）

​ 目的：（1）避免回调地狱 （2）提供简洁的API，异步操作更容易
​ 三种状态：1.pendding//正在请求 2.resolved //成功 3.reject//失败
​ 基本用法：new promise（function（resolved，reject{}））
​

promise…then then中传递resolved和reject两个参数。
promise…catch catch捕获失败异常
promise.all（） all里面的对象数组，里面的数组都为resolved时，该对象才为resolved，否则为reject
promise.race() 里面参数为对象数组，看谁先执行，谁先执行了是何种状态，该对象就为何种状态。

---

---

闭包

​ 闭包的使用场景：
​ 1.函数内部变量可以取读外部变量，但是函数外部变量不可取读内部变量时使用闭包，当函数外部变量需要访问函数内部变量时，
​

​ 使用闭包将函数内部函数作为返回值直接返回给外部函数，则外部函数就可以直接访问内部函数。

​ 2.防止内存泄漏，当外部函数执行结束后，执行环境的生命周期结束，内存被垃圾收集器释放，通过闭包将内部函数内部函数赋值
​
​ 给全局变量，这样相当于变量被保留下来。
​
闭包形成的条件： （）

​ 函数嵌套；

​ 内部函数引用外部函数的局部变量

---

---

ABOUT OBJECT

Object.keys(): 处理对象，返回一个可枚举的->属性<-数组

​ 处理数组，返回索引值的数组。

​ 处理字符串，返回字符串索引值的数组。

​ 常用来获取属性对应值做相应处理=====》 Object.keys(person).map((key)=>{ console.log(person[key] ); })

Object.values(): 返回一个数组，成员是参数对象自身(不含继承)的所有可遍历属性的键–>值<–。

​ 返回数组的成员顺序，与属性的遍历部分的排列规则一致。 （属性名为数值的属性，是按照数值大小，从小到大遍历的。）

​ 只会遍历对象自身的可遍历属性

​ Object.values会过滤属性名为 Symbol 值的属性

Object.entries(): Object.entries方法返回一个数组，成员是参数对象自身的（不含继承的）所有可遍历（enumerable）属性的键值对数组.

​ 如果原对象的属性名是一个 Symbol 值，该属性会被省略.

​ 遍历对象的属性.

​ 将对象转为真正的Map结构

---

---

数据库事务

1.单条SQL语句，数据库系统自动将其作为一个事务执行，这种事务被称为隐式事务。
2.多条SQL语句作为一个事务执行，使用BEGIN开启一个事务，使用COMMIT提交一个事务，这种事务被称为显式事务
提交事务——把事务内的所有SQL所做的修改永久保存。如果COMMIT语句执行失败了，整个事务也会失败。
语法：BEGIN;
SQL1;
SQL2;…
COMMIT;
事务回滚——让事务失败，这时，可以用ROLLBACK回滚事务，整个事务会失败
语法：BEGIN;
SQL1;
SQL2;…
COMMIT;

事务的隔离级别
并发执行事务，同时操作同一条记录可能会引发的问题；数据的不一致性，包括脏读、不可重复读、幻读等

Isolation Level	脏读（Dirty Read）	不可重复读（Non Repeatable Read）	幻读（Phantom Read）
Read Uncommitted	Yes	Yes	Yes
Read Committed	-	Yes	Yes
Repeatable Read	-	-	Yes
Serializable	-	-	-

---

---

JavaScript 的常用方法

​ String
1.charAt：返回在指定位置的字符 Str.charAt(3)

2.chartCodeAt(): 返回指定位置的字符编码 Str.chartCodeAt(a)

3.concat(): 连接字符串 str1.concat(str2)

4.indexOf(): 检索字符串,返回字符在字符串的下表 str.indexOf(“123”) 找不到匹配内容返回-1

5.match():在字符串内检索指定的值或找到一个或多个正则表达式的匹配项，返回的是值不是位置。 str1.match(“karry”)

6.replace(): 替换匹配的字符串 str1.replace(str1.match(‘hao’),str2.match(‘lixi’)) str2替换str1

7.search(): 检索与字符串匹配的字符串，返回地址 str1.search(str2) 返回第一个字符所在位置 未检测到返回-1

8.slice()： 提取字符串片段,并在新的字符串中返回被提取的部分 str1.slice(4,9)

9.split(): 把字符串分割成数组 str1.split("-")

10.toLocaleLowerCase()：把字符串转换成小写 str.toLocaleLowerCase() toLowerCase()

11.toLocaleUpperCase()：把字符串准换成大写 str.toLocaleUpperCase() toUpperCase()

12.substr(): 从其实索引号提取字符串中指定数目的字符

13.subString()：提取字符串中两个指定索引号之间的字符
var str3 = str.substring(3,19);//字符串中空格占位置，从3开始，到18结束
var str4 = str.substr(3,19);//空格不占位。从3开始到19结束

​

​ 数组 Array

1.slice[start,end]: 返回原数组中指定开始下标到结束下标之间的组成新的数组(原数组不变);
1个参数：n，即n到末尾的所有
2个参数：[start,end]
var arr1 = arr.slice(2,6)

2.splice(): 删除，2个参数，起始位置和删除的项数

​ var arr1 = arr.slice(2,3) 实际得到的新数组的项数是end-strat

3.pop()：删除数组的最后一个元素，减少数组的长度，返回被删除的值 arr.pop();

​

4.push()：将参数添加到数组的最后，返回新数组的长度 arr.push(6,7,8);

5.shift()：删除数组的第一个参数，数组的长度减1，无参 arr.shift();

6.unshift()：像数组的开头添加一个或更多的元素，并返回新的长度。（参数不限） arr.unshift(2,4,5,{name:‘liqi’});

​

7.sort():按指定的参数对数组进行排序，返回的值是经过排序后的数组（无参，函数） arr.sort();

8.concat(3,4)：把两个字符串连接起来，返回的值是一个副本（参数不限）arr1.concat(3,arr1)

​

9.join()：将数组的元素组成一个字符串 var arr2 = arr1.join(’,’);//以逗号分隔
var arr3 = arr1.join(’’);//以空格分隔

10.indexOf():从数组的开头向后查找，接受两个参数，要查找的项和查找起点的位置索引
var num = arr.indexOf(78,3);//查找78所在的位置

11.foeEach():对数组的每个元素执行一次提供的函数。array1.forEach(function(element) {
console.log(element);
});

12.对数组的每一项运行给定的函数，返回没次函数调用的结果组成的数组
array1.map(x => x * 2); //对数组的每项*2

13.for in：遍历数组

​
​

ES5常用方法

1.every是所有函数的每个回调都返回true的时候才会返回true，当遇到false的时候终止执行，返回false。

2.some函数是存在有一个函数返回true的时候终止执行并返回true，否则返回false

3.Array.isArray(obj) Array对象的一个静态函数，用来判断一个对象是不是数组

4.filter(function(element)) 返回数组的一个子集，回调函数用于逻辑判断是否返回，返回true则把当前元素加到返回数组中，false则不加

5.reduce(function(v1,v2),value) / .reduceRight(functio(v1,v2),value)

​ console.log(arr.reduce(function(v1,v2){
​ return v1 + v2;
​ })) // 21
​ //开始是1+2 = 3，之后3+3 =6，之后6+4 =10，之后
​ //10+5 =15，最后15+6 =21
​ console.log(arr.reduce(function(v1,v2){
​ return v1 - v2;
​ },100)) // 79
​ //开始的时候100-1=99，之后99-2=97，之后97-3=94，之后
​ //94-4=90，之后90-5=85，最后85-6=79