是该复习一下ES6了 -- 拓展用法篇

前言

以前对于ES6的相关声明类关键字进行了必定的说明，本片咱们未来学习一下ES6为JS新增的全局对象的方法内容，核对原有数据类型的新增特性吧。

正文

1.String

字符串是咱们经常会使用的数据类型，做为五大基础数据类型之一，在ES5的时代，咱们并不能经过String很好的处理咱们的unicode字符编码的问题，因此如今ES6增强了对unicode的支持，咱们来具体的看一下吧：

字符串对于unicode的支持：

• 如今咱们能够直接在代码之中经过 \u开头的4位六进制数据来表示一个16位的unicode字符 内容。
• 咱们知道unicode就算用16位表示一个字符可是仍是有的时候表示不彻底，中文经常一个16进制数彻底不够用啊，全部超出最高上限\uFFFF是常有的事情，这是后咱们要怎么办呢，首先咱们能够经过使用大括号将数据内容部分括起来，在最前方添加\u来表示当前位unicode码。例如 \u20BB7。
• 或者，咱们使用两个unicode字符进行表示，例如 \uD842\uDFB7。上面两个例子表示的都是同一个中文字。‘
• 这里我不得不提一下RegExp对象了，由于支持了String之中的unicode码的编写，因此正则之中也提供了相关的匹配修饰符，以防当前正则表达式匹配unicode出错，这个修饰符就是u，写在正则的最末端。添加以后相关的比对方法也将会有修改。具体的咱们将会后面进行介绍。
• 由于须要支持unicode因此当咱们将字符与unicode码比对的时候的状况须要考虑进来，字符与对应的unicode码作比较的话，会获得正确的结果，哪怕使用全等符号比较。例如：'中' === '\u4e2d' // true
• JSON.stringify也对与字符串的操做有必定的适配，UTF-8的标准0xD800到0xDFFF之间的码点是不能够单独使用的，ES2019之中将JSON.Stringify()进行了修改，会将这一段的unicode码自动的转义，交由应用本身处理。

字符串模板:

• ES6为咱们新增字符串模板的概念，咱们经过 ` ... ` 的形式来进行编写的，其中能够经过${}来添加相关的表达式和变量内容。方便了咱们的程序之中的字符串拼接工做。
• 标签模板，模板字符串能够直接写在一个函数名称以后，不须要加下括号，这样就至关于模板字符串作拆分而后将参数依次序的填装入函数内容。田庄参数的形式是，字符串未被表达式打断的部分，做为字符串数组，传递给第一个参数，以后的每个表达式计算的值，依次单独传递给后面的参数内容。
• 最后咱们说一下模板字符串的限制，再字符串模板之中咱们是能够包含其余语言的相关逻辑的，可是有些状况下会将相关字符转义，致使相关的逻辑失效的状况，因此咱们再编写逻辑代码的时候须要注意一下，转义字符的使用。

字符串的新增方法：

• String.fromCodePoint(Number-16) 传递unicode编码，识别相关的字符内容。其有点相似于fromCharCode这一个方法的做用，可是相对的其能够识别超出了0xFFFF的编码内容。忘记说了，传递的值是16位进制数。并且新方法能够传递多个数值，最后获取的数值是，多个数值之和所对应的值。
• String.raw(String) 这一方法能够用于标签模板的使用，传递模板字符串，返回一个将斜杠所有转义的字符串内容，或者用于普通方法，传递一个含有raw属性的对象做为第一个参数，其余任意的单个数据内容做为以后的参数。其将会自动的将第二个参数开始的数据转化为字符串，按照间隔一个字符穿插一个参数的方式，将后面传递的参数插入到第一个参数对象的raw属性的字符串之中。
• 实例方法：codePointAt(Number-16)对于老版本charCodeAt方法的衍生，能够处理大于0xFFFF的unicode编码的字符。
• 实例方法：normalize(type)在许多欧洲语言之中，咱们能够看到音调的存在，这些字符能够经过一个字符直接表示，也能够经过两个字符相结合的表示方式，可是虽然表示的内容是相同的，可是字符串展现的内容是不相同的，而且判断时将会不成功。这个时候咱们能够经过这一方法来转义当前字符串进行判断。这就是这个方法的意义。固然这一方法也能够设置相关的类型内容，详细的能够参考官方文档。
• 实例方法：repeat(Number) 将字符串重复传入整型数据大小遍，生成新的字符，传入的数据若是时浮点型，也只会取整数部分，传递复数，返回空字符串。传递非数据类型参数，返回空字符串。
• 实例方法：padStart(Number, String) 传递字符串长度和用于补全的字符串，直接上代码：

'x'.padStart(5, 'ab') // 'ababx'
    'x'.padStart(4, 'ab') // 'abax' 
复制代码

