JavaScript常见函数形式
Posted 好_快
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JavaScript常见函数形式相关的知识，希望对你有一定的参考价值。
建议使用 let 和 const 定义变量
一、普通函数
1.1 定义
function 方法名称 (形参1,形参2,形参3...)
封装代码;
封装代码;
封装代码;...
function 方法名称 (形参1,形参2,形参3...)
封装代码;
封装代码;
封装代码;...
return value;
1.2调用
方法名称 (形参1,形参2,形参3...)；
1.3示例代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>function</title>
</head>
<body>
<script>
//无参数
function speak()
console.log("你好，张三");
speak();
//无返回值
function hello(name)
console.log("你好，" + name);
hello("ZhangSan");
//有返回值
function getAge(age)
return age;
console.log("你好，我的年龄是：" + getAge(20));
</script>
</body>
</html>
二、函数表达式
2.1 定义
const 变量名称 = function (形参1,形参2,形参3...)
封装代码;
封装代码;
封装代码;...
const 变量名称 = function 方法名称 (形参1,形参2,形参3...)
封装代码;
封装代码;
封装代码;...
2.2调用
变量名称 (形参1,形参2,形参3...)；
2.3示例代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>function</title>
</head>
<body>
<script>
//无参数
const speak = function ()
console.log("你好，张三");
;
speak();
//无返回值
const name = function hello(name)
console.log("你好，" + name);
;
name("ZhangSan");
//有返回值
const age = function (age)
return age;
;
console.log("你好，我的年龄是：" + age(20));
</script>
</body>
</html>
三、匿名函数
3.1 定义
匿名函数是一个没有函数名的函数。
3.2 注意事项
- 不能只定义不调用
function (name)
console.log("你好，" + name);
<!--运行结果-->
Uncaught SyntaxError: Function statements require a function name
3.3 用途
3.3.1 作为其他函数参数
<!-- 作为其他函数的参数 -->
function execute(fun)
fun();
execute(function ()
console.log("我的名字");
);
3.3.2 作为其他函数返回值
<!-- 作为其他函数的返回值 -->
function getName(name)
const pre = "我的名字是:";
return function ()
console.log(pre + name);
;
const name = getName("zhangshan");
name();
3.3.3 作为立即执行函数
<!-- 作为立即执行函数 -->
(function ()
console.log("作为立即执行函数");
)();
(function (name)
console.log("作为立即执行函数" + name);
)("zhangsan");
四、箭头函数
4.1 定义
const 变量名称 = (形参1,形参2,形参3...)=>
封装代码;
封装代码;
封装代码;...
4.2调用
变量名称 (形参1,形参2,形参3...)；
4.3示例代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Arrow Func</title>
</head>
<body>
<script></script>
</body>
</html>
<script>
//无返回值
const name = () =>
console.log("我的名字");
;
name();
//有返回值
const age = () =>
return 20;
;
console.log("我的年龄是", age());
</script>
参考链接
以上是关于JavaScript常见函数形式的主要内容，如果未能解决你的问题，请参考以下文章