【ES6】基础特性总结

概述

仅个人使用，复习ES6的笔记，比较粗糙，仅适用于浏览器端。

数据类型

ES6（ECMAScript 2015）引入了一些新的数据类型和对现有数据类型的扩展。以下是ES6中数据类型的一个简要总结表格：

变量和常量申明

console.log(x); //ReferenceError: Cannot access ‘x’ before initialization console.log(PI); let x = 10; // 申明变量 const PI = 3.14; // 申明常量

• let和const都不存在变量提升，也不会像var申明的变量变成全局变量或挂载到顶层对象window上。

解构赋值

变量解构赋值

let x = 10; let y = 10; let z = 10; 可以使用类似数组的形式，批量申明和赋值： let [x,y,z] = [10,20,30]; console.log(x,y,z); // 10 20 30

对象的解构赋值

let {name,sex,age} = {age:12,sex:“man”, name:“张三”}; console.log(sex)

• 和数组形式一样，let {} = {}并不是创建了一个对象，而是以对象的形式批量声明变量；
• let {name,sex,age}，定义了变量名称，{age:12,sex:"man", name:"张三"}则指定对应名称的变量的值
• 可以看到，相比数组形式的解构赋值，对象形式对赋值时的变量位置没有要求，只需要名称对应上即可。

函数参数解构赋值

首先是数组形式： function sum([x,y,z]){ return x + y + z; } console.log(sum([10,20,30])); // 60 然后是对象形式： function msg({name,sex,age}){ return 你好，${name}，你的性别是${sex},年龄是${age},对吗？; } console.log(msg({sex:“男”,age:12,name:“张三”})); //你好，张三，你的性别是男,年龄是12,对吗？

箭头函数

箭头函数可以理解为普通函数形式的简写形式。 let f = function(p){ return p; } 可以简写为： let f = p => p; 其中：

• =>之前的p是传入的参数，之后的p是返回的值； 再比如： let f = p => p * p; console.log(f(12)); // 144 就变成了f(p) = p * p的效果。 再比如： let sum = (a,b) => a+b; console.log(sum(12,14)); // 26 可以看到两个参数，使用了括号和参数列表形式。 没有参数时，则必须写上()： let say_hello = () => “hello!”; console.log(say_hello()); // hello! 当函数比较复杂时，可以用{}和多行函数体形式： 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参数，可以用于函数的不定项参数
• ...[数组]，此处的...叫做扩展运算符，可以将数组变为逗号分隔的多项形式 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参数 console.log(…[12,14,16]); // 12 14 16
• ...之后跟的是数组，则就是扩展运算符，其将数组元素拆分为单独的三个元素

Symbol

Symbol代表唯一值。 let s = Symbol(‘abc’); console.log(s); // Symbol(abc) console.log(typeof s); // symbol

• Symbol不是构造函数，不能使用new关键字，否则会有如下异常： TypeError:Symbol is not a constructor
• Symbol括号中内容代表Symbol描述，只是为了方便开发中辨识，并不是Symbol的值

Set和Map

• Map是字典，用于保存键值对 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中的一些常见属性和方法，它们提供了对唯一值集合的高效操作。

proxy和Reflect