网站上传视频教程,东莞seo网络推广,简述电子商务网站的建设流程图,aws 知乎 wordpress这篇文章讲一下ES6中的核心语法#xff1a;扩展运算符和模块化。
目录
1.扩展运算符
数组中的扩展运算符
基本用法
合并数组
对象中的扩展运算符
基本用法
合并对象
与解构赋值结合使用
数组解构中的剩余元素
对象解构中的剩余属性 2.模块化
基本概念 1.扩展运算符…这篇文章讲一下ES6中的核心语法扩展运算符和模块化。
目录
1.扩展运算符
数组中的扩展运算符
基本用法
合并数组
对象中的扩展运算符
基本用法
合并对象
与解构赋值结合使用
数组解构中的剩余元素
对象解构中的剩余属性 2.模块化
基本概念 1.扩展运算符 扩展运算符是 ES6 引入的一种语法使用三个点...表示。它可以在数组和对象中展开元素或属性提供了一种简洁的方式来操作数据结构。
数组中的扩展运算符
扩展运算符可以用来将一个数组展开成另一个数组的元素。
基本用法
const arr1 [1, 2, 3];
const arr2 [...arr1, 4, 5, 6];
console.log(arr2); // 输出 [1, 2, 3, 4, 5, 6]合并数组
你可以使用扩展运算符合并多个数组
const arr1 [1, 2, 3];
const arr2 [4, 5, 6];
const merged [...arr1, ...arr2];
console.log(merged); // 输出 [1, 2, 3, 4, 5, 6]对象中的扩展运算符
在对象字面量中扩展运算符可以用来展开对象的属性。
基本用法
const obj1 { a: 1, b: 2 };
const obj2 { ...obj1, c: 3 };
console.log(obj2); // 输出 { a: 1, b: 2, c: 3 }合并对象
你可以使用扩展运算符合并多个对象
const obj1 { a: 1, b: 2 };
const obj2 { b: 3, c: 4 };
const merged { ...obj1, ...obj2 };
console.log(merged); // 输出 { a: 1, b: 3, c: 4 }注意在对象合并中如果有重复的属性名后面的属性会覆盖前面的属性。
与解构赋值结合使用
扩展运算符可以与解构赋值结合使用以提取对象或数组中的部分元素或属性。
数组解构中的剩余元素
const [first, ...rest] [1, 2, 3, 4];
console.log(first); // 输出 1
console.log(rest); // 输出 [2, 3, 4]对象解构中的剩余属性
const { a, ...others } { a: 1, b: 2, c: 3 };
console.log(a); // 输出 1
console.log(others); // 输出 { b: 2, c: 3 }2.模块化
ES6 模块化是指通过使用 import 和 export 关键字来定义和导入模块使得代码更加清晰和可维护。
基本概念
模块一个模块是一个文件文件内部的变量和函数默认处于模块作用域内不会污染全局作用域。也就是说不同模块中有相同名字的变量和函数它们也是独立的不会互相冲突。如果你想在一个文件中同时引入不同文件的变量a可以通过导入时重命名来避免命名冲突。导出使用 export 关键字将变量、函数或类导出使其在其他模块中可用。导入使用 import 关键字从其他模块中导入变量、函数或类。
