一、先来基础复习
（一）填空题
- JavaScript 包含: ____, ____, 和 ____.
- JavaScript 的基本类型有 ____, ____, ____, ____, 和 ____.
- JavaScript 的复合类型有 ____, ____, ____,
- JavaScript 还有两个空类型: ____ 和 ____.
- JavaScript 中获得类型的关键字是 ____. 使用该运算符返回的结果是什么类型? ____.
- JavaScript 中 === 和 == 有什么区别? ____.
- JavaScript 中 in 运算符有什么用? ____.
- JavaScript 中创建对象使用 ____ 运算符.
- 什么是引用类型, 什么是值类型? ____.
- JavaScript 什么叫逻辑中断: ____.
- JavaScript 中 delete 运算符的作用是 ____.
- JavaScript 中循环语句有 ____ 种. 分别是: ____, ____, ____, 和 ____.
- JavaScript 中分支语句有 ____ 种. 分别是: ____, ____.
答案：
1.ECMAScript,DOM,BOM
2.string、number、boolean、undefined、null
3.object、function、arrar
4.null、undefined
5.typeof、string类型
6.全等===：比较类型和值。等于==：只比较值。
- 一般和for循环一起，用来遍历对象。
也可以单独使用，来判断对象里是否含有某个值；
例：var obj={name:"王银辉"}
console.log("name" in obj)//返回 true。意思是判断obj对象里是否有name键。
注意：对象里的所有键，都是string类型。值该是什么类型就是什么类型。
如果 in 关键字用于数组的话，是什么情况呢。
var arr=[1,2,3,4];
console.log(0 in arr);//返回true;这里的0指的是索引值，意思是arr的第0位是否有值。肯定有啊，因为第0位的值是1。如果输入一个10，就会返回false，因为第10位没有值。
还可以用indexOf()方法来判断数组里的某个值的索引。
console.log(arr.indexOf(4));//判断arr数组里的4的索引位置，会打印3。
8.new
9.引用类型就是复杂类型，值类型就是简单类型。
那么复杂类型和简单类型有什么区别吗？
简单数据
var str1="王宝强"；
var str2=str1;//将str1赋值给str2;
str1="马蓉“;//再将str1修改为马蓉。
console.log(str2)//猜猜会会打印什么。会打印王宝强。
复杂数据
var p1={
name:"我最帅",
age:22
}
var p2=p1;
p1.name="你不帅";
console.log(p2.name);
总结：简单数据类型修改变量后，会新建个内存空间，存放修改后的数据。
复杂数据类型不管怎样修改操作的都是同一片内存空间。
-
简单数据类型做为参数传进函数内
var num=100;
function fn(num) {//这里的num管你妈的是谁，只要在括号里，都当做是形参，初始化都是undifinde。
return num=1;// 而且num 是局部变量。只在这个函数内生效。对全局变量不影响。
}
fn(num);//我执行一遍，打印看看数据有没有被修改
console.log(fn(num));//所以打印函数的时候会返回1
console.log((num));//打印100
-
复杂数据类型做为参数传进函数内
var obj={name:"王银辉"};
function fn2(param) {
param.name="王杰伦"
}
fn2(obj);
console.log(obj)
-
对象的动态特性
对对象的进行增、删、改等一系列的操作，就叫做对象的动态特性。
对象两种获取属性的方法。先创建一个对象。
var obj={name:"王银辉"}
第一种：点方法
console.log(obj.name);
第二种：数组方法
console.log(obj["name"]);
//注意对象里面的键是需要加引号""的。加上引号就是字符串类型的。
因为对象里面的键本身就是字符串类型的。
如果不加 JS也会对它进行隐式转换。不加的话打印也还是字符串类型的。
那你该说了，那干脆就不加了呗。其实不加也行，但为了语法规范还是加上为好。
console.log(typeof obj.name)//string类型
10.逻辑中断也叫短路运算
例：var abc = 0 || 1;//你说abc等于几。
console.log(abc);//打印1；
因为在JS中，0代表false;1代表true。而逻辑或||中，只要有一项是true;他就返回true的那方。
11 delete 的作用：可以用来删除对象的属性，而且还带bool类型的返回值的。让你知道这个东西有没有被删除掉。
var obj={name:"王银辉",age:99};
console.log(obj);//先打印一遍
delete obj.age;
console.log(obj);//发现已经删除啦。
console.log(delete obj.agde);//返回true;因为这个关键字会返回一个bool值，可以用来测试某个属性是否被删除。
一个用var声明的变量和一个不用var声明的变量。（可以删除不用var声明的变量）
var num1=1;
var re1=delete num1;
console.log(num1,re1);//打印num1和bool值。发现没有删除掉。
num2=2;
var re2=delete num2;
console.log(re2);
console.log(num2);//会报错，因为num2已经不存在啦。
返回值有两个地方要注意。
如果删除一个对象没有的属性也会返回true;
因为delete 的返回值，会在文档里查这个属性值，发现没有啦，就会给你返回一个true;它不会管这个东西是不是胡写的。它的返回值不包含原型对象里的。
也就是说删除原型里面的属性，不会删除掉但也会给你返回一个true。
12.常用的有四种，for、for in、 while、do while。
13.if和switch
二、调试工具的使用
1、直接跳到下一个断点。会暂停。
2、一步一步的执行，但不会进入函数里面。
3、函数内部逐句执行。
4、跳出函数。
5、下一步。
6、让断点全部失效。再点就全部生效。为了就是不让你一个一个的取消，再添加的时候还要一个一个的添加。
7、异常不停止。
三、函数命名及DOM的操作和异常处理
- 函数命名的三种方式
常规
function fn1(){
}
利用构造函数创建
var fn2=new Function();
第三种
var fn3=function name(){
}
里面有两个名字，name这个名字只能在函数内部使用。
- DOM的操作
总结下来四个字（增、删、改、获）
增加
document.createElement();
appendChild()
删除
removeChild
改
style对象
className
id
innerHTML
innerText
获
document.getElementsByTagName("");
document.getElementById("");等等。
- 异常处理
我们先说一下，异常对我们有什么影响。
var str1="abc";
console.log(str1);
console.log(随便打印，肯定会抛出异常);
var str2="猜猜我会不会执行";
console.log(str2);//是不会打印的。
注意：出现异常会影响后面代码的执行。
异常捕获
捕获异常，使用try-catch语句
try{
//这里写可能出现异常的代码
}catch(e){
//这里的e就是捕获的异常对象
//可以在这里写，出现异常后的处理代码
}
异常捕获语句执行的过程为：
代码正常运行, 如果在try中出现了错误, try 里面出现错误的语句后面的代码都不再执行, 直接跳转到 catch 中
catch中处理错误信息
然后继续执行后面的代码
如果 try 中没有出现错误, 那么不走 catch 直接执行后面的代码
通过try-catch语句进行异常捕获之后，代码将会继续执行，而不会中断。
注意：
语法错误异常用try-catch语句无法捕获，因为在预解析阶段，语法错误会直接检测出来，而不会等到运行的时候才报错。
try-catch在一般日常开发中基本用不到，但是如果要写框架什么的，用的会非常多。因为这个会让框架变得健壮
抛出异常
如何手动的抛出异常呢？
案例：自己写的一个函数，需要一个参数，如果用户不传参数，此时想直接给用户抛出异常，就需要了解如何抛出异常。
抛出异常使用throw关键字，语法如下：
throw 异常对象;
异常对象一般是用new Error("异常消息"), 也可以使用任意对象
function test(para){
if(para == undefined){
throw new Error("请传递参数");
//这里也可以使用自定义的对象
throw {"id":1, msg:"参数未传递"};
}
}
try{
test();
}catch(e){
console.log(e);
}
异常的传递机制
function f1 () {
f2(); // f1 称为调用者, 或主调函数, f2 称为被调用者, 或被调函数
}
function f2 () {
f3();
}
function f3() {
throw new Error( 'error' );
}
f1();
当在被调函数内发生异常的时候，异常会一级一级往上抛出。
异常捕获语句的完整模式
异常捕获语句的完整模式为try-catch-finally
try {
//可能出现错误的代码
} catch ( e ) {
//如果出现错误就执行
} finally {
//结束 try 这个代码块之前执行, 即最后执行
}
finally中的代码，不管有没有发生异常，都会执行。一般用在后端语言中，用来释放资源，JavaScript中很少会用到。
四、面向对象的基本概念
学到这里啦，想一下，JS是不是很注重过程，我们把心思都花在了过程上面，要求过程不能出错，至到运行成功。
面向对象就是把过程的重要性削弱，让我们把关注点放到结果上面。一种思维的改变。
举个洗衣服例子：
面向过程的思维：
1、找到洗衣机
2、打开开关
3、放入脏衣服
4、盖上盖子
5、晾晒衣服面向对象的思维：
1、找到洗衣机
2、衣服洗好啦
明白这个意思就好啦。
- JS中的对象
广义上JS中的所有东西都可以看作是一个对象。
狭义上，对象指的就是健值对的组合。
var obj={name:"王银辉",age=18}
注意：面向对象是对面向过程的封装，有了面向对象并不意味着，就可以抛弃面向过程。
五、利用对象封装函数
例如：有三个DIV标签，我们怎么用JS给这三个DIV标签添加背景颜色？
用JS代码写：
var div=document.getElementsByTagName("div");
for(var i=0;i<div.length;i++){
div[i].style.background="red";
}
用普通函数封装：
function bgColor(ele,color) {
var ele=document.getElementsByTagName(ele);
for(var i=0;i<ele.length;i++){
ele[i].style.background=color;
}
}
bgColor("div","red")
普通函数封装的缺点：
- 全局变量污染；
- 维护麻烦（因为有维护方便的，那就是利用对象进行封装）。
利用对象进行封装：
var bgColor={
id:function(id){
return document.getElementById(id);
},
tag:function(tagName){
return document.getElementsByTagName(tagName);
},
setStyle:function(par){
for(var i=0;i<par.length;i++){
par[i].style.background="yellow";
}
}
};
var divs=bgColor.tag("div");
bgColor.setStyle(divs)
这些属性和方法都是bgColor里面的一个键值对。
