ES6+ 特性,箭头函数、解构赋值、模块导入

1. 箭头函数(Arrow Functions)

箭头函数是 ES6 引入的一种简洁的函数定义方式。它的语法更简洁,并且不会绑定自己的 this 值。箭头函数通常用于简化函数表达式。

基本语法

const add = (a, b) => a + b;

特点

  • 简洁:省略了 function 关键字、花括号和 return 关键字(如果函数体只有一行代码)。
  • 没有自己的 this:箭头函数会继承外部函数的 this,而不是创建自己的 this。这在处理回调函数时非常有用。

示例

// 普通函数
function sayHello(name) {return `Hello, ${name}`;
}// 箭头函数
const sayHello = name => `Hello, ${name}`;// 不需要参数的箭头函数
const getRandomNumber = () => Math.random();

2. 解构赋值(Destructuring Assignment)

解构赋值是一种从数组或对象中提取值的语法,使得赋值操作更加简洁和易读。

数组解构

const numbers = [1, 2, 3, 4];
const [a, b, c] = numbers;
console.log(a); // 1
console.log(b); // 2

对象解构

const person = {name: 'John',age: 30,city: 'New York'
};
const { name, age } = person;
console.log(name); // John
console.log(age);  // 30

默认值

const [a, b = 2] = [1];
console.log(b); // 2const { x = 10 } = {};
console.log(x); // 10

嵌套解构

const person = {name: 'Jane',address: {city: 'London',postcode: 'SW1A 1AA'}
};
const { name, address: { city } } = person;
console.log(name); // Jane
console.log(city); // London

3. 模块导入(Modules)

ES6 引入了模块化语法,使得代码可以被分割成多个模块,每个模块都有自己的作用域,支持导入和导出功能。

导出

命名导出

// utils.js
export const add = (a, b) => a + b;
export const subtract = (a, b) => a - b;

默认导出

// utils.js
const multiply = (a, b) => a * b;
export default multiply;

导入

导入命名导出

// main.js
import { add, subtract } from './utils.js';
console.log(add(2, 3)); // 5
console.log(subtract(5, 2)); // 3

导入默认导出

// main.js
import multiply from './utils.js';
console.log(multiply(2, 3)); // 6

别名导入

// main.js
import { add as addition, subtract as subtraction } from './utils.js';
console.log(addition(2, 3)); // 5
console.log(subtraction(5, 2)); // 3

动态导入(异步加载模块):

// main.js
async function loadModule() {const module = await import('./utils.js');console.log(module.add(2, 3)); // 5
}loadModule();

这些 ES6+ 特性在编写现代 JavaScript 应用程序时非常有用,可以帮助你编写更简洁、易维护的代码。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/52313.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

解锁 macOS 剪贴板历史记录,高效复制、粘贴技巧

在Mac上,我们经常需要在不同文档之间复制和粘贴内容。然而,macOS自带的剪贴板只能保存最后一个复制项,这大大限制了我们的工作效率。幸运的是,一些第三方应用程序可以帮助我们查看和管理剪贴板的历史记录,从而提升我们…

关系的规范化与范式详解

在数据库设计中,关系的规范化是确保数据结构合理性、减少冗余和异常的关键步骤。如果你是一个数据库设计的初学者,这篇文章将为你深入浅出地讲解 关系规范化 和 范式 的核心概念,并通过简洁的示例帮助你加深理解。 关系的规范化:…

Android Manifest 权限描述大全对照表

115工具网(115工具网-一个提供高效、实用、方便的在线工具集合网站)提供Android Manifest 权限描述大全对照表,可以方便andriod开发者查看安卓权限描述功能 权限名称描述android.permission.ACCESS_CHECKIN_PROPERTIES访问登记属性读取或写入…

飞机制造5G智能工厂数字孪生工业物联平台,推进制造业数字化转型

飞机制造行业作为高端制造业的典范,正积极探索数字化转型的新路径。飞机制造5G智能工厂数字孪生工业物联平台(以下简称“平台”)的兴起,不仅为飞机制造业注入了强劲动力,更为整个制造业的数字化转型树立了新的标杆。 …

微知-BIOS中的XHCI模式是什么意思?(usb3.0的扩展控制器影响usb3.0速率等选项)

XHCI “eXtensible Host Controller Interface” “可扩展主机控制器接口”。 英特尔公司开发的一个USB主机控制器接口,主要面向USB 3.0,同时也支持USB 2.0及以下版本的设备。 是usb3.0的核心部分。 有他表示主机支持usb3.0 三种模式:Smart …

B: 小球反弹

目录 一: 二: 三: 四: 一:问题描述 有一长方形,长为343720 单位长度,宽为233333 单位长度。在其内部左上角顶点有一小球(无视其体积),其初速度如图所示且…

Spring Boot项目中怎么构建多模块的应用

