## 第3天 ##
### 1.复习.html ###
~~~
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
<script>
/*
数据类型
typeof 查看数据类型
1.布尔值
true
false
2.undefined
undefined 定义变量没有赋值
3.number
整型
浮点型
NaN not a number 不是数字的数
自己都不等以自己
参与运算，结果都是NaN 100px
InFinity 无穷大 2/0
类型转换
Nnmber() 默认
parseInt() 强制转化成整型
parseFloat() 强制转换成浮点型
4.string
单双引号都不解析变量
自己不能嵌套自己
解析转义符
5.function
也是一种数据类型
类似字符串，字符串怎么玩，函数就怎么玩
6.Object
null 是一个特殊的额对象 空对象
*/
var str = 'helo';
var str = Number(str);
alert(str);
</script>
</html>
~~~
### 2.函数的定义.html ###
~~~
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
<script>
//函数 一种数据类型
// test();
//函数的定义1
function test()
{
alert(1);
}
//函数就像字符串一样，重新定义，会覆盖同名的函数
function test()
{
alert(2);
}
// var str = 'I Love You';
// var str = 'hi';
// alert(str);
//函数定义2
function test()
{
alert(3);
return 10;
}
// var func = function(){alert(3)}
// 把函数的返回值赋给一个变量
// var func = test();
var func = test;
// alert(func);
// alert(func)
// func();
//函数定义3：使用构造器
//前面所有的参数都是作为函数的形参，最后一个参数是函数体的内容
var say = new Function('a','b','return a+b');
// alert(say);
var res = say(5,6);
alert(res);
// var str = new String('hello');
// var str1 = 'hello1';
// alert(typeof str);
// alert(typeof str1);
</script>
<script>
//定义函数的时候，如果调用跟定义不在同一个script标签里，那么必须先定义，后调用
// test();
</script>
</html>
~~~
### 3.函数的调用.html ###
~~~
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<button onclick="test()">求虐</button>
</body>
<script>
//函数 一种数据类型
//函数的调用1：
function test()
{
alert(1);
}
// test();
//函数调用2：
//赋值给字符串，取别名调用
var func = function()
{
alert(2);
}
func();
//函数调用3：在事件中调用
//见文件中body的按钮
</script>
</html>
~~~
### 4.函数定义的细节.html ###
~~~
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<button onclick="test()">求虐</button>
</body>
<script>
//函数 一种数据类型
/*
函数定义的细节
1.函数可以重复定义
2.形参可以不传值，返回值是undefined
3.形参不能有默认值，除了火狐
4.如果要给函数设置默认值，那么可以通过判断形参是否是undefined
*/
function test()
{
alert(1);
}
//形参不能有默认值，除了火狐
function test(a)
{
//变相的设置默认值
if (a === undefined) a = 20;
// alert(2);
alert(a);
}
test();
</script>
</html>
~~~
### 5.arguments对象.html ###
~~~
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<button onclick="test()">求虐</button>
</body>
<script>
//函数 一种数据类型
//func_num_args() 返回函数的参数个数
//arguments
function test()
{
console.dir(arguments);
return arguments.length;
}
var res = test('a','b','c','d');
alert(res);
</script>
</html>
~~~
### 6.变量的作用域.html ###
~~~
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<button onclick="test()">求虐</button>
</body>
<script>
/*
变量的作用域
1.函数内部可以调用全局变量
2.在函数内使用var定义的变量的是局部变量，外部无法调用
*/
num = 10;
function test()
{
//var 定义变量，在函数内使用var定义的变量是局部变量
var num1 = 20;
alert(num);
// alert(num1);
// alert(num2);
function son()
{
var num2 = 30;
alert(num);
alert(num1);
// alert(num2);
}
son();
}
test();
//局部变量外部无法调用
alert(num1);
</script>
</html>
~~~
### 7.奇葩的的函数.html ###
~~~
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<button onclick="test()">求虐</button>
</body>
<script>
/*
函数：
回调函数 把一个函数当成参数来传递的时候
匿名函数 没有名字的函数
递归函数 自己调用自己
*/
//以后的使用就是这样去使用
//function test(){}
/*
//回调函数+匿名函数
setInterval(function(){},100);
//递归函数
var res= prompt('请输入用户名','SB250');
// alert(res);
function login()
{
var res= prompt('请输入用户名','SB250');
if(res == '我是大傻B') {
alert('欢迎你，大傻B');
} else {
login();
}
}
// login();
*/
/*
//自调函数 定义好函数之后自己调用自己一次
// var func = function(){};
// func();
(function(){
alert(2);
})();
//类似我们的命名空间 解决js里面的命名问题
(function(){
var num = 10;
alert(1);
})();
*/
/*
//返回函数的函数
function test()
{
// return 'I Love You';
return function()
{
alert('我是返回的')
}
}
var res = test();
// alert(typeof res);
res();
*/
//子函数
function test()
{
alert(1);
function son()
{
alert(2);
}
son();
}
// test();
//自己改变自己的函数
function test()
{
alert(1);
test = function()
{
alert(2);
}
}
// test();
// test();
// test();
//自宫函数 一次性的任务
function test()
{
alert('赞');
test = function(){}
}
test();
test();
</script>
</html>
~~~
### 8.构造器函数.html ###
~~~
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<button onclick="test()">求虐</button>
</body>
<script>
/*
构造器函数
*/
//类似构造方法
function Person(name,age)
{
this.name = name;
this.age = age;
this.say = function()
{
alert(1);
}
}
var p = new Person('jack',18);
alert(typeof p)
alert(p.name);
alert(p.age);
p.say();
</script>
</html>
~~~
### 9.闭包函数.html ###
~~~
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<button onclick="test()">求虐</button>
</body>
<script>
/*
闭包函数 ： 返回函数的函数 打破作用域链
1.返回的函数保持定义时访问的范围
2.局部变量不会立即释放
*/
function die()
{
var num = 10;
function son()
{
alert(num);
}
return son;
}
var func = die();
func();
</script>
</html>
~~~
### 10.对象的声明.html ###
~~~
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<button onclick="test()">求虐</button>
</body>
<script>
/*
对象：
*/
//声明对象方式1：
var list = [1,2,3,4];
var obj = {name:'jack',age:18};
// alert(typeof list);
// alert(obj.name);
//声明对象方式2：
var obj = new Object();
alert(typeof obj);
obj.name = 'jack';
alert(obj.name);
//可以访问一个不存在的属性，返回值是undefined
alert(obj.sex);
//访问一个不存在的方法时，会报错，下面代码不执行
alert(obj.eat());
obj.say = function(){alert(1)};
obj.say();
//对象声明3： 找对象
//1.document.getElementById() 对象
//2.document.getElementsByTagName('tr') 得到的是一个数组类型的对象
</script>
</html>
~~~
### 11.包装对象.html ###
~~~
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<button>hello</button>
<button>world</button>
<button>I Love You</button>
<button>我爱你</button>
</body>
<script>
//包装对象
var str = 'hello';
var str1 = new String('hello');
// alert(typeof str);
// alert(typeof str1);
// alert(str);
// alert(str.substr(1,1));
//包装对象 临时对象 随用随消
str.name = 'jack';
// alert(str.name);
// alert(str1.substr(1));
//真正的对象
str1.name = 'jack';
// alert(str1.name);
// alert(str1);
//1.找对象
var btns = document.getElementsByTagName('button');
// console.dir(btns);
for (i in btns) {
//在循环体里面的函数不能有变量值
btns[i].index = i;
btns[i].onclick = function(){
// alert(btns[i].innerHTML);
alert(this.innerHTML);
// alert(btns[this.index].innerHTML);
}
}
</script>
</html>
~~~
### 12.原型链.html ###
~~~
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<button>hello</button>
<button>world</button>
<button>I Love You</button>
<button>我爱你</button>
</body>
<script>
//原型链 类似继承
function Person(name)
{
this.name = name;
}
var obj = {age:18,say:function(){alert(2)}}
Person.prototype = obj;
var p = new Person('jack');
alert(p.name);
alert(p.age);
p.say();
//
</script>
</html>
~~~
### 13.扩展作业.html ###
~~~
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<button>hello</button>
<button>world</button>
<button>I Love You</button>
<button>我爱你</button>
</body>
<script>
//扩展作业 使用每个类型 Math Date Array String 方法做两个小例子
// var num = Math.random() * 100;
// var num = Math.floor(num);
// console.log(num);
String.prototype.test = function(){alert(1)}
//String
var str = 'hello';
// str.substr();
str.test();
// String.test();
</script>
</html>
~~~
