前言:ECMAScript是 JavaScript 的标准化版本,由 ECMA 国际组织制定。ECMAScript 定义了 JavaScript 的语法、类型、语句、关键字、保留字等。
ES6 是 ECMAScript 的第六个版本,于 2015 年发布,引入了许多重要的新特性,使 JavaScript 更加现代化。
进制
** ES6 中增加了二进制和八进制的写法: 二进制使用前缀 '0b' 或 '0B' , 八进制使用前缀 '0o' 或 '0O'**
二进制:
**前缀:
0b
或
0B:
**
let binary = 0b1010; // 二进制 1010
console.log(binary); // 输出: 10
八进制:
**前缀:
0o
或
0O:
**
let octal = 0o12; // 八进制 12
console.log(octal); // 输出: 10
symbol
**主要用于创建唯一且不可变的标识符(主要用于创建不重复的键) 如下面的sym1和sym2可以当做键,也不会报错 **
const sym1 = Symbol('description');
const sym2 = Symbol('description'); // sym1 和 sym2 不相等
console.log(sym1 === sym2); // 输出: false
class
类是一种蓝图或模板,用于创建对象。它定义了一组属性(状态)和方法(行为),可以被多个对象共享
class Parent {
constructor(name) {
this.name = name;
}
greet() {
console.log(`Hello, my name is ${this.name}.`);
}
}
class继承 :
当你在子类中定义构造函数时,必须调用 super( ) ,否则将无法访问 this 关键字,并且会抛出错误。
class Child extends Parent {
constructor(name) {
// 如果没有 super(),将无法使用 this
super(name); // 必须调用 super() 来访问父类的构造函数
}
}
const child = new Child('Alice');
child.greet(); // 输出: Hello, my name is Alice.
set和map
Set和Map主要的应用场景在于数据重组和数据储存。Set是一种叫做集合的数据类型,Map是一种叫做字典的数据类型
Set和Map是ES6新增的一种数据结构,类似于数组,成员唯一。并且使用键对数据排序即顺序存储,Set本身是一种构造函数,用来生成Set数据结构,Set对象允许你储存任何类型唯一值,无论是原始值还是对象引用
set的一些方法:
创建set对象,然后将元素添加到里面,之后判断该has有没有该元素,size判断该对象当中有几个元素,delete用来进行元素的删除
const mySet = new Set();
mySet.add(1);
mySet.add(5);
mySet.add(5); // 不会添加重复项
console.log(mySet.has(5)); // true
console.log(mySet.size); // 2
mySet.delete(5);
console.log(mySet.size); // 1
map的一些方法:
** map当中存放的是键值对,然后比set方法当中多了可以通过健名来查找元素**
const myMap = new Map();
myMap.set('name', 'Alice');
myMap.set('age', 30);
console.log(myMap.get('name')); // Alice
console.log(myMap.has('age')); // true
console.log(myMap.size); // 2
myMap.delete('age');
console.log(myMap.size); // 1
Generator
Generator(生成器)是 JavaScript 中的一种特殊类型的函数,它允许你暂停和恢复函数的执行
let tell = function* () {
console.log('1')
yield 'a'
console.log('2')
yield 'b'
console.log('3')
}
let it = tell()
it.next() //输出1
it.next() //输出2
it.next() //输出3
next传参第一个参数是没有意义的
{
//yield传参(第一个参数是没有意义的)
let tell = function* () {
console.log('1')
let res1 = yield
console.log('2', res1)
let res2 = yield
console.log('3', res2)
}
let it = tell()
it.next(10) //1
it.next(20) //2,20
it.next(30) //3,30
}
通过Symbol.iterator可使一个普通对象变成一个可迭代对象,从而可以使用let of迭代方法,然后进行输出
//需求 使用for...of输出对象属性值
let obj = {
name: 'zhangsan',
age: 29,
address: 'tianjin'
}
obj[Symbol.iterator] = function* () {
yield obj.name
yield obj.age
yield obj.address
}
for (let i of obj) {
console.log(i)
}
promise
Promise 是异步编程的一种解决方案, 它的构造 函数 是 同步 执行的,then 方法是 异步 执行的,所以Promise创建后里面的函数会立即执行, 构造函数 中的resolve和reject只有第一次执行有效,,也就是说 Promise状态一旦改变就不能再变 promise主要是用来解决 回调地狱 的问题,通过使用.then来使得代码成链式调用,方便维护和使用。
promise的三种状态:
一个 Promise 对象可以处于以下三种状态之一:
- Pending(等待中):初始状态,既不是成功也不是失败。
- Fulfilled(已成功):表示异步操作成功完成。
- Rejected(已失败):表示异步操作失败。
一旦 Promise 的状态从 "pending" 变为 "fulfilled" 或 "rejected",它的状态就不可再改变,这种特性被称为不可变性(Immutability)。
let promise = new Promise((resolve, reject) => {
console.log('chengnou')
setTimeout(() => {
// resolve('zaiyiqi')
reject('fensuo')
}, 2000);
})
promise.then(res => {
console.log('res', res)
}, err => {
console.log('err', err)
})
promise的一些方法:
all([p1, p2, p3]) 等待多个请求完成后触发then,有一个失败,则catch
race([p1, p2, p3]) 哪个先完成就先完成哪个
allSettled([p1, p2, p3]) 不管这些请求是否会成功,都会执行then方法
any([p1, p2, p3]) 只要有一个先完成执行then,等所有都失败再catch,一个对就对,全错才错
let p1 = new Promise((resolve, reject) => {
setTimeout(resolve, 1000, 'p1')
})
let p2 = new Promise((resolve, reject) => {
setTimeout(reject, 3000, 'p2')
})
let p3 = new Promise((resolve, reject) => {
setTimeout(resolve, 2000, 'p3')
})
Promise.all([p1, p2, p3]).then(res => {
console.log('success', res) //返回p1
}).catch(err => {
console.log('err', err)//err AggregateError: All promises were rejected
})
module
ES6 中的模块(module)机制是一个现代化的 JavaScript 模块系统,用于更好地组织和管理代码。它的特点是基于 文件级模块作用域,并使用export和import关键字来定义和使用模块
模块的核心特点
- 文件级作用域: 每个模块都有独立的作用域,模块中的变量和函数默认是私有的,除非显式导出。
- 严格模式: ES6 模块默认启用严格模式,不需要手动添加"use strict"。
- 静态分析: ES6 模块在编译时就会确定模块依赖关系,不像 CommonJS 那样在运行时加载。这种特性使得编译器和工具可以进行更好的优化。
- 单例模式: 同一模块无论被引入多少次,始终只加载一次,并且会缓存结果。
导出模块:
**命名导出和默认导出的最大区别就是命名导出可以导出多次,但是默认导出只能导出一次 **
1.命名导出:
export const pi = 3.14159;
export function add(a, b) {
return a + b;
}
2.默认导出:
export default function log(message) {
console.log(message);
}
导入模块:
1.命名导入:
import { pi, add, Calculator } from './math.js';
//也可以重命名导入成员
import { add as sum } from './math.js';
2.默认导入:
import log from './logger.js';
3.混合导入:
import log, { pi } from './math.js';
4.导入模块当中的所有内容:
import * as math from './math.js';
ES6中新增的一些其他方法
填充字符串的方法:
1.头部进行填充:
let str = 'addsfsaf'
//str.padstart(目标长度,[,填充字符串])
let s = str.padStart(10)
let s1 = str.padStart(10, '2')
console.log(s1) //22addsfsaf
2.尾部进行填充:
let str = 'addsfsaf'
//str.padstart(目标长度,[,填充字符串])
let s = str.padEnd(10)
let s1 = str.padEnd(10, '2')
console.log(s1) //addsfsaf22
3.适用场景:
//使用场景
console.log('111'.padStart(6, '0'))//000111
console.log('12-12-12'.padStart(10, '0000-00-00'))
对象新增的方法:
let obj = {
name: '11',
age: 22
}
//遍历值
console.log(Object.values(obj))
//遍历键值对
console.log(Object.entries(obj))
//遍历键
console.log(Object.keys(obj))
//将对象转换成map
let map = new Map(Object.entries(obj))
console.log(map)
字符串收尾去空格:
let s = ' 1324325 4324 4532 '
console.log(s.trim()) //'1324325 4324 4532'
console.log(s.trimStart()) //'1324325 4324 4532 '
console.log(s.trimEnd()) //' 1324325 4324 4532'
替换字符串:
1.替换所有的 a字符
//替换所有a字符
let s = "aflsdjflsefel"
console.log(s.replaceAll('s', 'a'))
**2.替换a字符当中的第一个a字符 **
//替换第一个
let s = "aflsdjflsefel"
console.log(s.replace('s', 'a'))
3.正则替换所有字符
//正则替换所有
let s = "aflsdjflsefel"
console.log(s.replace(/s/g, 'a'))
通过下标查找数组:
let arr = [12, 3, 3, 2, 56, 5]
//正数 与之前数组访问下标相同
//负数 从后往前进行查找
console.log(arr.at(1))
console.log(arr.at(-1))//5
版权归原作者 心.c 所有, 如有侵权,请联系我们删除。