web前端入门到实战：javscript函数的运用
2019-09-24 本文已影响0人
560b7bb7b879
函数，一段能够自动完成某些功能的代码块，函数的出现，既解决了重复使用重一功能的需求，又可以避免代码的臃肿性。使用函数有两个要求：必须调用后才可以执行;函数名不要和关键字以及系统函数相同;
函数主要有三种，直接调用，参数传递，返回值。
1、直接调用：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>圆的面积</title>
</head>
<body>
<script type="text/javascript">
//求任意一个圆的半径，得到面积
function mianji(){
var r=prompt("请输入圆的半径：");
s=3.14*r*r;
alert("圆的面积是"+s);
}
mianji();
</script>
</body>
</html>
2、参数传递：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>圆的面积</title>
</head>
<body>
<script type="text/javascript">
//求任意一个圆的半径，得到面积
function miaji(r){
s=3.14*r*r;
alert("圆的面积为:"+s);
}
miaji(2);
miaji(3);
</script>
</body>
</html>
3、返回值(在一般的前端开发中，使用的都返回值)：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>函数返回值</title>
</head>
<body>
<script type="text/javascript">
//返回值
function getSum(n,m){
var sum=0;
for(var i=n;i<=m;i++){
sum+=i;
}
//返回计算的值
return sum;
}
console.log(getSum(1,100));
//控制台查询结果
</script>
</body>
</html>
自己是一个6年的前端工程师,希望本文对你有帮助！
这里推荐一下我的前端学习交流扣qun：731771211 ，里面都是学习前端的，如果你想制作酷炫的网页，想学习编程。自己整理了一份2019最全面前端学习资料，从最基础的HTML+CSS+JS【炫酷特效，游戏，插件封装，设计模式】到移动端HTML5的项目实战的学习资料都有整理，送给每一位前端小伙伴，每天分享技术
点击：加入
