JavaScript 中函数的定义各种方式

基础函数

函数提升：可以在函数定义之前调用函数，JavaScript会先扫描并提升函数声明到当前作用域顶部。

function 变量名(参数1, 参数2, ...) {
    相关代码逻辑
    return 返回值; // 可选，没有 return 则返回 undefined
}

函数表达式

不支持函数提升，必须先定义再调用。

匿名函数

调试时函数名显示为anonymous，不方便排查。

const 变量名 = function(参数1, 参数2, ...) {
    相关代码逻辑
    return 返回值;
}

具名函数

函数有名字，仅在函数内部使用。比如递归。

const 变量名 = function 函数名(参数1, 参数2, ...) {
    相关代码逻辑，函数名仅在当前函数体内使用
    return 返回值;
}

箭头函数

ES6新增语法，用=>简化函数定义。

没有自己的this，this继承自外层作用域。

单参数 + 单语句返回

可省略()和{}。

const 函数名 = 参数 => 返回值表达式;

多参数 + 单语句返回

必须加()，可省略{}。

const 函数名 = (参数1, 参数2, ...) => 返回值表达式;

多语句函数体

必须加()和{}。

const 函数名 = (参数1, 参数2, ...) => {
    相关代码逻辑1
    相关代码逻辑2
    return 返回值;
};

对象方法简写（对象专属）

Object Method Shorthand

方法名(参数) { 函数体 }

省略function关键字

const 对象名 = {
    方法名(参数1, 参数2, ...) {
        相关代码逻辑
        return 返回值;
    }
}

箭头函数作为对象方法

注意this指向，不是指向对象名，而是指向全局。

const 对象名 = {
    箭头方法名: (参数1, 参数2, ...) => {
        相关代码逻辑
        return 返回值;
    }
}

类方法（类专属）

ES6引入class语法后，在类内部定义的函数叫类方法。

实例方法

class 类名 {
    方法名(参数1, 参数2, ...) {
        相关代码逻辑
        return 返回值;
    }
}

静态方法

class 类名 {
    static 静态方法名(参数1, 参数2, ...) {
        相关代码逻辑
        return 返回值;
    }
}

Function 构造函数（不推荐使用）

const 函数名 = new Function("参数1", "参数2", ..., "函数体语句; return 返回值;");

标签函数

模板字符串的处理器，通过函数名+模板字符串调用，接收strings（字面量数组）和values（插值数组）。

核心用途：自定义处理逻辑（格式化、转义、语法解析）

示例

function myTag(strings, ...values) {
    return ...
}

使用

strings部分是：["我是", "，今年", "岁"]三个元素。

values部分是：["aaa", 18]两个元素。

const name = 'aaa';
const age = 18;
const result = myTag`我是${name}，今年${age}岁`;