JS 有参函数和无参函数示例全面解析
作者:八级大狂风972
在JavaScript中,函数可以定义带有参数或不带参数,这两种类型的函数在定义和使用上有所不同,下面通过示例代码介绍JS 有参函数和无参函数,感兴趣的朋友一起看看吧
函数就是把一段重复使用的代码打包起来,想用的时候直接调用,不用重复写代码。 JavaScript 里函数分两种:无参函数 和 有参函数,下面用最简单的例子讲清楚。
一、无参函数
1. 定义
函数括号 () 里面不写任何变量,调用的时候也不用传值,就是无参函数。 它的代码逻辑固定,每次运行结果都一样。
2. 语法格式
// 定义无参函数
function 函数名() {
// 要执行的代码
}
// 调用函数
函数名();3. 示例 1:打印问候语
// 定义无参函数,括号里空空的
function sayHello() {
console.log("大家好,我是无参函数!");
}
// 调用函数,括号也不用填东西
sayHello();运行结果:
大家好,我是无参函数!
4. 示例 2:计算固定数字加法
function add() {
let a = 10;
let b = 20;
console.log(a + b);
}
add(); // 输出 30缺点:数字写死了,每次只能算 10+20,不能换数字计算。
二、有参函数
1. 定义
函数括号 () 里面写上变量(叫做形参),调用函数时往括号里传数据(叫做实参),就是有参函数。 优势:灵活,每次调用可以传入不同数据,得到不同结果。
2. 语法格式
// 定义:括号内写形参
function 函数名(形参1, 形参2) {
// 使用形参写代码逻辑
}
// 调用:括号内传入实参(真实数据)
函数名(实参1, 实参2);3. 示例 1:自定义问候人名
// name 是形参,用来接收外面传进来的名字
function sayHi(name) {
console.log("你好," + name);
}
// 调用,"小明"、"小红"是实参,传给形参name
sayHi("小明");
sayHi("小红");输出:
你好,小明
你好,小红
4. 示例 2:任意两个数字相加
// num1、num2 两个形参
function sum(num1, num2) {
console.log(num1 + num2);
}
// 传入不同实参,计算不同结果
sum(2, 3); // 5
sum(10, 50); // 60
sum(100, 200);// 300三、形参和实参简单区分
- 形参:定义函数时,括号里的变量,相当于占位符。 例:
function sum(num1, num2)中num1 num2是形参 - 实参:调用函数时,括号里真实的值,传给形参使用。 例:
sum(2,3)中2、3是实参
四、无参函数 vs 有参函数对比总结
| 类型 | 特点 | 使用场景 |
|---|---|---|
| 无参函数 | 括号无变量,调用不传值,逻辑固定 | 代码每次执行效果完全一样 |
| 有参函数 | 有形参,调用可传不同数据,灵活 | 需要传入不同数据,得到不同结果 |
五、完整综合小案例
// 无参函数:固定输出一句话
function showMsg() {
console.log("=====计算开始=====");
}
// 有参函数:计算两个数乘积
function multiply(x, y) {
console.log(x * y);
}
// 调用
showMsg();
multiply(4, 5);
multiply(6, 7);输出:
=====计算开始=====
20
42
六.总结
- 括号里啥都没有 = 无参函数,调用不用传数据;
- 括号里写变量 = 有参函数,调用要给对应数值;
- 日常开发优先用有参函数,代码更灵活、复用性更强;
到此这篇关于JS 有参函数和无参函数示例全面解析的文章就介绍到这了,更多相关js有参函数和无参函数内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
