js函数
1.为什么需要函数
1.为什么需要函数
可以实现代码复用,提高开发效率
2.函数是什么?
function执行特定任务的代码块
2.函数的使用
1.掌握函数语法,把代码封装起来
1.函数的声明法
<script>
// 函数名
function sayHi () {
// 函数体
document.write('你好呀~~')
}
</script>
2.函数的名命名规范
1.和变量命名基本一致 2.尽量小驼峰式命名法 3.前缀应该为动词 4.命名建议:常用动词约定
<script>
function getNsum() { }
function getMax() { }
function getmin() { }
</script>
3.调用函数的用法
<script>
function getSum() {
console.log('你好呀');
}
// 函数名 调用
getSum()
</script>
4.函数体
<script>
function getSum() {
console.log('你好呀');
}
getSum()
</script>
5.总结
1。函数是用那个关键字声明的?
function
2.函数不调用会执行吗?如何调用函数?
函数不调用自己不执行 调用方式: 函数名()
3.函数的复用代码和循环重复代码有什么不同?
循环代码写完即执行,不能很方便控制执行位置 随时调用,随时执行,可重复调用
3.函数的传参
1.有差函数的声明和调用
1调用函数时,需要传入几个数据就写几个,用逗号隔开
<script>
// 函数名
function getSum(num1,num2) {
}
// 8和28的值会给num1和num2调用
getSum(8,28)
</script>
2.形参和实参
1.开发中尽量保持形参和实参个数一致
<script>
// 形参
function getSum(num1, num2) {
document.write(num1 + num2)
}
// 实参
getSum(10, 20)
// getSum(100,200)
</script>
3.总结
1.函数传递参数的好处是?
可以极大的提高了函数的灵活性
2.函数参数可以分为那两类?怎么判断他们是那种参数?
1.函数可以分为形参和实参 2.函数声明时,小括号里面的是形参,形式上的参数 3.函数调用时,小括号里面的是实参,实际的参数 4.尽量保持形参和实参的个数一致
3.参数中间用什么符号隔开?
逗号
4.函数的返回值
1.返回值的使用
<script>
// function getMax() {}
// function getSum() {}
// // 这个num1 就是 函数getMax调用的返回值 ( num1 = 1 2 。。)
// // let num2 = getSum();
// let num1 = getMax();// 我们自己写的函数 只能返回 undefined
// let num3 = parseInt(1.3);// js自己内部写的 返回值 1
// console.log(num3); //
function getMax() {
// 100 就是 函数在执行完毕的时候 会返回的数据
return 300;
}
let num1 = getMax(); // num1 =100
console.log(num1);
</script>
2.返回值的使用场景
<script>
// 函数 参数的最大值
function getMax(n1, n2) {
if (n1 > n2) {
return n1;
} else {
return n2;
}
}
// 通过 console.log 帮我打印
// let num1 = getMax(1, 3);
// console.log(num1);
// let num1 = getMax(1, 3);
console.log(getMax(1, 3));
// 通过 document.write 帮我打印
// let num2 = getMax(2, 4);
document.write(getMax(2, 4));
// 通过 alert 帮我打印
// let num3 = getMax(6, 8);
alert(getMax(6, 8));
</script>
3.返回值的案例
<script>
let arr1 = [1, 3, 4, 33, 22];
// 声明一个函数 用来计算数组的最大值 并且 最大值 返回
function getMax(arr) {
let max = arr[0];
for (let index = 0; index < arr.length; index++) {
if (arr[index] > max) {
max = arr[index];
}
}
return max;
}
let max = getMax(arr1);
console.log(max); // max 该数组的最大值 !
// 声明一个函数 用来计算数组的最小值
function getMin(arr) {
let min = arr[0];
for (let index = 0; index < arr.length; index++) {
if (arr[index] < min) {
min = arr[index];
}
}
return min;
}
let min = getMin(arr1);
console.log(min); // min 输出数组的最小智
</script>
4.返回值的补充
1 不能同时执行多次return 第一个return生效 2 函数内部 如果写了return ,那么它下面的代码就不会执行!!
3 如果一个函数 没有写return 相当于 写了 return undefined
5.函数的作用域
<script>
// 直接写在全局作用域下的变量 = 全局变量 在任意的地方来访问
let num = 100; // 全局变量 在任何地方都可以访问
function getMax() {
console.log('函数 访问全局变量', num);
}
getMax();
for (let index = 0; index < 2; index++) {
console.log('for循环内 块级作用域 访问全局变量', num);
}
if(true){
console.log("if语句 也 可以访问全局变量",num);
}
</style>
</head>
<body>
<script>
// 局部变量
// 如果是在函数内部定义的变量 就叫做局部变量
// 局部变量 不能在 它的大括号之外使用的,否则就会报错!!
let msg = 10000; // 全局变量
// 局部变量 函数内部 声明的变量
function getMax() {
// 声明一个数字
let num = 200; // 局部变量
}
// 局部变量 不能在 超出它的大括号来使用
console.log(num); // 会报错
</script>
6.匿名函数
<script>
// 函数按照有没有名字 分成两种
// 有名字 具名函数
// 没有名字 匿名函数
// 具名函数 函数名称 func1
// function func1() {
// }
// 匿名函数 = function () {}; 匿名函数 了解即可
// let func2 = function () {}; 叫做 函数表达式
// 表达式 可以表示结果的一段代码 函数表达式 了解
let func2 = function () {
console.log("123");
};
// 调用
func2();
</script>
2自执行函数
<script>
/*
自执行函数 = 匿名函数一起出现 通用的功能是 防止变量污染
函数在定义的同时 直接就执行了
用在哪里呢
适合做一次性的任务- 不希望这个函数可以得到复用!!!
函数包装多段代码 让程序比较简洁
1 页面打开时候
1 设置 页面的标题 = 月薪过万
2 设置 页面的背景颜色 = 黄色
*/
// 匿名函数
// function () {
// // 设置 页面的标题 = 月薪过万
// document.title = '月薪过万';
// // 设置 页面的背景颜色 = 黄色
// document.body.style.backgroundColor = 'yellow';
// }
// let msg = 123;
// // 自执行函数
// (function () {
// let msg = 123;
// // 设置 页面的标题 = 月薪过万
// document.title = '月薪过万';
// // 设置 页面的背景颜色 = 黄色
// document.body.style.backgroundColor = 'yellow';
// })();
// console.log(msg);
</script>