JavaScript函数定义与调用全解析

本文深入解析了JavaScript中函数定义与调用的核心机制：三种定义方式——函数声明（可提升、支持提前调用）、函数表达式（需先定义后使用）和箭头函数（简洁无this/arguments、不可构造）——各具语义与限制；四种主流调用方式——直接调用、方法调用、call/apply显式绑定、bind预设绑定——则精准控制this指向与参数传递逻辑，辅以IIFE、构造函数调用及事件回调等常见场景的注意事项；掌握这些差异不仅能避免this丢失、提升错误等典型陷阱，更能写出更健壮、可维护的函数式代码。

JavaScript函数通过function关键字、箭头函数（=>）或Function构造函数来定义，调用方式主要有四种：直接调用、作为方法调用、使用call/apply、以及使用bind生成新函数后调用。

函数的三种定义方式

函数声明：用function关键字 + 函数名 + 参数列表 + 函数体。会被提升（hoisted），可在声明前调用。

函数表达式：把函数赋值给变量，常见于const fn = function() { ... }。不被提升，必须先定义再调用。

箭头函数：简洁写法，如const add = (a, b) => a + b。没有自己的this、arguments、super或new.target，不能用作构造函数。

四种主要调用方式

直接调用：最常见，如myFunc()。此时this在非严格模式下指向全局对象（浏览器中是window），严格模式下为undefined。

作为对象方法调用：如obj.doSomething()。函数内部this指向该对象（obj）。

用call或apply调用：显式指定this和参数。区别在于参数传递形式：call(obj, a, b) vs apply(obj, [a, b])。

用bind生成并调用：返回一个this和部分参数被预设的新函数，如const bound = fn.bind(obj, 1); bound(2);等价于fn.call(obj, 1, 2)。

其他可选调用场景

立即执行函数表达式（IIFE）：定义后立刻调用，常用于创建私有作用域，如(function(){ ... })();或((a) => {...})(1);。

作为构造函数调用：用new关键字调用普通函数（非箭头函数），会创建新实例，this指向该实例。

事件回调或定时器中调用：如button.addEventListener('click', handleClick)或setTimeout(myFunc, 1000)，本质仍是直接调用或方法调用，但上下文可能意外丢失（需注意this绑定）。

基本上就这些。定义方式影响语法和行为，调用方式决定this指向和参数传递逻辑——不复杂但容易忽略细节。

今天关于《JavaScript函数定义与调用全解析》的内容就介绍到这里了，是不是学起来一目了然！想要了解更多关于的内容请关注golang学习网公众号！