1.函数使用
声明语法:
function 函数名 ( ) { 函数体 }
命名规范:
和变量名基本一致
使用小驼峰命名法
前缀尽量为动词
命名建议:常用动词约定
调用语法
函数名()
案例:计算1~100的累计和
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<script>
function getSum() {
let sum = 0;
for (let i = 1; i <= 100; i++) {
sum += i;
}
document.write(sum);
}
getSum();
</script>
</body>
</html>
2.函数传参
若函数完成功能需要调用者传入数据,那么就需要用有参数的函数
这样可以提高函数的灵活性
声明语法:
function 函数名(参数列表){ 函数体 }
参数列表:
- 传入数据列表
- 声明这个函数需要传入几个数据
- 多个数据用逗号隔开
调用语法
函数名(传递的参数列表)
- 调用函数时,需要传入几个数据就写几个,用逗号隔开
3. 函数的传参
形参:声明函式时写在函数名右边小括号里的叫形参,也称为函数内声明的变量
实参:调用函数时写在函数名右边小括号里的叫实参,实际的参数
参数默认值:
形参:可以看做变量,
- undefined:如果不给变量数据,则默认为undefined
- NaN:如果用户不输入是实参,则会出现NaN的结果
我们可以进行改进,用户不输入实参,可以给i形参默认,默认为0,如下操作:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<script>
function getSum(x = 0, y = 0) {
document.write(x + y);
}
getSum();//结果为0
getSum(1 , 2);//结果为3
</script>
</body>
</html>
这个默认值只会在缺少实参参数传递时,才会被执行,所以有参数会优先执行传递过来的实参,否则默认为undefined
4. 函数返回值
当调用某个函数,这个函数会返回一个结果出来,这就是有返回值的函数
函数在很多情况下是需要返回值的,使用return关键词
语法:
return 返回值
注意:
- 在函数体中使用return关键词能将内部的执行结果交给函数外部使用。
- return后面的代码不会再被执行,会立即结束当前函数,所以return后面的数据不要换行写。
- return函数可以没有return,这种情况函数默认值为undefined。
返回 多数据 时,则返回一个数组
代码案例:计算用户输入的最大和最小值
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<script>
let arry = [];
for (let i = 0; i < 5; i++) {
let arr = prompt("输入数字");
arry.push(arr);
}
let mmax = arry[0];
let min = arry[0];
function getMax1(arry) {
for (let i = 1; i < arry.length; i++) {
if (mmax < arry[i]) {
mmax = arry[i];
}
if (min > arry[i]) {
min = arry[i];
}
}
//想要返回最大最小值,则需要返回一个数组
return [mmax, min];
}
let max1 = getMax1(arry);
//输出时,使用数组的下标进行输出
document.write(`最大值${max1[0]}`);
document.write(`最小值${max1[1]}`);
</script>
</body>
</html>
补充:
- 两个相同的函数后面的会覆盖前面的函数
- 再javaScript中,实参的个数和形参的个数可以不一致,
如果形参过多,会自动填桑undefined如果实参过多,
那么多余的实参会被忽略(函数内部有一个arguments,里面装着所有的实参) - 函数一旦碰到return就不会往下执行,结束使用return
5. 作用域
介绍
通常来说。一段程序代码中所用到的名字并不总是有效和可用的,而限定这个名字的可用性的代码范围就是这个名字的作用域
作用
作用域的使用提高了程序逻辑的局部性,增强了程序的可靠性,减少了名字的冲突
作用域:
1. 全局作用域
作用于所有代码执行的环境(整个script标签内部)或者一个独立的js文件
2. 局部作用域
作用于函数内的代码环境,就是局部作用域。因为跟函数有关系,所以也成为函数作用域
作用域中的变量
根据作用域的不同,变量还分为:全局变量,以及局部变量
- 全局变量:指函数外部let的变量,全局变量再 任何区域 都可以访问和修改
- 局部变量:指函数 内部let的变量,局部变量只能在 当前函数内部 访问和修改
变量的访问原则
- 只要是代码,就至少有一个作用域
- 写在函数内部的局部作用域
- 如果函数中还有函数,南无在这个作用域中就又可以诞生一个作用域
- 访问原则:在能够访问到的情况下,先局部,既不没有再找全局,使用的就近原则的方式。
6. 匿名函数
没有名字的函数,无法直接使用
使用方式
- 函数表达式
将匿名函数赋值给一个变量,并且通过变量名称进行调用,我们称之为函数表达式
表达语法:
let fn = function ( ) {
//函数体
}
//调用
fn()
代码演示
let fu = function () {
console.log("hello");
};
fu();
let fun = function (x, y) {
console.log(x + y);
};
fun(1, 2);
- 立即执行函数
作用:防止变量污染
语法
( function (){ console.log ( 11 ) } ) ()
( function (){ console.log ( 11 ) } () )
代码演示
//第一种写法
(function () {
console.log("ji");
})();
(function (x, y) {
console.log(x + y);
})(1, 3);
//第二种写法
(function () {
console.log("Grr");
}());
(function (x, y) {
console.log(x + y);
}(1, 3));
注意:
立即函数无法调用,多个立即执行函数直接要用“;”标点符号给隔开
补充
具名函数和匿名函数中的函数表达式有什么区别?
- 具名函数的调用可以写到任何位置
- 函数表达式必须先声明函数表达式,在调用