JavaScript 函数深度解析
本指南深入探讨 JavaScript 函数,并提供丰富的示例代码。
函数是组织和重用代码的有效方式,它封装了一段可执行的代码块,并在调用时执行。
语法:
function 函数名(参数) { // 代码块 }
示例:
function 问候(姓名) { console.log(`您好,${姓名}!`); } 问候("Alice"); // 输出:您好,Alice!
JavaScript 支持多种函数类型:
a. 函数声明
使用 function 关键字声明函数。
示例:
function 加法(a, b) { return a + b; } console.log(加法(2, 3)); // 输出:5
b. 函数表达式
将函数赋值给变量。
示例:
const 乘法 = function(a, b) { return a * b; }; console.log(乘法(2, 3)); // 输出:6
c. 箭头函数 (ES6)
简洁的函数语法。
语法:
const 函数名 = (参数) => { // 代码块 };
示例:
const 减法 = (a, b) => a - b; console.log(减法(5, 3)); // 输出:2
d. 匿名函数
没有名称的函数,常用于回调函数。
示例:
setTimeout(function() { console.log("两秒后执行"); }, 2000);
e. 立即调用函数表达式 (IIFE)
定义后立即执行的函数。
示例:
(function() { console.log("IIFE 立即执行!"); })();
参数: 函数定义中的变量。
实参: 调用函数时传递的值。
示例:
function 问候(姓名, 年龄) { console.log(`你好 ${姓名},你 ${年龄} 岁了。`); } 问候("Bob", 25); // 输出:你好 Bob,你 25 岁了。
为参数设置默认值,当未提供实参时使用。
示例:
function 问候(姓名 = "访客") { console.log(`你好,${姓名}!`); } 问候(); // 输出:你好,访客!
使用 … 收集多个参数到一个数组中。
示例:
function 求和(...数字) { return 数字.reduce((总和, 数) => 总和 + 数, 0); } console.log(求和(1, 2, 3, 4)); // 输出:10
函数可以使用 return 语句返回值。
示例:
function 平方(数) { return 数 * 数; } console.log(平方(4)); // 输出:16
作为参数传递给另一个函数,并在稍后执行的函数。
示例:
function 处理用户输入(回调) { const 姓名 = "Charlie"; 回调(姓名); } 处理用户输入((姓名) => { console.log(`你好,${姓名}!`); }); // 输出:你好,Charlie!
接受其他函数作为参数或返回值的函数。
示例:
function 应用操作(a, b, 操作) { return 操作(a, b); } const 加法 = (x, y) => x + y; const 乘法 = (x, y) => x * y; console.log(应用操作(3, 4, 加法)); // 输出:7 console.log(应用操作(3, 4, 乘法)); // 输出:12
即使外部函数执行完毕,仍然可以访问外部变量的函数。
示例:
function 外部函数(外部变量) { return function 内部函数(内部变量) { console.log(`外部:${外部变量},内部:${内部变量}`); }; } const 我的函数 = 外部函数("外部"); 我的函数("内部"); // 输出:外部:外部,内部:内部
函数拥有自己的局部作用域。
示例:
function 显示信息() { let 信息 = "你好,世界!"; console.log(信息); } 显示信息(); // console.log(信息); // 错误:信息未定义
函数调用自身的函数。
示例:
function 阶乘(n) { if (n === 1) return 1; return n * 阶乘(n - 1); } console.log(阶乘(5)); // 输出:120
对于相同的输入产生相同的输出,并且没有副作用的函数。
示例:
function 加法(a, b) { return a + b; } console.log(加法(2, 3)); // 输出:5
标签: JS
还木有评论哦,快来抢沙发吧~