javascript 的 function 就是函数，是一段可以重复调用的代码块，用来封装独立逻辑，接收传入参数，执行运算之后可以返回结果，它是 javascript 里面非常核心的基础概念，所有复杂业务逻辑组件事件回调都离不开 function，javascript 里面 function 属于一等公民，意思就是函数本身可以当作变量赋值，可以作为参数传递，也可以当作返回值输出，这个特性和很多传统面向对象语言有明显区别，很多初学者一开始只掌握普通声明写法，不清楚函数表达式箭头函数立即执行函数这些变体，也不理解 this arguments 闭包这些和 function 绑定的核心机制，深入掌握 function，才能读懂前端原生代码以及各类框架底层源码。
function 四种主流定义方式
函数声明
写法关键字 function 后面直接写函数名，括号写参数，大括号写函数体
特点 存在函数提升，代码执行之前函数就已经被解析，可以在定义之前调用
适用场景 全局通用工具函数，页面主逻辑函数
函数表达式
把 function 赋值给变量，变量名就是函数名
特点 没有函数提升，必须等变量声明之后才可以调用，不能提前调用
适用场景 事件回调 赋值给对象属性的函数
箭头函数 ES6 新增
使用箭头符号替代传统 function 关键字
特点 不绑定自身 this，没有 arguments，不能当作构造函数，不能使用 new 调用
适用场景 回调函数 简短匿名函数
立即执行函数 IIFE
函数定义完成之后马上自动执行，不需要手动调用
特点 可以创建独立作用域，避免全局变量污染，老式前端代码非常常见
适用场景 早期模块化封装 初始化代码
核心属性与内置对象表格
| 项目 | 说明 |
|---|---|
| 参数列表 | 圆括号内部定义形参，调用时传入实参，形参数量和实参数量可以不一致 |
| return 语句 | 用来返回执行结果，没有 return 默认返回 undefined |
| arguments | 类数组对象，保存所有传入实参，传统 function 才有，箭头函数没有 |
| this | 函数内部 this 指向由调用方式决定，不是定义位置决定 |
| length | function 对象的 length 属性，表示形参的个数 |
| name | function 对象的 name 属性，表示函数名称 |
深度核心机制讲解
第一 函数提升，函数声明会被提升到当前作用域顶部，所以可以先调用后定义，函数表达式不会提升，如果提前调用会报错，这个是 function 最容易混淆的考点。
第二 this 指向规则，普通 function 的 this 分四种情况，普通调用指向全局对象，对象方法调用指向该对象，new 构造调用指向新创建实例，call apply bind 修改 this 指向，箭头函数继承外层作用域 this，不会动态改变。
第三 闭包，当内部 function 引用外部函数变量，外部函数执行结束之后变量不会销毁，这个就是闭包，闭包是 javascript 高级特性，定时器事件回调模块化都依赖闭包原理。
第四 构造函数，普通 function 前面加 new 关键字调用，就变成构造函数，用来创建实例对象，但是箭头函数不能作为构造函数。
第五 参数特性，javascript 的 function 参数没有类型校验，实参可以多传少传，多余参数可以通过 arguments 获取，缺少参数的值就是 undefined，ES6 支持默认参数和剩余参数。
基础调用步骤
第一步 根据业务需求选择合适的 function 定义方式
第二步 编写函数体逻辑，按需添加 return 返回结果
第三步 在需要执行的位置写函数名加括号，传入对应的实参
第四步 接收函数 return 返回的值，继续后续业务处理
第五步 如果是回调类型 function，不需要手动调用，交给触发事件或者定时器自动执行
补充拓展
function 还可以结合高阶函数概念，高阶函数就是接收 function 作为参数，或者返回一个 function，比如数组的 map filter forEach，底层都是接收回调 function，前端框架里面大量使用高阶函数思想。另外还有 Function 构造器，可以动态创建函数，但是这种写法不推荐日常使用，存在安全风险，一般只在特殊动态场景才会用到。
【常见问题】
问题 1 javascript 的 function 里面箭头函数和普通 function 有什么区别
回答 1 javascript 的 function 普通写法拥有独立 this 和 arguments，可以 new 构造调用，箭头函数属于特殊 function 写法，不绑定自身 this，没有 arguments，不能使用 new 调用
问题 2 javascript 的 function 声明为什么可以提前调用
回答 1 javascript 的 function 声明存在函数提升，解析阶段会把 function 声明提升到作用域顶部，所以 javascript 的 function 声明可以在定义之前调用，函数表达式不支持这个特性
问题 3 javascript 的 function 没有写 return 返回什么
回答 3 javascript 的 function 如果代码内部没有写 return 语句，执行完成之后默认返回 undefined，javascript 的 function 可以通过 return 自定义返回任意类型数据
问题 4 javascript 的 function 里面 arguments 是什么
回答 4 javascript 的 function 里面 arguments 是类数组对象，保存全部传入的实参，传统 javascript 的 function 才拥有 arguments，箭头函数不存在 arguments 对象
【免责申明】
本文内容为 javascript 的 function 基础与进阶语法科普讲解，基于 ES 标准语法，不同浏览器引擎兼容细节存在轻微差异，实际开发请结合运行环境测试，本文不构成项目代码唯一标准方案。