用JavaScript创建简单函数的完整指南

函数是JavaScript编程中的基础组成部分，它可以封装一段可重复执行的代码逻辑，避免重复编写相同功能，提升代码的可维护性和复用性。对于刚接触JavaScript的开发者来说，掌握函数的创建方法是入门的核心步骤之一。

JavaScript函数的基本创建方式

JavaScript中最常见的函数创建方式是使用function关键字声明函数，这种定义方式被称为函数声明。它的基本语法结构包含函数名、参数列表和函数体三部分，函数体用大括号包裹，里面是具体要执行的代码逻辑。

下面是一个最简单的函数示例，这个函数没有参数，执行时只会在控制台输出一段固定文本：

// 使用function关键字声明一个名为sayHello的函数
function sayHello() {
    // 函数体：执行打印操作
    console.log("你好，这是我的第一个JavaScript函数");
}

// 调用函数，执行函数内部的逻辑
sayHello();

上面的代码中，我们首先通过function sayHello()声明了一个名为sayHello的函数，函数体里只有一行打印逻辑。之后通过sayHello()的方式调用这个函数，程序执行到调用语句时，就会运行函数内部的代码，控制台会输出对应的文本。

带参数的函数创建方法

实际开发中，函数通常需要处理外部传入的数据，这时候就需要为函数定义参数。参数是函数在定义时声明的变量，调用函数时传入的具体值会赋值给这些参数，供函数体内部使用。

下面的示例创建了一个带两个参数的函数，实现两个数字相加并返回结果的功能：

// 声明add函数，接收两个参数a和b
function add(a, b) {
    // 将两个参数相加，用return返回结果
    return a + b;
}

// 调用add函数，传入10和20作为参数
let result = add(10, 20);
console.log("10和20相加得到的结果是：" + result); // 输出：10和20相加得到的结果是：30

// 也可以传入其他数值，函数会复用逻辑计算
let anotherResult = add(5, 8);
console.log("5和8相加得到的结果是：" + anotherResult); // 输出：5和8相加得到的结果是：13

这里需要注意，return关键字的作用是结束函数执行，并把后面的结果返回给调用方。如果函数没有return语句，或者return后面没有值，函数调用后会返回undefined。

函数表达式的创建方式

除了函数声明，还可以用函数表达式的方式创建函数，也就是把一个匿名函数赋值给一个变量，这个变量就相当于函数名，可以通过变量名调用函数。

下面的示例用函数表达式的方式实现和上面add函数相同的功能：

// 将匿名函数赋值给变量subtract，创建subtract函数
const subtract = function(a, b) {
    return a - b;
};

// 调用函数
let subResult = subtract(20, 8);
console.log("20减去8的结果是：" + subResult); // 输出：20减去8的结果是：12

函数声明和函数表达式有一个重要区别：函数声明会有变量提升，也就是说在函数声明之前就可以调用这个函数；而函数表达式不存在变量提升，必须在定义之后才能调用，否则会报错。

箭头函数（ES6新增方式）

ES6规范新增了箭头函数的语法，它的写法更简洁，适合用于简单的函数逻辑。箭头函数用=>符号定义，省略了function关键字。

下面的示例用箭头函数实现数字相乘的功能：

// 箭头函数写法，接收两个参数，返回相乘结果
const multiply = (a, b) => {
    return a * b;
};

// 如果函数体只有一行return语句，可以省略大括号和return
const multiplySimple = (a, b) => a * b;

// 调用两种方式定义的函数，结果一致
console.log("3乘4的结果是：" + multiply(3, 4)); // 输出：3乘4的结果是：12
console.log("3乘4的结果是：" + multiplySimple(3, 4)); // 输出：3乘4的结果是：12

使用箭头函数时如果只有一个参数，还可以省略参数外的小括号，比如定义一个计算平方的函数可以写成const square = x => x * x;，调用square(5)就会返回25。

函数的实际应用场景

函数可以应用在各种需要复用逻辑的场景中，比如下面的示例，我们创建一个函数用来判断一个数字是否是偶数，这个函数可以在多个地方反复调用：

// 判断数字是否为偶数的函数
function isEven(num) {
    // 取余运算，余数为0则是偶数
    return num % 2 === 0;
}

// 多次调用函数，判断不同数字
console.log("4是否是偶数：" + isEven(4)); // 输出：4是否是偶数：true
console.log("7是否是偶数：" + isEven(7)); // 输出：7是否是偶数：false

// 结合数组遍历使用函数
const numbers = [1, 2, 3, 4, 5, 6];
// 过滤出数组中的偶数
const evenNumbers = numbers.filter(isEven);
console.log("数组中的偶数是：" + evenNumbers); // 输出：数组中的偶数是：2,4,6

通过这个例子可以看到，将判断偶数的逻辑封装成函数后，不仅可以直接调用判断单个数字，还可以作为参数传给数组的filter方法，实现数组的筛选功能，充分体现了函数的复用价值。

JavaScript函数函数声明函数表达式箭头函数参数与返回值 本作品最后修改时间：2026-05-23 23:34:14