概述
仅个人使用,复习ES6的笔记,比较粗糙,仅适用于浏览器端。
数据类型
ES6(ECMAScript 2015)引入了一些新的数据类型和对现有数据类型的扩展。以下是ES6中数据类型的一个简要总结表格:
数据类型 | 描述 |
---|---|
Number | 包括整数和浮点数,新增了Number.isInteger() 等方法。 |
String | 字符串类型,新增了模板字符串、字符串遍历器等特性。 |
Boolean | 布尔类型,没有新增。 |
Undefined | 表示变量已声明但未初始化,没有新增。 |
Null | 只有一个值null ,表示空值,没有新增。 |
Symbol | 新增的原始数据类型,用于创建唯一的不可变标识符。 |
Object | 包括普通对象和特殊对象(如Array、Function等),新增了Object.assign() 等方法。 |
Array | 数组对象,新增了Array.from() 、Array.of() 等静态方法。 |
Function | 函数对象,没有新增。 |
Map | 存储键值对的集合,键和值可以是任意值,支持迭代。 |
Set | 存储唯一值的集合,支持迭代。 |
WeakMap | 存储键值对的集合,键必须是对象,且垃圾回收机制可以忽略其值。 |
WeakSet | 存储唯一对象的集合,垃圾回收机制可以忽略其值。 |
Promise | 用于异步计算的对象,允许你为异步操作写同步代码。 |
Generator | 函数*(星号)表示的函数,可以创建迭代器。 |
ArrayBuffer | 二进制数据缓冲区,用于操作二进制数据。 |
TypedArray | 基于ArrayBuffer 的视图,包括Int8Array 、Uint8Array 等类型。 |
这个表格简要概述了ES6中的数据类型及其特点。ES6的引入极大地丰富了JavaScript的数据类型和功能,使得编程更加灵活和强大。
变量和常量申明
javascript
console.log(x); //ReferenceError: Cannot access 'x' before initialization
console.log(PI);
let x = 10; // 申明变量
const PI = 3.14; // 申明常量
let
和const
都不存在变量提升,也不会像var
申明的变量变成全局变量或挂载到顶层对象window
上。
解构赋值
变量解构赋值
javascript
let x = 10;
let y = 10;
let z = 10;
可以使用类似数组的形式,批量申明和赋值:
javascript
let [x,y,z] = [10,20,30];
console.log(x,y,z); // 10 20 30
对象的解构赋值
javascript
let {name,sex,age} = {age:12,sex:"man", name:"张三"};
console.log(sex)
- 和数组形式一样,
let {} = {}
并不是创建了一个对象,而是以对象的形式批量声明变量; let {name,sex,age}
,定义了变量名称,{age:12,sex:"man", name:"张三"}
则指定对应名称的变量的值- 可以看到,相比数组形式的解构赋值,对象形式对赋值时的变量位置没有要求,只需要名称对应上即可。
函数参数解构赋值
首先是数组形式:
javascript
function sum([x,y,z]){
return x + y + z;
}
console.log(sum([10,20,30])); // 60
然后是对象形式:
javascript
function msg({name,sex,age}){
return `你好,${name},你的性别是${sex},年龄是${age},对吗?`;
}
console.log(msg({sex:"男",age:12,name:"张三"})); //你好,张三,你的性别是男,年龄是12,对吗?
箭头函数
箭头函数可以理解为普通函数形式的简写形式。
javascript
let f = function(p){
return p;
}
可以简写为:
javascript
let f = p => p;
其中:
=>
之前的p
是传入的参数,之后的p
是返回的值;
再比如:
javascript
let f = p => p * p;
console.log(f(12)); // 144
就变成了f(p) = p * p
的效果。
再比如:
javascript
let sum = (a,b) => a+b;
console.log(sum(12,14)); // 26
可以看到两个参数,使用了括号和参数列表形式。
没有参数时,则必须写上()
:
javascript
let say_hello = () => "hello!";
console.log(say_hello()); // hello!
当函数比较复杂时,可以用{}
和多行函数体形式:
javascript
let max = (a,b) => {
if(a>b){
return a;
}else{
return b;
}
};
console.log(max(12,34)); // 34
console.log(max(120,34)); // 120
rest参数和扩展运算符
...名称
叫做rest参数,可以用于函数的不定项参数...[数组]
,此处的...
叫做扩展运算符,可以将数组变为逗号分隔的多项形式
javascript
function sum(...nums){
let n = 0;
for (let num of nums){
n += num;
}
return n;
}
console.log(sum(5,6,7,12,35)); // 65
...
之后跟变量名,并且用于函数参数,则是rest参数
javascript
console.log(...[12,14,16]); // 12 14 16
...
之后跟的是数组,则就是扩展运算符,其将数组元素拆分为单独的三个元素
Symbol
Symbol代表唯一值。
javascript
let s = Symbol('abc');
console.log(s); // Symbol(abc)
console.log(typeof s); // symbol
Symbol
不是构造函数,不能使用new
关键字,否则会有如下异常:
javascript
TypeError:Symbol is not a constructor
Symbol
括号中内容代表Symbol
描述,只是为了方便开发中辨识,并不是Symbol
的值
Set和Map
Map
是字典,用于保存键值对
javascript
let m = new Map();
m.set("name","张三");
console.log(m.get("name")); // 张三
以下是ES6中Map
对象的常见属性和方法的总结表格:
属性/方法名称 | 描述 |
---|---|
Map.prototype.constructor |
创建实例对象的构造函数,对于Map 实例,初始值为Map 构造函数。 |
Map.prototype.size |
返回Map 对象中的键值对数量。 |
Map.prototype[Symbol.toStringTag] |
返回字符串"Map" ,用于Object.prototype.toString() 方法。 |
方法名称 | 描述 |
---|---|
Map.prototype.clear() |
移除Map 对象中所有的键值对。 |
Map.prototype.delete(key) |
移除Map 对象中指定的键值对,如果键值对存在并成功被移除,返回true ,否则返回false 。 |
Map.prototype.entries() |
返回一个新的迭代器对象,包含Map 对象中所有键值对[key, value] 二元数组,以插入顺序排列。 |
Map.prototype.forEach(callbackFn, thisArg) |
以插入顺序为Map 对象中的每个键值对调用一次callbackFn 。如果提供了thisArg 参数,则它将作为每一次回调的this 值。 |
Map.prototype.get(key) |
返回与指定的键key 关联的值,若不存在关联的值,则返回undefined 。 |
Map.prototype.has(key) |
返回一个布尔值,用来表明Map 对象中是否存在与指定的键key 关联的值。 |
Map.prototype.keys() |
返回一个新的迭代器对象,包含Map 对象中所有元素的键,以插入顺序排列。 |
Map.prototype.set(key, value) |
在Map 对象中设置与指定的键key 关联的值,并返回Map 对象。 |
Map.prototype.values() |
返回一个新的迭代器对象,包含Map 对象中所有的值,并以插入Map 对象的顺序排列。 |
Map.prototype[Symbol.iterator]() |
返回一个新的迭代器对象,包含Map 对象中所有元素[key, value] 二元数组,以插入顺序排列。 |
这些是Map
对象在ES6中的一些常见属性和方法,它们提供了对键值对集合的高效操作。
Set
是集合,类似于去重数组
以下是ES6中Set
对象的常见属性和方法的总结表格:
属性/方法名称 | 描述 |
---|---|
Set.prototype.constructor |
创建实例对象的构造函数,对于Set 实例,初始值为Set 构造函数。 |
Set.prototype.size |
返回Set 对象中的元素数量。 |
Set.prototype[Symbol.toStringTag] |
返回字符串"Set" ,用于Object.prototype.toString() 方法。 |
方法名称 | 描述 |
---|---|
Set.prototype.add(value) |
向Set 对象中添加一个新的元素。 |
Set.prototype.clear() |
移除Set 对象中的所有元素。 |
Set.prototype.delete(value) |
移除Set 对象中的指定元素,如果元素存在并成功被移除,返回true ,否则返回false 。 |
Set.prototype.entries() |
返回一个新的迭代器对象,包含Set 对象中每个元素的[value, value] 二元数组,以插入顺序排列。 |
Set.prototype.forEach(callbackFn, thisArg) |
以插入顺序为Set 对象中的每个元素调用一次callbackFn 。如果提供了thisArg 参数,则它将作为每一次回调的this 值。 |
Set.prototype.has(value) |
返回一个布尔值,用来表明Set 对象中是否包含指定的值。 |
Set.prototype.keys() |
返回一个新的迭代器对象,包含Set 对象中所有元素的键,以插入顺序排列。由于Set 只有键,所以keys() 方法返回的迭代器和values() 方法相同。 |
Set.prototype.values() |
返回一个新的迭代器对象,包含Set 对象中所有的值,并以插入Set 对象的顺序排列。 |
Set.prototype[Symbol.iterator]() |
返回一个新的迭代器对象,包含Set 对象中所有元素[value, value] 二元数组,以插入顺序排列。 |
这些是Set
对象在ES6中的一些常见属性和方法,它们提供了对唯一值集合的高效操作。