JS 函数的基本知识
目录
1. 介绍函数
在学习 CSS 样式过程中，经常有如下操作：
2. 使用函数
函数声明：
函数命名规范：
函数调用：
<!DOCTYPE html>
<html lang="ch—ZN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>函数基础</title>
</head>
<body>
<script>
/* 函数的声明与调用 */
function getHi (){
document.write('Hi')
}
getHi ()
/* 两个数字的和 */
function add(){
let a = +prompt("请输入第一个数字：")
let b = +prompt("请输入第二个数字：")
alert(a+b)
}
add ()
/* 100以内的累加和 */
function add100(){
let sum = 0;
for(let i = 1;i <= 100;i++){
sum += i;
}
document.write(sum)
}
add100 ()
</script>
</body>
</html>3. 函数传参
前面所讲述的函数的功能是固定的，比较死板的。比如：函数的功能为求100以内的累加和，如果需要求1000以内的累加和，就需要重新写一个函数，这样是不好的。但是，我们可以声明一个求累加和的函数，不管求哪些范围的累加和，都不需要重新声明一个函数了。要想实现这样的函数，需要传参；
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>传参函数</title>
</head>
<body>
<script>
/* 传参提高了函数的灵活性 */
function addAay (a,b){
let sum = 0
for(let i = a;i <= b;i++){
sum += i
}
document.write(sum)
}
addAay(10,50)
</script>
</body>
</html>
3.1 传递默认值
3.2 传递数组
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>数组传参</title>
</head>
<body>
<script>
let array = [1,2,3,4,5,6,7,8,9,10]
function addArray(arr = []){
let sum = 0
for(let i = 0;i < arr.length; i++){
sum += arr[i]
}
document.write(sum)
}
addArray (array)
</script>
</body>
</html>
3.3 传递变量
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>变量传递</title>
</head>
<body>
<script>
/* 变量 */
let a = +prompt("请输入第一个数字")
let b = +prompt("请输入第二个数字")
/* 声明函数 */
function getAdd(num1 = 0,num2 = 0){
let sum = 0
for (let i = num1;i <= num2;i++){
sum += i
}
alert(sum)
}
/* 调用函数 */
getAdd(a,b)
</script>
</body>
</html>4. 函数返回值
总结：
5. 匿名函数
6. 立即执行函数
立即执行函数还是比较常用的，具体的使用场景和意义在后面学习会逐渐理解，目前可以先记忆；
7. 注意
原文地址：https://blog.csdn.net/m0_74012211/article/details/143002745
免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！