本文详细解析JavaScript中函数的三种定义方式及其底层原理,重点说明函数调用时参数未传递时的默认行为为undefined。通过对比分析函数声明、表达式及Function构造函数,阐明执行符号()的作用及返回值处理逻辑,帮助开发者掌握JS函数的核心用法。
JavaScript函数定义方法与调用机制详解
本文通过具体实例介绍JavaScript函数的基本定义方式与使用场景,旨在为读者提供实用的参考内容。
<html>
<head>
<title>js函数</title>
<meta charset="UTF-8"/>
<script type="text/javascript">
// 三种函数的声明方法
// function test1(a1,a2){
// console.log("函数声明的第一种方法" + a1 + a2);
// }
// test1();
// test1(1);
// test1(1,2);
// var test2 = new Function("a1","a2","console.log('函数声明的第二种方法' + a1 + a2)");
// test2();
// test2(1);
// test2(1,2);
// var test3 = function(a1,a2){
// console.log("函数声明的第三种方法" + a1 + a2);
// }
// test3();
// test3(1);
// test3(1,2);
// 有返回值的函数
// function action(a1,a2){
// console.log("clannad赛高");
// return "没错";
// }
// var act=action();
// console.log(act);
// console.log(action);
// console.log(action());
// 函数返回值为函数的函数
// function action(a){ //这个函数是把输入的参数内容打印出来。
// console.log(a);
// }
// var actioned = function(){ //一个含有返回值的函数
// return "clannad赛高,没错";
// }
// action(actioned);
// action(actioned());
// 一个比较常用的方法
function extract(fn){
// fn();
console.log(fn);
console.log(fn()); //先对function的内容进行执行,然后用console.log输出fn运行后的结果(即返回值)
}
extract(function(){
console.log("我运行了吗");
return "clannad赛高,没错";
})
</script>
</head>
<body>
<h3>js函数</h3>
</body>
</html>
代码运行后的实际输出结果如下所示。

在JavaScript中,函数调用对参数数量没有严格限制。即使调用时提供的参数少于定义时的形参数量,程序也不会报错,此时未传入的参数值默认为undefined类型。
尽管上述三种函数定义语法形式不同,但其底层实现逻辑一致,本质上都是将一个函数类型的对象封装到变量中。
在JS语法中,圆括号()是触发函数执行的标识。仅输入函数名不会执行代码,使用console.log(函数名)仅能打印函数体的源代码字符串;若在函数名后添加(),则会真正执行函数体内的代码,并打印出函数的返回值(若存在返回值)。
一种常见的编程模式是定义一个用于执行特定任务的函数,这通常体现为命名函数的定义方式。
感兴趣的用户可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.jb51.net/code/HtmlJsRun测试上述代码的运行效果。
更多关于JavaScript相关内容可查看本站专题:《JavaScript常用函数技巧汇总》、《javascript面向对象入门教程》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript数学运算用法总结》
希望本文所述内容对大家学习JavaScript程序设计有所帮助。