ES6学习笔记

#Node.js

是运行在服务端的 JavaScript，它对 ES6 的支持度更高。Node 已经实现的 ES6 特性。

#webpack

webpack 是一个现代 JavaScript 应用程序的静态模块打包器 (module bundler) 。当 webpack 处理应用程序时，它会递归地构建一个依赖关系图 (dependency graph) ，其中包含应用程序需要的每个模块，然后将所有这些模块打包成一个或多个 bundle 。

webpack 主要有四个核心概念:

• 入口 (entry)：指示 webpack 应该使用哪个模块，来作为构建其内部依赖图的开始
• 输出 (output)：告诉 webpack 在哪里输出它创建的 bundles ，以及如何命名这些文件
• loader： 让 webpack 可以去处理那些非 JavaScript 文件( webpack 自身只理解 JavaScript )
• 插件 (plugins)：loader 被用于转换某些类型的模块，而插件则可以做更多的事情。包括打包优化、压缩、定义环境变量等等。使用一个插件也非常容易，只需要 require() ，然后添加到 plugins 数组中。

webpack 会从入口 main.js 文件进行构建，通过 loader 进行js转换，输出一个为 bundle.js 的文件，至此一整个过程就构建完成。

#let与const

let 声明的变量只在 let 命令所在的代码块内有效。(var 是在全局范围内有效；let 只能声明一次 var 可以声明多次；let 不存在变量提升，var 会变量提升；for 循环计数器很适合用 let)

const 声明一个只读的常量，一旦声明，常量的值就不能改变。意味着一旦声明必须初始化，否则会报错。

#es6解构赋值

解构赋值是对赋值运算符的扩展。他是一种针对数组或者对象进行模式匹配，然后对其中的变量进行赋值。在代码书写上简洁且易读，语义更加清晰明了，也方便了复杂对象中数据字段获取。

结构模型：

• 解构的源，解构赋值表达式的右边部分。
• 解构的目标，解构赋值表达式的左边部分。

数组模型的解构、对象模型的解构

#Symbol

        ES6 引入了一种新的原始数据类型 Symbol ，表示独一无二的值，最大的用法是用来定义对象的唯一属性名。Symbol 函数栈不能用 new 命令，因为 Symbol 是原始数据类型，不是对象。可以接受一个字符串作为参数，为新创建的 Symbol 提供描述，用来显示在控制台或者作为字符串的时候使用，便于区分。

let sy = Symbol("KK");
console.log(sy);   // Symbol(KK)
typeof(sy);        // "symbol"
 // 相同参数 Symbol() 返回的值不相等
let sy1 = Symbol("kk");
sy === sy1;       // false

使用场景：

        由于每一个 Symbol 的值都是不相等的，所以 Symbol 作为对象的属性名，可以保证属性不重名。

let sy = Symbol("key1");
 
// 写法1
let syObject = {};
syObject[sy] = "kk";
console.log(syObject);    // {Symbol(key1): "kk"}
 
// 写法2
let syObject = {
  [sy]: "kk"
};
console.log(syObject);    // {Symbol(key1): "kk"}
 
// 写法3
let syObject = {};
Object.defineProperty(syObject, sy, {value: "kk"});
console.log(syObject);   // {Symbol(key1): "kk"}

        Symbol 作为对象属性名时不能用.运算符，要用方括号。因为.运算符后面是字符串，所以取到的是字符串 sy 属性，而不是 Symbol 值 sy 属性。

let syObject = {};
syObject[sy] = "kk";
 
syObject[sy];  // "kk"
syObject.sy;   // undefined

        Symbol 值作为属性名时，该属性是公有属性不是私有属性，可以在类的外部访问。但是不会出现在 for...in 、 for...of 的循环中，也不会被 Object.keys() 、 Object.getOwnPropertyNames() 返回。如果要读取到一个对象的 Symbol 属性，可以通过 Object.getOwnPropertySymbols() 和 Reflect.ownKeys() 取到。 

let syObject = {};
syObject[sy] = "kk";
console.log(syObject);
 
for (let i in syObject) {
  console.log(i);
}    // 无输出
 
Object.keys(syObject);                     // []
Object.getOwnPropertySymbols(syObject);    // [Symbol(key1)]
Reflect.ownKeys(syObject);                 // [Symbol(key1)]

        定义常量

        Symbol.for() 类似单例模式，首先会在全局搜索被登记的 Symbol 中是否有该字符串参数作为名称的 Symbol 值，如果有即返回该 Symbol 值，若没有则新建并返回一个以该字符串参数为名称的 Symbol 值，并登记在全局环境中供搜索。

let yellow = Symbol("Yellow");
let yellow1 = Symbol.for("Yellow");
yellow === yellow1;      // false
 
