百度360必应搜狗淘宝本站头条
当前位置:网站首页 > IT知识 > 正文

es6+新增特性有哪些(es6中新增)

liuian 2025-03-25 15:21 10 浏览

ES6+(ES6及以后版本,如ES7、ES8等)新增了许多特性,主要包括以下几个方面:


1. ES6(2015)新增特性

变量声明

  • let 和 const(块级作用域)
  • var(仍可用,但更推荐 let 和 const)

模板字符串

Bash
const name = "Tom";
console.log(`Hello, ${name}!`); // Hello, Tom!

解构赋值

Bash
const user = { name: "Alice", age: 25 };
const { name, age } = user; 
console.log(name, age); // Alice 25
const numbers = [1, 2, 3];
const [first, second] = numbers;
console.log(first, second); // 1 2

展开运算符(...)

const arr1 = [1, 2];
const arr2 = [...arr1, 3, 4]; // [1, 2, 3, 4]
const obj1 = { a: 1, b: 2 };
const obj2 = { ...obj1, c: 3 }; // { a: 1, b: 2, c: 3 }

箭头函数

const add = (a, b) => a + b;
console.log(add(2, 3)); // 5

默认参数

const greet = (name = "Guest") => `Hello, ${name}!`;
console.log(greet()); // Hello, Guest!

对象字面量增强

const age = 25;
const user = { name, age }; // { name: "Alice", age: 25 }

类(Class)

class Person {
  constructor(name) {
    this.name = name;
  }
  sayHello() {
    console.log(`Hello, I'm ${this.name}`);
  }
}
const p = new Person("Alice");
p.sayHello(); // Hello, I'm Alice

模块(Module)

// a.js
export const greet = () => console.log("Hello");
// b.js
import { greet } from "./a.js";
greet();

Promise

const fetchData = () =>
  new Promise((resolve, reject) => {
    setTimeout(() => resolve("Data loaded"), 1000);
  });

fetchData().then((res) => console.log(res)); // Data loaded

Set 和 Map

const set = new Set([1, 2, 2, 3]);
console.log(set); // Set { 1, 2, 3 }

const map = new Map();
map.set("key1", "value1");
console.log(map.get("key1")); // value1

for...of 循环

const arr = [1, 2, 3];
for (const num of arr) {
  console.log(num);
}

Symbol(唯一值)

const sym = Symbol("unique");
console.log(sym); // Symbol(unique)

2. ES7(2016)新增特性

Array.prototype.includes

console.log([1, 2, 3].includes(2)); // true

指数运算符(**)

console.log(2 ** 3); // 8

3. ES8(2017)新增特性

async/await

const fetchData = async () => {
  return "Data loaded";
};
fetchData().then(console.log); // Data loaded

Object.entries() / Object.values()

const obj = { a: 1, b: 2 };
console.log(Object.entries(obj)); // [['a', 1], ['b', 2]]
console.log(Object.values(obj)); // [1, 2]

字符串填充

console.log("5".padStart(2, "0")); // '05'
console.log("5".padEnd(3, "0")); // '500'

4. ES9(2018)新增特性

对象的展开运算符

const obj1 = { a: 1, b: 2 };
const obj2 = { ...obj1, c: 3 }; // { a: 1, b: 2, c: 3 }

Promise.prototype.finally

fetchData()
  .then(console.log)
  .catch(console.error)
  .finally(() => console.log("Done"));

5. ES10(2019)新增特性

Array.prototype.flat() 和 flatMap()

console.log([1, [2, [3, 4]]].flat(2)); // [1, 2, 3, 4]
console.log([1, 2].flatMap(x => [x * 2])); // [2, 4]

Object.fromEntries()

console.log(Object.fromEntries([["a", 1], ["b", 2]])); // { a: 1, b: 2 }

6. ES11(2020)新增特性

可选链(?.)

const user = { profile: { name: "Alice" } };
console.log(user?.profile?.name); // Alice
console.log(user?.address?.street); // undefined

空值合并运算符(??)

console.log(null ?? "default"); // "default"
console.log(0 ?? "default"); // 0

Promise.allSettled()

Promise.allSettled([Promise.resolve(1), Promise.reject("error")])
  .then(console.log);

7. ES12(2021)新增特性

String.prototype.replaceAll()

console.log("hello world".replaceAll("l", "L")); // "heLLo worLd"

Promise.any()

Promise.any([
  Promise.reject("error"),
  Promise.resolve("success"),
]).then(console.log); // "success"

WeakRef(弱引用)

const obj = new WeakRef({ name: "Alice" });

8. ES13(2022)新增特性

Object.hasOwn()