• 实例方法：padEnd(Number, String)和上面的方法相似，只是补全的位置再原有字符串的后面：

'x'.padEnd(5, 'ab') // 'xabab'
    'x'.padEnd(4, 'ab') // 'xaba'
复制代码

---

2. RegExp 正则表达式

正则表达式的扩展主要是正对unicode的支持和一点点修饰符还有方法的扩展。上面字符串内容咱们已经有提到过的u修饰符内容就是了，我么来具体的看一下吧。

正则对于unicode的支持：

• u修饰符：主要用来处理大于0xFFFF的unicode字符的内容。当加了这一修饰符以后，全部的大于0xFFFF编码的字符都将会再正则以内视做一个字符来进行匹配（本来时一个16位字节码表示一个字符的）。点字符的任意字符匹配再双字节编码的单个字符匹配时也能够做用了。再者正则之中的带大括号的字符写法也将能够作匹配了。预约义符号对于双字节字符也将会长生匹配效果。
• RegExp.prototype.unicode：这一新增的属性，能够帮助咱们肯定当前的正则表达式是否添加了u修饰符。

正则表达式其余修饰符的扩展：

• y修饰符：粘连修饰符，匹配的时候，当匹配到第一个子字符串的以后，若是还须要匹配成功，须要下一个字符开始就能匹配成功，不然失败。固然咱们也有RegExp.prototype.sticky 属性帮咱们判别当前的额修饰符内容，上例子：

var s = 'aaa_aa_a';
    var r1 = /a+/g;
    var r2 = /a+/y;
    
    r1.exec(s) // ["aaa"]
    r2.exec(s) // ["aaa"]
    
    r1.exec(s) // ["aa"]
    r2.exec(s) // null
复制代码

• s修饰符：添加了这一修饰符以后，点匹配符能够匹配任意的字符了，因此咱们又称S修饰符时正则表达式的dotAll模式。

正则表达式的其余部份内容：

• 后行断言：新增后行匹配的功能，以前只能先行断言才会有效果。
• ES2018之中引入了/p{}和/P{}的匹配字符，容许正则表达式匹配符合unicode某种行为的字符。
• 具名组匹配：咱们以前经过小括号来将结果提取出来，可是咱们每每只能再exec方法以后经过结果数组来进行内容的获取，并且数据没有相关的名称，获取的时候还须要取比对相关的位置信息因此十分的麻烦，可是如今咱们能够再小括号之中添加?的形式为当前小括号之中的数据取一个名称，而后咱们能够经过结果对象.group.name的形式来获取相关的比对数据内容了。
• 正则表达式内部须要引用某一个具名组匹配的话，咱们能够经过\k方式来进行引用。
• 咱们如今想要获取字符串之中全部的匹配值，能够直接经过String.prototype.matchAll方法来获取。可是它返回的时一个遍历器，全部须要咱们本身遍历一遍。

---

3.Number

数值作的扩展主要时再一些认证 的方法之上还有数据表示上面的支持。其余的部分变化不大。

进制数据表示：

• 八进制数据能够经过前面加上0o或者0O来进行表示，且判断能够成功。
• 二进制数据能够经过数据前面加上0b或者0B来进行转换。

数据类型的拓展方法和属性：

• Number.isFinite():判断当前数据是否有穷。非数据类型一概返回false
• Number.isNaN():判断餐是是不是NaN。
• Number.parseInt() | Number.parseFloat():相关方法从全局改变到了Number对象上面。其余部分和原有方法相同。
• Number.isInteger(): 判断数值是否为整形。
• Number.EPSILON：新增一个极小数，了用于比较数据的时候来规避偏差。
• Number.isSafeInteger()：表示的是JS能表示的精确整数的范围。2的53次方到-2的53次方。不包含两个端点。
• Number.MAX_SAFE_INTEGER：表示可计算最大的整形数据
• Number.MIN_SAFE_INTEGER：表示可计算最小的整形数据

---

4.Function

正对与Function的扩展内容，主要是有许多的语法糖能够帮助咱们更为语义化的，便捷的编写当前的内容。

参数可写的优化：

• 添加了默认值的设置，能够在函数的参数以后添加赋值号，而且将值赋值给参数，这样这个值将会是默认值，当没有传递参数的状况下，默认值将会做为函数参数的值。代码:

function(a = 5, b){...}
复制代码

• 结构赋值能够用在函数的参数声明之中，这样咱们能够更为方便的 传递数据内容。例如

function(x, {y = 0}){...}
复制代码

• function的length属性会在参数有默认值的时候失真，有默认值的参数将会不算在length属性之中。
• 使用默认值得时候须要注意的是，在函数初始化的时候，有默认值的话，函数的参数会有一个单独的做用于内容，外部的参数将不会影响相关的数据内容。
• rest参数形式是函数的参数的另一种语法糖形式。经过...value来将传递的参数经过数组的方式防止在value之中。这样咱们就能够不限定当前的函数的形参数量，同时也方便咱们的获取。固然这样的写法只能放置在参数的最后，不然将会报错。例如：