let yellow2 = Symbol.for("Yellow");
yellow1 === yellow2;     // true

        Symbol.keyFor()返回一个已登记的 Symbol 类型值的 key ，用来检测该字符串参数作为名称的 Symbol 值是否已被登记。

let yellow1 = Symbol.for("Yellow");
Symbol.keyFor(yellow1);    // "Yellow"

#Map和Set

#Proxy (代理)与 Reflect(反射)

        Proxy 与 Reflect是 ES6 为了操作对象引入的 API 。

        Proxy 可以对目标对象的读取、函数调用等操作进行拦截，然后进行操作处理。它不直接操作对象，而是像代理模式，通过对象的代理对象进行操作，在进行这些操作时，可以添加一些需要的额外操作。Reflect 可以用于获取目标对象的行为，它与 Object 类似，但是更易读，为操作对象提供了一种更优雅的方式。它的方法与 Proxy 是对应的。

• Proxy 

        一个 Proxy 对象由两个部分组成： target 、 handler 。在通过 Proxy 构造函数生成实例对象时，需要提供这两个参数。 target 即目标对象， handler 是一个对象，声明了代理 target 的指定行为。

#字符串

新增判断字符串是否包含子串方法。

模板字符串：反引号``放模板字符串，模板字符串中的换行和空格都是会被保留的

标签模板：标签模板是一个函数的调用，其中调用的参数是模板字符串。

alert`Hello world!`;
// 等价于
alert('Hello world!');

字符串插入变量和表达式：变量名写在 ${} 中，${} 中可以放入 JavaScript 表达式。

#数值

二进制、八进制新写法

Number.EPSILON 属性表示 1 与大于 1 的最小浮点数之间的差。

安全整数：安全整数表示在 JavaScript 中能够精确表示的整数，安全整数的范围在 2 的 -53 次方到 2 的 53 次方之间（不包括两个端点），超过这个范围的整数无法精确表示。

最大安全整数：安全整数范围的上限，即 2 的 53 次方减 1 。

最小安全整数：安全整数范围的下限，即 2 的 53 次方减 1 的负数。

Number对象新方法：Number.isFinite()用于检查一个数值是否为有限的（ finite ），即不是 Infinity

从全局移植到Number的方法：Number.parseInt()，用于将给定字符串转化为指定进制的整数。逐步减少全局方法，用于全局变量的模块化。方法的行为没有发生改变。

Math对象的扩展：ES6 在 Math 对象上新增了 17 个数学相关的静态方法，这些方法只能在 Math 中调用。

//指数运算符
1 ** 2; // 1
// 右结合，从右至左计算
2 ** 2 ** 3; // 256
// **=
let exam = 2;
exam ** = 2; // 4
//等同于exam = exam*exam ;

#对象

        对象的属性和方法名可以简写，允许用表达式作为属性名，但是一定要将表达式放在方括号内。属性的简洁表示法和属性名表达式不能同时使用，否则会报错。

        对象的扩展运算符：(...）用于取出参数对象所有可遍历属性然后拷贝到当前对象。

let person = {name: "Amy", age: 15};
let someone = { ...person };
someone;  //{name: "Amy", age: 15}

        自定义的属性和拓展运算符对象里面属性的相同的时候：

                自定义的属性在拓展运算符后面，则拓展运算符对象内部同名的属性将被覆盖掉。

                自定义的属性在拓展运算度前面，则变成设置新对象默认属性值。

                拓展运算符后面是空对象、null或者undefined，没有任何效果也不会报错。

        对象的新方法：Object.assign(target, source_1, ···)用于将源对象的所有可枚举属性复制到目标对象中。如果目标对象和源对象有同名属性，或者多个源对象有同名属性，则后面的属性会覆盖前面的属性。如果该函数只有一个参数，当参数为对象时，直接返回该对象；当参数不是对象时，会先将参数转为对象然后返回。因为 null 和 undefined 不能转化为对象，所以会报错。

assign 的属性拷贝是浅拷贝

Object.is(value1,value2)用来比较两个值是否严格相等，与（===）基本类似。与（===）的区别:

//一是+0不等于-0
Object.is(+0,-0);  //false
+0 === -0  //true
//二是NaN等于本身
Object.is(NaN,NaN); //true
NaN === NaN  //false

#数组

数组创建：Array.of()，将参数中所有值作为元素形成数组。Array.from()，将类数组对象或可迭代对象转化为数组。

参数：Array.from(arrayLike[, mapFn[, thisArg]])

        arrayLike：想要转换的类数组对象或可迭代对象。    

        mapFn：可选，map 函数，用于对每个元素进行处理，放入数组的是处理后的元素。    

        thisArg：可选，用于指定 map 函数执行时的 this 对象。

类数组对象：一个类数组对象必须含有 length 属性，且元素属性名必须是数值或者可转换为数值的字符。