1 CSS实现垂直水平居中
HTML结构：
<div class="wrapper">
<div class="content"></div>
</div>
CSS：
.wrapper{position:relative;}
.content{
background-color:#6699FF;
200px;
height:200px;
position: absolute; //父元素需要相对定位
top: 50%;
left: 50%;
margin-top:-100px ; //二分之一的height，width
margin-left: -100px;
}
2 简述同步和异步的区别
同步是阻塞模式，异步是非阻塞模式 .
同步就是指一个进程在执行某个请求的时候，若该请求需要一段时间才能返回信息，那么这个进程将会一直等待下去，直到收到返回信息才继续执行下去；
异步是指进程不需要一直等下去，而是继续执行下面的操作，不管其他进程的状态。当有消息返回时系统会通知进程进行处理，这样可以提高执行的效率。
3 Javascript 部分
javascript的简史
1995年的时候，有网景公司开发，当时名字叫LiveScript，为了搭Java的顺风车，改名为javascript
与此同时，微软因此在自身的浏览器里，也推出了自己的脚本语言jscript
1997年的时候，由ECMA出面，推出了一套javascript的规范，提出js由三部分组成
ECMAScript
基础语法
DOM
文档对象模型
BOM
浏览器对象模型
2003年之前，网易界面上的弹窗广告几乎都是由js做的，被人称作牛皮藓
2004年的时候，JS的命运发生改变，
2007年的时候，苹果公司推出的手机，可以用来上网
2010年的时候，H5的出现，canvas又推高了js的地位
2011年的时候，node.js将js语言伸向后服务器端
js语言特性
是世界上使用最多的脚本语言
弱类型语言
动态语言
客户端的脚本语言
js书写位置
链接式
<script src=".js"> </script>
嵌入式
<script></script>
数据类型
基本数据类型
number
string
boolean
null
undefined
复杂数据类型
Date
object
Array
function
变量
变量赋值
var i=number；
var i=“string”；
命名规则
变量的命名一定要有意义
以字母(a-z大小写字母 ),"_"或$开头，绝对不能以数字开头，可以包括字母，数字，下划线，$,严格区分大小写，绝对不能使用系统中的关键字或是保留字
推荐使用驼峰命名法：如userName,hightSchool
+运算符的作用
字符串之间 ，起连接作用
数字之间，起运算作用
Typeof关键字
string
number
运算符
算术运算符
一元运算符
++ --
二元运算符
+ - * / %
关系运算符
比较运算符
> < >= <=
相等运算符
== != === !==
逻辑运算符
&& || ！
运算符的优先级
数字(算术运算符)>关系运算>逻辑运算符>赋值运算符
复合赋值运算符
将数学运算符和赋值运算符合起来一块写了
数据类型的转换
转number
隐式
+ - * / %
显示
parseInt（）
Number（）
parseFloat（）
转string
隐式
+“”
显式
.toString()
String()
转boolean类型
隐式
！！
显式
Boolean()
语言结构
顺序结构
分支结构
if
只能判断 一种情况
if（判断条件）{
要执行的代码
}
if else-if
判断两种情况
选择结构
三元表达式
表达式1 ？表达式2 ： 表达式3 ；
if - else
switch-case
多种情况的一种
if-else 和 switch-case的区别
相同点
都可实现多分支结构
不同点
if -else if：可以处理区间范围
switch只能用于定值比较
短路运算
&&
转换为boolean类型的值为false的情况
||
转换为boolean类型的值为true的情况
！
循环结构
while
while（循环条件）{
循环体（要执行的代码）
}
do while
do{
循环体
} while （循环条件）
for
for （表达式1 ；表达式2 ； 表达式3 ）{
循环体；
}
for in
break 和 continue
break
用在switch-case ，用于跳出当前程序
用再循环当中 ，while或者for循环 ，与if搭配使用（ 作用：立即跳出当前循环，后面代码都不执行）
continue
只结束当前本次循环
数组
使用构造函数创建数组
var arr = new Array ();
arr[]=0;
使用字面量方式创建数组
var arr =[ 1,2,3,4,5,6,7];
for ( var i=0;i<arr.length; i++){
console.log(arr[i]);
}
函数
定义:
使用函数声明的方式定义
组成
function 函数名( 参数 ) {
函数体( 可执行的代码 ) ;
}
函数名
参数
返回值
形参和实参
在函数定义的时候，使用的参数叫做形参，起占位置的作用
在函数真正的调用的时候，传入的数据，才是实参
函数表达方式
声明函数
function 函数名(){
要执行的代码;
}
匿名函数
var fun =function (){
要执行的代码;
}
区别
1.函数的声明中的函数有名字
2.函数表达式中的函数没有名字，是匿名函数，前面的变量的名字可以看做是函数的名字
3 在函数预解析的时候，会先将函数声明提前到作用域的最前面，而函数表达式不会提升
4 函数声明中的函数，可以在声明之前调用，但是函数表达式的函数必须在函数表达式之后调用
return
函数中无return
默认返回值:undefined
函数中有return
return后面没有数据
返回值是:undefined
return后面有数据
该数据是返回值
函数的嵌套
定义:在一个函数里,调用另一个函数
四种形式
无参无返回值
仅仅是代码的复用(用处比较多)
无参有返回值
仅仅是函数的调用, 没有输出语句
有参无返回值
只要没有return关键返回的数据，就没有真正的返回值，仅有默认的返回值undefined
有参有返回值
(实际用处最多)
重载
定义:函数名相同，但是函数的形参个数不同，或者形参的数据类型不同，这样就构成了函数的重载
注意 : JS中没有函数的重载,如果JS中有重名的函数，后面的函数会将前面的函数覆盖掉
变量的作用域
全局作用域
同一个1.5.1页面中的script标签之间的区域
全局作用域内的变量就是全局变量，在全局作用域内定义的变量是全局变量，可以在页面的任何地方访问的到(包括函数内部)
在函数内部不使用var定义的变量，也是全局变量
局部作用域
函数内部就是局部作用域
一个函数就是一个局部作用域，局部作用域 内的变量称为局部变量
特殊函数
自执行函数
两种方式
(function(){
return a;
}() );
(function(){
return a;
}) () ;
过程:
自执行函数是没有名字的，定义了之后马上调用. 这种函数多用于一次性使用的时候 , 避免了函数名的冲突
回调函数
就是将函数做为参数进行传递
var a=10;
var fun(a){
return a+b;
}
var f2=function(a,ff){
return ff(a);
}
console.log(f2(a,fun));
内置对象
Math对象
Math.pow(a,b) a的 b 次方幂
Math.round(a) 四舍五入
Math.ceil(a) 向上取整
Math.floor(a) 向下取整
Math.PI() 圆周率
Math.abs() 绝对值
Math.sqrt(a) num开平方
Math.sin()
Math.cos()
Array对象
既可以作用于数组,
又可以作用于字符串
arr.valueOf 打印对象本身
arr.indexof() 从前面寻找该项,(后面有也不再找),得到该项的位置
arr.lastindexof() 从后面寻找该项,(前面有也不再找),得到该项的位置
slice ( a, b ) 截取数组(字符串)中的元素组成一个新数组(字符串)返回，原数组(字符串)不变 ,a 为索引
一个参数
从当前位置截取到最后
两个参数 b值取不到
b 值为正
从前数索引位置
b值为负
从后开始数的索引位置
arr.concat 连接两个数组或字符串
作用于数组
arr.toString 转换成字符串,且用","分割
arr.join() 数组转换成字符串
arr.unshift() 向数组前追加元素,得到数组长度
arr.shift() 删除数组第一项,得到删除数据
arr.push() 向数组后追加元素,得到数组长度
arr.pop() 删除数组最后一项,得到删除数据
arr.reverse() 翻转数组
arr.filter() 过滤 返回true的留下，返回false 过滤掉
arr.forEach() 循环遍历数组的每一项，可以遍历输出数组中的每一项及每一项的索引
splice ( a, b) 截取(删除)：会改变原数组
两个参数 删除
a : 将要删除的元素
b : 需要删除的个数
三个参数 替换
a : 将要删除的元素
b : 需要删除的个数
c : 删除后 取代添加的元素
作用于字符串
arr.split() 将字符串中的字符以某种字符 分割成数组中的元素 可以将字符串转换成数组
arr.substring( a,b ) 截取字符串中的元素组成一个新字符串返回，原字符串不变 ,a 为索引
一个参数
从当前位置截取到最后
两个参数 b值取不到
b 值为正
从前数索引位置
b值为负
从后开始数的索引位置
arr.substr( a,b ) 截取字符串中的元素组成一个新字符串返回，原字符串不变 ,a 为索引
一个参数
从当前位置截取到最后
两个参数
b值为长度
特殊用法
str.substr(-2); //传入负数，相当于传入length + (-2) 倒着截取
str.substr(2,-3); //第二个参数，如果传入负数相当于0 截取不到，为空
chatAt ( a ) 获取字符串中指定索引位置
charCodeAt () 获取字符串中指定索引位置的字符的ASCII码值
转换大小写
大写
arr.toUpperCase ( )
arr.toLocaleUpperCase ( )
小写
arr.toLowerCase ( )
arr.toLocaleLowerCase ( )
arr.trim ( ) 去除字符串前后的空格
arr.replace ( ) 替换字符串里面字符
arr.replace ( "a" ," w" ) 替换字符串里面字符
arr.replace ( /a/g ," w" ) 正则方式的全部替换
字符串 string
属性:length 是可以将字符串看成字符的数组
清空数组的三种方式
从0截取，截取整个数组
让数组的长度变为0
给数组重新赋值,使其为空数组
JS基础入门
javascript的简史
1995年的时候，有网景公司开发，当时名字叫LiveScript，为了搭Java的顺风车，改名为javascript
与此同时，微软因此在自身的浏览器里，也推出了自己的脚本语言jscript
1997年的时候，由ECMA出面，推出了一套javascript的规范，提出js由三部分组成
ECMAScript
基础语法
DOM
文档对象模型
BOM
浏览器对象模型
2003年之前，网易界面上的弹窗广告几乎都是由js做的，被人称作牛皮藓
2004年的时候，JS的命运发生改变，
2007年的时候，苹果公司推出的手机，可以用来上网
2010年的时候，H5的出现，canvas又推高了js的地位
2011年的时候，node.js将js语言伸向后服务器端
js语言特性
是世界上使用最多的脚本语言
弱类型语言
动态语言
客户端的脚本语言
js书写位置
链接式
<script src=".js"> </script>
嵌入式
<script></script>
数据类型
基本数据类型
number
string
boolean
null
undefined
复杂数据类型
Date
object
Array
function
变量
变量赋值
var i=number；
var i=“string”；
命名规则
变量的命名一定要有意义
以字母(a-z大小写字母 ),"_"或$开头，绝对不能以数字开头，可以包括字母，数字，下划线，$,严格区分大小写，绝对不能使用系统中的关键字或是保留字
推荐使用驼峰命名法：如userName,hightSchool
+运算符的作用
字符串之间 ，起连接作用
数字之间，起运算作用
Typeof关键字
string
number
运算符
算术运算符
一元运算符
++ --
二元运算符
+ - * / %
关系运算符
比较运算符
> < >= <=
相等运算符
== != === !==
逻辑运算符
&& || ！
运算符的优先级
数字(算术运算符)>关系运算>逻辑运算符>赋值运算符
复合赋值运算符
将数学运算符和赋值运算符合起来一块写了
数据类型的转换
转number
隐式
+ - * / %
显示
parseInt（）
Number（）
parseFloat（）
转string
隐式
+“”
显式
.toString()
String()
转boolean类型
隐式
！！
显式
Boolean()
语言结构
顺序结构
分支结构
if
只能判断 一种情况
if（判断条件）{
要执行的代码
}
if else-if
判断两种情况
选择结构
三元表达式
表达式1 ？表达式2 ： 表达式3 ；
if - else
switch-case
多种情况的一种
if-else 和 switch-case的区别
相同点
都可实现多分支结构
不同点
if -else if：可以处理区间范围
switch只能用于定值比较
短路运算
&&
转换为boolean类型的值为false的情况
||
转换为boolean类型的值为true的情况
！
循环结构
while
while（循环条件）{
循环体（要执行的代码）
}
do while
do{
循环体
} while （循环条件）
for
for （表达式1 ；表达式2 ； 表达式3 ）{
循环体；
}
for in
break 和 continue
break
用在switch-case ，用于跳出当前程序
用再循环当中 ，while或者for循环 ，与if搭配使用（ 作用：立即跳出当前循环，后面代码都不执行）
continue
只结束当前本次循环
数组
使用构造函数创建数组
var arr = new Array ();
arr[]=0;
使用字面量方式创建数组
var arr =[ 1,2,3,4,5,6,7];
for ( var i=0;i<arr.length; i++){
console.log(arr[i]);
}
函数
定义:
使用函数声明的方式定义
组成
function 函数名( 参数 ) {
函数体( 可执行的代码 ) ;
}
函数名
参数
返回值
形参和实参
在函数定义的时候，使用的参数叫做形参，起占位置的作用
在函数真正的调用的时候，传入的数据，才是实参
函数表达方式
声明函数
function 函数名(){
要执行的代码;
}
匿名函数
var fun =function (){
要执行的代码;
}
区别
1.函数的声明中的函数有名字
2.函数表达式中的函数没有名字，是匿名函数，前面的变量的名字可以看做是函数的名字
3 在函数预解析的时候，会先将函数声明提前到作用域的最前面，而函数表达式不会提升
4 函数声明中的函数，可以在声明之前调用，但是函数表达式的函数必须在函数表达式之后调用
return
函数中无return
默认返回值:undefined
函数中有return
return后面没有数据
返回值是:undefined
return后面有数据
该数据是返回值
函数的嵌套
定义:在一个函数里,调用另一个函数
四种形式
无参无返回值
仅仅是代码的复用(用处比较多)
无参有返回值
仅仅是函数的调用, 没有输出语句
有参无返回值
只要没有return关键返回的数据，就没有真正的返回值，仅有默认的返回值undefined
有参有返回值
(实际用处最多)
重载
定义:函数名相同，但是函数的形参个数不同，或者形参的数据类型不同，这样就构成了函数的重载
注意 : JS中没有函数的重载,如果JS中有重名的函数，后面的函数会将前面的函数覆盖掉
变量的作用域
全局作用域
同一个1.5.1页面中的script标签之间的区域
全局作用域内的变量就是全局变量，在全局作用域内定义的变量是全局变量，可以在页面的任何地方访问的到(包括函数内部)
在函数内部不使用var定义的变量，也是全局变量
局部作用域
函数内部就是局部作用域
一个函数就是一个局部作用域，局部作用域 内的变量称为局部变量
特殊函数
自执行函数
两种方式
(function(){
return a;
}() );
(function(){
return a;
}) () ;
过程:
自执行函数是没有名字的，定义了之后马上调用. 这种函数多用于一次性使用的时候 , 避免了函数名的冲突
回调函数
就是将函数做为参数进行传递
var a=10;
var fun(a){
return a+b;
}
var f2=function(a,ff){
return ff(a);
}
console.log(f2(a,fun));
内置对象
Math对象
Math.pow(a,b) a的 b 次方幂
Math.round(a) 四舍五入
Math.ceil(a) 向上取整
Math.floor(a) 向下取整
Math.PI() 圆周率
Math.abs() 绝对值
Math.sqrt(a) num开平方
Math.sin()
Math.cos()
Array对象
既可以作用于数组,
又可以作用于字符串
arr.valueOf 打印对象本身
arr.indexof() 从前面寻找该项,(后面有也不再找),得到该项的位置
arr.lastindexof() 从后面寻找该项,(前面有也不再找),得到该项的位置
slice ( a, b ) 截取数组(字符串)中的元素组成一个新数组(字符串)返回，原数组(字符串)不变 ,a 为索引
一个参数
从当前位置截取到最后
两个参数 b值取不到
b 值为正
从前数索引位置
b值为负
从后开始数的索引位置
arr.concat 连接两个数组或字符串
作用于数组
arr.toString 转换成字符串,且用","分割
arr.join() 数组转换成字符串
arr.unshift() 向数组前追加元素,得到数组长度
arr.shift() 删除数组第一项,得到删除数据
arr.push() 向数组后追加元素,得到数组长度
arr.pop() 删除数组最后一项,得到删除数据
arr.reverse() 翻转数组
arr.filter() 过滤 返回true的留下，返回false 过滤掉
arr.forEach() 循环遍历数组的每一项，可以遍历输出数组中的每一项及每一项的索引
splice ( a, b) 截取(删除)：会改变原数组
两个参数 删除
a : 将要删除的元素
b : 需要删除的个数
三个参数 替换
a : 将要删除的元素
b : 需要删除的个数
c : 删除后 取代添加的元素
作用于字符串
arr.split() 将字符串中的字符以某种字符 分割成数组中的元素 可以将字符串转换成数组
arr.substring( a,b ) 截取字符串中的元素组成一个新字符串返回，原字符串不变 ,a 为索引
一个参数
从当前位置截取到最后
两个参数 b值取不到
b 值为正
从前数索引位置
b值为负
从后开始数的索引位置
arr.substr( a,b ) 截取字符串中的元素组成一个新字符串返回，原字符串不变 ,a 为索引
一个参数
从当前位置截取到最后
两个参数
b值为长度
特殊用法
str.substr(-2); //传入负数，相当于传入length + (-2) 倒着截取
str.substr(2,-3); //第二个参数，如果传入负数相当于0 截取不到，为空
chatAt ( a ) 获取字符串中指定索引位置
charCodeAt () 获取字符串中指定索引位置的字符的ASCII码值
转换大小写
大写
arr.toUpperCase ( )
arr.toLocaleUpperCase ( )
小写
arr.toLowerCase ( )
arr.toLocaleLowerCase ( )
arr.trim ( ) 去除字符串前后的空格
arr.replace ( ) 替换字符串里面字符
arr.replace ( "a" ," w" ) 替换字符串里面字符
arr.replace ( /a/g ," w" ) 正则方式的全部替换
字符串 string
属性:length 是可以将字符串看成字符的数组
清空数组的三种方式
从0截取，截取整个数组
让数组的长度变为0
给数组重新赋值,使其为空数组
对象
自定义对象
与数学运算相关的封装到了一个Math对象中
与数组操作相关的呢，封装到了Arry数组对象当中
与日期相关的，封装到了Date这个对象当中
组成
属性
方法
创建自定义对象
var student = new Object(); //用构造函数的方式创建了一个空对象
student.name = "张三"; // 属性和变量是一样的，都是用来存储数据的
student.age = 20;
student.sex = "男";
student.sayHi = function(){
console.log("我叫"+student.name+"，我今年"+student.age+"岁了，我是"+student.sex+"生");
};
student.sayHi ( ) ;
批量创建对象
创建
function createStudent(name,age,sex){
var student = new Object();// 用构造函数的方式创建了一个空对象并返回
student.name =name;
student.age = age;
student.sex= sex;
student.sayHi= function(){
console.log("我叫"+student.name+"，我今年"+student.age+"，我是"+student.sex+"生");
};
return student;//将这个对象返回
}
调用执行
var zs = createStudent("张三",25,"男");
zs.sayHi();
this方法构造函数创建对象
this关键字
在JS中，通过构造函数创建出来的对象 ，在调用方法的时候，this指代当前对象
谁调用方法，this指代谁，都是指代当前对象
new关键字
new 关键字来完成
1. 创建一个空对象
2. 将关键字this指向这个空对象
3. 执行构造函数里面的代码，给当前空对象this设置属性和方法
4. 将this这个当前对象返回
执行
创建
function Student(name,sex,age){ //首字母大写，标明是一个函数，但是是构造函数，用来创建对象
//var this = new Object();
this.name = name; // this指代当前创建出来的出来
this.age=age;
this.sex = sex;
this.sayHi = function(){
console.log("我叫"+this.name+"，我今年"+this.age+"，我是"+this.sex+"生");
};
//return student();
// return this;
}
调用执行
ar ls = new Student("李四","男",25); // 构造函数可以创建对象并返回
ls.sayHi();
对象字面量创建对象
创建
var o = { // 对象字面量
属性 : 值 ,
属性 : 20 ,
函数名 : function () {
console.log( );
}
};
console.log( o["属性"] );
调用
o [ "函数名"]
遍历
for ( var key in o ) {
console.log ( key +"===")+a[key];
}
JSON（javascript对象表示形式）
传输数组的一种数据格式，与对象字面量的区别，就是属性一定要加上 ” ”
DOM（文档对象模型，文档树模型）
Document
获取页面元素的第一种方式 : document.getElementById()
object
model
对象
自定义对象
与数学运算相关的封装到了一个Math对象中
与数组操作相关的呢，封装到了Arry数组对象当中
与日期相关的，封装到了Date这个对象当中
组成
属性
方法
创建自定义对象
var student = new Object(); //用构造函数的方式创建了一个空对象
student.name = "张三"; // 属性和变量是一样的，都是用来存储数据的
student.age = 20;
student.sex = "男";
student.sayHi = function(){
console.log("我叫"+student.name+"，我今年"+student.age+"岁了，我是"+student.sex+"生");
};
student.sayHi ( ) ;
批量创建对象
创建
function createStudent(name,age,sex){
var student = new Object();// 用构造函数的方式创建了一个空对象并返回
student.name =name;
student.age = age;
student.sex= sex;
student.sayHi= function(){
console.log("我叫"+student.name+"，我今年"+student.age+"，我是"+student.sex+"生");
};
return student;//将这个对象返回
}
调用执行
var zs = createStudent("张三",25,"男");
zs.sayHi();
this方法构造函数创建对象
this关键字
在JS中，通过构造函数创建出来的对象 ，在调用方法的时候，this指代当前对象
谁调用方法，this指代谁，都是指代当前对象
new关键字
new 关键字来完成
1. 创建一个空对象
2. 将关键字this指向这个空对象
3. 执行构造函数里面的代码，给当前空对象this设置属性和方法
4. 将this这个当前对象返回
执行
创建
function Student(name,sex,age){ //首字母大写，标明是一个函数，但是是构造函数，用来创建对象
//var this = new Object();
this.name = name; // this指代当前创建出来的出来
this.age=age;
this.sex = sex;
this.sayHi = function(){
console.log("我叫"+this.name+"，我今年"+this.age+"，我是"+this.sex+"生");
};
//return student();
// return this;
}
调用执行
ar ls = new Student("李四","男",25); // 构造函数可以创建对象并返回
ls.sayHi();
对象字面量创建对象
创建
var o = { // 对象字面量
属性 : 值 ,
属性 : 20 ,
函数名 : function () {
console.log( );
}
};
console.log( o["属性"] );
调用
o [ "函数名"]
遍历
for ( var key in o ) {
console.log ( key +"===")+a[key];
}
JSON（javascript对象表示形式）
传输数组的一种数据格式，与对象字面量的区别，就是属性一定要加上 ” ”
DOM（文档对象模型，文档树模型）
Document
获取页面元素的第一种方式 : document.getElementById()
object
model