函数基本知识总结：
1函数就是可以重复执行的代码
2.组成：参数、功能、返回值
3为什么要用函数，因为一部分代码的使用次数会汗多，封装起来，需要的时候调用
4函数不调用不执行
5同名函数会覆盖，后面的会覆盖前面的
6函数名等于整个函数
7 加载函数的时候只加载函数名，不加载函数体
8参数相当于局部变量
9两个平级的函数中变量不会相互影响
10 预解析：函数在解释文档的时候会被整体提到文档的最前面
函数高级+对象
目标：会自己定义一个构造函数，创建自定义对象。
函数高级 不需要重点记忆
1.
匿名函数（了解）
没有名字的函数，不需要定义函数名的时候，书写简便。有自己的调用方法
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
//匿名函数。 只定义不执行会报错？
// (function (){
// console.log(1);
// })
//调用方法：（了解）
//1.直接调用
(function (){
console.log(1);
})();
//2.绑定事件，会经常用到
document.onclick = function () {
alert(1);
}
//3.定时器
setInterval(function () {
console.log(444);
},1000);
</script>
</body>
</html>
2.
函数是一种类型（了解）
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
//函数也是一种数据类型。但是，归根结底，他还是属于object。
var str = "abc";
var num = 111;
var boo = true;
var aaa;
var bbb = null;//对象类型
var arr = [];//对象类型
function fn(){
alert(1);
// return 111;
}
console.log(typeof str);
console.log(typeof num);
console.log(typeof boo);
console.log(typeof aaa);
console.log(typeof bbb);
console.log(typeof arr);
console.log(typeof fn);
// function
console.log(typeof fn());
// undefined ，fn（）是函数执行的返回值
</script>
</body>
</html>
3.
递归（了解）就是函数自己调用自己，必须有跳出条件。
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
//递归是一种思想：类似于我们的计数器，开闭原则。
//递归的实质就是函数自己调用自己。
//递归注意点：递归必须有跳出条件，否则是死循环。
var i = 1;
fn();
function fn(){
// alert("从前有座山，山里有座庙...");
// i++;
// alert(i);
// if(i>3){
// return;
// }
// fn();
alert("从前有座山，山里有座庙...");
i++;
alert(i);
if(i<3){
fn();
}
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
//用递归求1+100和。
alert(getSum(100));
function getSum(n){
//跳出条件
if(n<1){
return 0;
}
//累加
return n + getSum(n-1);
}
// getSum(100) = 100 + 99 + 98+ ...+1+0;
// function getSum(n){
// //跳出条件
// if(n<1){
// return 0;
// }
// //累加
// return 100 + 99+...+1+0;
// }
</script>
</body>
</html>
4.
函数作为参数 （会用）回调函数，经常用
传递规则的时候使用回调函数
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
//执行函数就等于：函数名+(); 整个函数+();
// fn();
// (function(){})()
fn(test);
//回调函数:函数作为参数进行传递和使用。函数调用别的函数
// 传递函数名，就是传递整个函数
function fn(demo){
demo();
// 函数名（）代表执行函数
// test();
}
function test(){
console.log("我是被测试的函数！");
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
//什么情况下，使用回调函数？
//回调函数一般是用于定义一个规则来使用的。
//规则的传递只能通过函数实现。通过变量无法达成。所以我们需要传递规则的时候必须使用回调函数。
console.log(fn(10,5,test1));
console.log(fn(10,5,test2));
console.log(fn(10,5,test3));
console.log(fn(10,5,test4));
function fn(num1,num2,demo){
return demo(num1,num2);
}
//定义四个规则：加减乘除
function test1(a,b){
return a+b;
}
function test2(a,b){
return a-b;
}
function test3(a,b){
return a*b;
}
function test4(a,b){
return a/b;
}
</script>
</body>
</html>
1.学习对象的好处
为什么使用对象：方便
把大象装冰箱
把100万头大象装冰箱
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
//1.生活中。（找对象）
//2.编程中。(封装信息)
function printStuInfo(name,age,address){
console.log(name);
console.log(age);
console.log(address);
}
function printStuInfo(student){
console.log(student.name);
console.log(student.age);
console.log(student.address);
}
</script>
</body>
</html>
面向过程：
面向对象：广义、
狭义封装成一个个的小对象，传递数据
2.什么是对象
对象：生活中具有唯一性的事物。
属性+方法
对象中的变量，对象中的函数
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
//生活中。一类事物和对象的区别。（对象是指具有唯一性的事物）
//游戏中。有特指的事物是对象。
//程序中。
var hero = new Object();
//自定义属性--状态
hero.money = 10000;
hero.level = 6;
//方法---行为。
hero.attack = function () {
console.log("攻击了水晶！");
}
console.log(hero);
console.log(hero.money);
console.log(hero.level);
hero.attack();
//属性和方法：状态（名词）和行为（动词）。
</script>
</body>
</html>
3.构造函数创建对象，重点。
a）自定义对象（单个对象）
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
//需求：单个自定义对象。
//缺点：传单单个对象的时候还好，创建多个多线的时候变得非常繁琐
//for循环创建多个对象不能修改名字的值。函数也可以创建多个对象。
var student = new Object();
// console.log(student);
student.name = "张三";
// student.age = 18;
// student.address = "辽宁省铁岭市莲花乡池水沟子";
student.sayHi = function () {
console.log(this.name+"说：大家好！");
// 对象中的this代表对象本身
}
console.log(student.name);
student.sayHi();
</script>
</body>
</html>
b）自定义对象（多个对象）
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
//需求：多个自定义对象。
//缺点：代码冗余，方式比较low。当我们创建空白对象的时候：new Object();
//利用构造函数自定义对象。
var stu1 = createSudent("张三");
var stu2 = createSudent("李四");
console.log(stu1);
stu1.sayHi();
console.log(stu2);
stu2.sayHi();
//创建一个函数
function createSudent(name){
var student = new Object();
student.name = name;
// student的属性 局部变量（形参的name）
student.sayHi = function () {
console.log(this.name+"说：大家好！");
}
return student;
}
</script>
</body>
</html>
3.自定义对象（利用构造函数）
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
//需求：多个自定义对象。
//缺点：代码冗余，方式比较low。当我们创建空白对象的时候：new Object();
//利用构造函数自定义对象。
var stu1 = new Student("王五");
// new stu（）创建一个对象，不需要return
var stu2 = new Student("赵六");
console.log(stu1);
stu1.sayHi();
console.log(stu2);
stu2.sayHi();
// console.log(typeof stu1);
// console.log(typeof stu2);
//创建一个构造函数，首字母大写。创建对象终极版
function Student(name){
//构造函数中的对象指的是this。
this.name = name;
this.sayHi = function () {
console.log(this.name+"说：大家好！");
}
}
</script>
</body>
</html>
4.this和new
this
一、this只出现在函数中。
二、谁调用函数，this就指的是谁。
三、new People(); People中的this代指被创建的对象实例。等同于把this设置为当前对象
var aaa = new Object();
new
1.开辟内存空间，存储新创建的对象（ new Object() ）
2.把this设置为当前对象
3.执行内部代码，设置对象属性和方法
4.返回新创建的对象
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
var aaa = new stu();
// 存储新创建的对象，返回新创建的对象
console.log(aaa);
aaa.say();
function stu(){
this.say = function () {
console.log(this);
//2.把this设置为当前对象 把this指向当前对象
}
}
</script>
</body>
</html>
5.属性绑定，扩展
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
var stu = new Object();
var aaa = "age";
// 属性绑定1；对象名.属性 2.对象名[变量/字符串/值]
//对象名.属性
stu.name = "拴柱";
// stu.aaa = 19; 绑定的是aaa stu{name：拴住，aaa：19}
//对象名[变量] 对象名[值]
stu[aaa] = 20;
// stu{name：拴住，age}
stu[0] = "你好";
// stu{0：你好；name，age}
console.log(stu);
// var arr = [1,2,3];
// arr[0] = 4;
</script>
</body>
</html>
时间： 2024-08-09 21:39:57