js中的函数

夺笋123

已于 2022-06-03 19:38:05 修改

阅读量101

点赞数

分类专栏： # js基础文章标签： javascript

于 2022-05-22 14:41:58 首次发布

本文链接：https://blog.csdn.net/m0_54510474/article/details/124821981

版权

js基础专栏收录该内容

16 篇文章 0 订阅

订阅专栏

函数定义方法

声明定义法

function 函数名(形参1,形参2,...,形参n){
	语句组;
}

函数表达式定义法

这种方法将一个函数赋值为一个变量，
格式

var 函数名=function(){
	代码块;
}

创建对象定义法

格式

function 函数名(){
	代码块;
}

箭头函数

ES6中的新增项，函数表达式的简化版，使用格式

param=>expression
//或
(param1,param2)={
	代码块
}

注意：

箭头函数以"=>"分隔，左边是参数，右边是函数体
参数可以是0个或多个参数，当是多个参数时，需要使用括号括起来
当函数体是一个表达式时，表达式的值就是该箭头函数的返回值；当函数体是一个代码块时，返回值与普通函数一样

function sayhello(name1,name2){
	return name1+"和"+name2+"是好朋友"
}
//相当于
(name1,name2)=>name1+"和"+name2+"是好朋友"

函数返回值

return 语句

return [表达式]

表达式的值即为要返回的值；表达式也可以省略，这样该函数的返回值为undefined

//返回两个数之和
function _sum(a,b){
	return (a+b);
}
// 返回两个数中的最大值
function _max(a,b){
	var the_max=a>b ? a:b;
	return the_max;
	}

在html中调用js函数方法

简单调用
调用表达式中调用：有返回值的函数常常放在某一个表达式中参与表达式的运算
事件响应中调用：页面加载、用户点击等都会产生事件，当事件产生时，js可以调用某个函数来响应这个事件
链接调用：在<a>标签中，使得href属性等于"javascript:要定义的函数名"来调用函数

<!--假设我们已经定义了test()函数-->
<a href="javascript:test();">点击该链接</a>

一个小demo

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>这是一个html5 demo</title>
    <style>
    	a:hover{color:orange;font-size:15px;}
    </style>
    <script>
    	function test3(){
    		// var x="";
    		var invalue=prompt("请输入一个数值");
    		document.getElementById("demo2").innerHTML="您输入的数字的平方为："+Math.pow(invalue,2);
    	}
    	function test4(){
    		alert("这是一个通过链接调用函数的例子");
    	}
    </script>

</head>
<body>
	<button onclick="test3()">点击输入数字</button>
	<p id="demo2" style="color:#b49123;"></p>

	<hr/>
	<a href="javascript:test4();">点击以查看例子</a>
</body>
</html>

Chrome浏览器运行结果
在这里插入图片描述

一些比较特殊的函数

嵌套函数

在函数内部定义另外一个函数

function 函数名(参数1，参数2){
	function 子函数名(){
		函数体;
	}
}

嵌套函数实例

function add_(num1,num2){
	function add_mini(){
		alert("两数之和为"+(num1+num2));
	}
	return add_mini();
}

递归函数

一个函数在其函数体中调用自身，这种函数称为递归函数

function 递归函数名(参数1){
	递归函数名(参数2);
}

递归函数实例

// 一个计算阶乘的函数
function factorial(n){
	if (n==0||n==1){
		return 1;
		}
	else{
		return factorial(n-1)*n;
		}	
}