console.log(Object.hasOwn({ a: 1 }, "a")); // true

顶层 await

const data = await fetch("https://api.example.com/data").then(res => res.json());
console.log(data);

总结

ES6+ 带来了大量新特性,其中 ES6 是最大的一次更新,引入了 let、const、箭头函数、解构赋值、类、模块化等。后续版本(ES7+)继续增加了 async/await、可选链(?.)、Promise.allSettled()、Object.hasOwn() 等新特性。

你最关注哪些特性?可以针对某个特性深入探讨!

相关推荐

如何修改图片拍摄日期?快速修改图片拍摄日期的6种方法

在数字化时代,图像作为信息传递的重要载体,在个人生活记录、新闻传播及商业营销中发挥着不可替代的作用。然而,当面对特定需求时,如隐私保护、编辑优化或时间戳校正等场景,调整图片拍摄时间的需求时常出现。通过...

python教程从基础到精通,第9课—日期与时间

Hello,小伙伴们,祝大家五.一玩得快乐!刚学习完了七大数据类型,今天咱们来学习日期与时间的表示方法。Python标准库中提供了时间和日期的支持:calendar:日历相关;time、datetim...

Python中datetime模块和date类的主要区别是什么?

Python中datetime模块和date类的主要区别如下:一、功能范围差异datetime模块核心功能:提供完整的日期和时间处理能力,包含日期、时间、时间间隔、时区等操作。关键类:datetime...

解密Python时间测量迷雾:高精度计时器time.perf_counter的妙用

当我们在Python中使用time模块进行时间测量时,可能会遇到一些精度不够的问题。具体而言,time.time()返回的是自纪元以来的秒数,但在一些情况下,其精度可能受到系统硬件时钟的限制,无法捕捉...

Python技能:时间管理哪家强?time、datetime、calendar来相会!

大家好,我是钢铁老豆!快到五一了,每年到了这个时间点,就又该吐槽放假调休啦!真心不如不调,心累啊!言归正传,今天我们要聊聊Python是如何操作日期和时间的。0.模块简介在Python中,处理日期和...

python之时间处理

datetime包导入包与模块fromdatetimeimportdatetimeimportdatetime常用函数函数名功能说明now获取当前时间戳用法:now=datetime.n...

软件测试|教你轻松玩转Python日期时间

Python基础之日期时间处理前言:软件测试工作中,有时会需要我们在代码中处理日期以及时间,python内置的datetime模块就可以很好地帮我们处理这个问题。该模块常用的类有:类名功能说明date...

「耗时测试」python time包中的time()和process_time()如何选择?

在统计python代码执行速度时要使用到time包,可以使用time.time()和time.process_time()(注:Python3.8已移除clock()方法,可以使用perf_...

python进阶突破内置模块——日期与时间详解

Python提供了多个内置模块用于处理日期和时间,涵盖了从基础时间操作到时区管理的各种需求。以下是核心模块及其关键功能的详细说明:1.datetime模块datetime是处理日期和时间的核心模块...

python就该这么学:python快速获取系统时间

在python语言中,为了得到一定目的,多数通过调用第三方的库来完成。要获取系统时间需要调用时间相关的库time。通过importtime来引入库。为了方便编码或者防止歧义,也可以通过import...

Python日期和时间

说明Python提供了一个time和calendar模块可以用于格式化日期和时间。时间间隔是以秒为单位的浮点小数。每个时间戳都以自从1970年1月1日午夜(历元)经过了多长时间来表示。pyt...

python内置时间函数time详解

内置函数时间time()1、年:tm_year,月:tm_mon,日:tm_mday,时:tm_hour,分:tm_min,秒:tm_sec,星期:tm_wday(从0开始)2、Time.t...

【Python数据分析系列】将一个时间戳转换为可读的日期和时间格式

这是我的第396篇原创文章。一、引言在Python中可以通过datetime模块来实现。一般来说,时间戳通常是自1970年1月1日(称为“Unix时间”)以来的秒数。以下是一个示例,演示如何将这...

程序员的日常:时间戳和时区的故事

什么是时间戳(timestamp)?它和时区(timezone)又有什么关系?初学者可能一开始很难搞懂时间戳这个概念,就像这期《程序员的日常》漫画中的主人公一样。漫画注释从漫画中举的例子来看,这里的时...

快速掌握Python时间函数的常用知识

我们经常要用到时间,像日志log就要记录时间,什么时候做了什么事情;什么时候调用了哪些过程;什么时候返回了错误等等。时间模块里面的一些方法也是经常会用到的,比如游戏要控制时间,如贪吃蛇的移动时间控制,...