ES6(2) 函数详解

1. ES6 中的函数概述

ES6 提供了多种定义函数的方法,包括传统的函数声明、函数表达式、匿名函数、箭头函数等。这些不同的方式可以帮助我们更加灵活地编写代码。

2. 函数的基本定义

2.1 传统函数声明

ES6 仍然支持使用 function 关键字定义函数。

复制代码
function web(){
    return "https://blog.csdn.net/Theodore_1022";
}
console.log(web()); // 输出:"https://blog.csdn.net/Theodore_1022"

2.2 传递参数的函数

函数可以接收参数,并在函数体内部使用它们。

复制代码
function dev(a, b){
    return a - b;
}
console.log(dev(4, 5)); // 输出:-1

3. 参数默认值

在 ES6 中,函数参数可以有默认值,如果调用时未传入参数,则使用默认值。

复制代码
function plus1(a = 1, b = 2){
    return a * b;
}
console.log(plus1()); // 输出:2 (1*2)
console.log(plus1(2, 3)); // 输出:6 (2*3)

4. 匿名函数(Function Expression)

匿名函数是一种没有名称的函数,可以赋值给变量。

复制代码
let plus2 = function(a, b){
    return a * b;
};
console.log(plus2(3, 4)); // 输出:12

5. 箭头函数(Arrow Function)

5.1 基本箭头函数

ES6 引入了箭头函数,使用 => 语法,使代码更加简洁。

复制代码
let plus3 = (a, b) => {
    return a * b;
};
console.log(plus3(4, 2)); // 输出:8

5.2 省略 {} 并隐式返回

当函数体只有一条返回语句时,可以省略 {}return 关键字。

复制代码
let plus4 = (a, b) => a * b;
console.log(plus4(5, 6)); // 输出:30

6. 结语

ES6 提供了多种定义函数的方法,使 JavaScript 代码更加简洁、高效。掌握函数的不同写法,有助于更好地编写现代 JavaScript 代码。在开发过程中,推荐使用箭头函数简化回调,提高可读性,同时在适当场景下使用默认参数,减少冗余代码。

相关推荐
Csvn29 分钟前
`??` 和 `||` 搞混,线上用户头像全挂了
前端
kyriewen1 小时前
白宫前脚下了限制令,OpenAI 后脚就把 GPT-5.6 发了
前端·gpt·openai
用户40269244819082 小时前
CRMEB Pro 新增后台接口全链路:路由、权限、验证器、返回格式一次讲清
前端·后端
泉城老铁2 小时前
springboot+vue+ ffmpeg 实现视频的拉流播放
前端
逸铭2 小时前
Day 5:三栏布局——左账号 / 中聊天 / 右工具
vue.js·electron
PedroQue993 小时前
uni-router v1.8.0新增冷启动守卫补执行
前端·uni-app
xiaok3 小时前
部署之后,本地浏览器还在读取旧缓存导致页面一直显示loading中
前端
用户059540174463 小时前
Redis缓存一致性踩坑实录:线上故障排查6小时,我用pytest+内存快照把它永久关进了笼子
前端·css
星栈3 小时前
我用 Rust + Dioxus 做了个全栈跨平台笔记应用:第一版先把列表和详情跑通
前端·rust·前端框架
用户1733598075373 小时前
Vue 3 SPA 首屏优化:从 3s 到 1.2s 的 5 个实践
前端·vue.js