function(x, y, ...rest){...}
复制代码

函数的其余拓展：

• 严格模式：ES6之中严格模式能够编写在函数之中，严格模式下，函数的参数是不能够设置默认值的，同时不能使用解构赋值，或者任何扩展运算符了，不然会报错。这样规定是有缘由的，由于JS是顺序执行解析，咱们发如今函数体之中写'use strict'字符串将会和参数以及函数体都要严格模式的形式相冲突。由于只有在确认参数了以后才能在函数体之中发现使用严格模式。为了防止前述三种语法糖致使严格模式下规定不能被遵照，因此直接不予使用。
• name属性：函数拥有name属性，返回该函数的函数名称。若是将匿名函数赋值给一个变量，那么在ES6之中函数名称将会是变量名。若是是Function构造出来的函数对象的话name属性将会是anonymous。
• 箭头函数：相信含多人已经用过了，只须要注意: 其中的this指针的指向就行了,它是定义时所在的对象，而不是使用时所在的对象。它不能做为构造函数，没有arguments属性，不可使用yield指令（这个将会在以后进行讲解）。
• 尾部调用优化：意思是若是在函数的尾部调用了函数，那么严格模式下，js自动转化当前函数调用栈，将要调用函数的调用帧直接替换当前调用函数的调用帧，而不是在当前函数以后再次启用一个新的调用帧，压入到调用栈。好处就在于节省内存空间。只有严格模式之下才能调用是由于，由于严格模式下arguments和caller两个变量的禁用，这两个变量会追踪函数的调用栈，若是这两个变量可使用的话，将会和调用帧替换有冲突。

---

4.数组的扩展

数组主要是对于方法的扩展和一个扩展运算符（...）的语法糖新增。让咱们来看看到底有什么：

• 扩展运算符( ... )：其实就是三个点，咱们在function的rest参数之中有看到过它，那个时候表示参数省略，而在其以后加数组变量的话，实际上就等因而将当前的数组进行了一个拆分操做。将数组元素打散。固然其本质是调用了Iterator来进行内容的遍历，并返回了数据
• Array.from():传递对象内容，把类数组对象和可遍历对象转化成为真正的数组内容。
• Array.of():将传递的参数组成一个数组。主要是弥补Array构造函数的缺陷。
• 实例方法：entries(), key(), values()这三个方法主要是用来数组的便利，key获取的是下标内容，values主要获取的是数值内容，entries返回的是由下标和数值组成的数组做为项的数组。
• 咱们这里主要讲一下主要的几个方法，还有部分方法想要了解的伙伴能够取官网看一看。

---

6.Object

对象的扩展直接影响着咱们程序编写时候的便捷和语义表达。ES6之中为咱们简化了许多对象的编写的方式。

• 咱们在声明关键字篇之中有提到了，ES6之中对象的变量能够经过[表达式]的形式来展现，变量名就是表达式的结果。
• 对象的每一个属性都有一个描述对象（descriptor）用来控制属性的行为，Object.getOwnPropertyDescriptor能够获取属性的描述符，属性表述符，通常对象属性有四个特性，值（value）,writable(是否可写)，enumerable(可枚举)，configurable（属性是否可配置）。若是是getter/setter方法的属性则有get，set和enumerable，configurable这四个属性。具体的操做和内容请见MDN，很详细咯。
• 扩展运算符：对象也是可使用三点运算符，能够获取全部的可遍历属性。

下面来看一些Object的拓展方法把：

• Object.is() 用于判断两个值是否彻底相等和 === 的行为基本一致，不一样的在于+0于-0的不相等，还有NaN和自己相等，这两点和全等不同。
• Object.assign() 合并对象，将原对象全部可枚举属性开被盗目标对象之中。若是目标对象参数传递的不是对象，将会先转化城对象而后再合并。若是首位参数传递了undefined和null将会出错，若是传递不在首位参数就不会报错。
• Object.getPrototypeOf() | Object.setPrototypeOf() 这两个方法主要是用于设置和获取对象的原型的对象的。
• Object.keys() | Object.values() | Object.entries() 这三个方法返回的是数组，分别返回对象的 可枚举属性的名称，可枚举属性的值，或者可枚举属性名称和值组成的数组做为项的数组。

结束

ES6中主要添加的相关的扩展，语法糖，以及部分新的操做符号，咱们就讲到这里了。部分概念只是说起，没有彻底讲明白，能够看一看官网文档，一首说明莫过于此。若是有错误的地方请帮忙指出，但愿共同成长，共同进步。拜拜。