在大型项目开发中,将项目分解为多个模块不仅可以增强代码的可维护性,还能提高开发效率。Spring Boot 提供了对多模块项目的良好支持,使得我们可以轻松地构建复杂的企业级应用程序。在这篇文章中,我们将深入探讨如何在Spring Boot项…

【Rust练习】12.枚举

练习题来自:https://practice-zh.course.rs/compound-types/enum.html 1 // 修复错误 enum Number {Zero,One,Two, }enum Number1 {Zero 0,One,Two, }// C语言风格的枚举定义 enum Number2 {Zero 0.0,One 1.0,Two 2.0, }fn main() {// 通过 as 可以将枚举值强转…

使用FFmpeg的AVFilter转换YUV到RGB

AVFilter 是 FFmpeg 库 libavfilter 的核心组件,提供了一套强大的音视频处理框架,用于对音视频流进行复杂的过滤、转换和效果处理。通过 AVFilter,开发者可以构建自定义的滤镜图(filter graph),实现各种音视…

(每日一问)操作系统:常见的 Linux 指令详解

(每日一问)操作系统:常见的 Linux 指令详解 Linux 系统作为一种开源的操作系统,以其高效、稳定和安全的特性,广泛应用于服务器、开发环境和嵌入式系统等领域。日常使用 Linux,掌握常见的基本指令至关重要&a…

Transformer预测 | 基于Transformer心率时间序列预测(tensorflow)

效果一览 基本介绍 Transformer预测 | 基于Transformer心率时间序列预测(tensorflow) 程序设计 import pandas as pd from pandas.plotting import lag_plot from statsmodels.graphics

EP1 banner海报swiper轮播器

文件路径&#xff1a; E:/homework/uniappv3tswallpaper/pages/index/index.vue <template><view class"homeLayout"><view class"banner"><swiper :indicator-dots"true" :autoplay"true" :interval"3000…

变量数据类型 Day3

1. 变量 1.1 变量的概念 变量是计算机内存中的一块存储单元&#xff0c;是存储数据的基本单元变量的组成包括&#xff1a;数据类型、变量名、值&#xff0c;后文会具体描述变量的本质作用就是去记录数据的&#xff0c;比如说记录一个人的身高、体重、年龄&#xff0c;就需要去…

script中的src

<script src"http://www.somewhere.com/afile.js"></script> 浏览器在解析这个资源时&#xff0c;会向 src 属性指定的路径发送一个 GET 请求&#xff0c;以取得相应资源&#xff0c;假定 是一个 JavaScript 文件。这个初始的请求不受浏览器同源策略限…

Verilog基础,原码,反码与补码的概念

Verilog模块初认识 1、Verilog模块(Module) Verilog中的module可以看成一个具有输入输出端口的黑盒子&#xff0c;该黑盒子有输入和输出接口(信号)&#xff0c;通过把输入在盒子中执行某些操作来实现某项功能。(类似于C语言中的函数) 图1 模块示意图 1.1 模块描述 图1 所示的…

2024年【防爆电气】试题及解析及防爆电气模拟考试题库

题库来源&#xff1a;安全生产模拟考试一点通公众号小程序 防爆电气试题及解析考前必练&#xff01;安全生产模拟考试一点通每个月更新防爆电气模拟考试题库题目及答案&#xff01;多做几遍&#xff0c;其实通过防爆电气复审模拟考试很简单。 1、【单选题】()利用输送爆炸危险…

Einsum(Einstein summation convention)

Einsum&#xff08;Einstein summation convention&#xff09; 笔记来源&#xff1a; Permute和Reshape嫌麻烦&#xff1f;einsum来帮忙&#xff01; The Einstein summation convention is a notational shorthand used in tensor calculus, particularly in the fields of …

大美祖国之地名篇-探寻全国同名地名

目录 前言 一、地名数据库 1、数据库模型 2、数据表结构 二、实践之旅&#xff0c;发现同名地名 1、省、市同名 2、市、县同名 3、 区县、乡镇同名 4、乡镇和村委会同名 三、总结 前言 我们祖国地大物博&#xff0c;从北到南&#xff0c;从东到西。祖国位于亚洲东部&…

九,自定义转换器详细操作(附+详细源码解析)

九&#xff0c;自定义转换器详细操作&#xff08;附详细源码解析&#xff09; 文章目录 九&#xff0c;自定义转换器详细操作&#xff08;附详细源码解析&#xff09;1. 基本介绍2. 准备工作3. 自定义转换器操作4. 自定义转换器的注意事项和细节5. 总结&#xff1a;6. 最后&…

电脑怎么限制软件上网?推荐三个超详细的小妙招(软件上网权限管理)

想要控制电脑上哪些软件可以上网、哪些不能&#xff1f;不管是为了保护隐私、节省流量&#xff0c;还是提高工作效率&#xff0c;限制软件上网都是非常实用的小妙招&#xff01; 今天给大家带来三个超详细的招数&#xff0c;帮助你轻松管理软件的上网权限。让那些不该上网的应…