本文是自己所学的ES7的一些常用的新特性:

一、padStart()方法,padEnd()方法:

如果某个字符串不够指定长度,有两个方法可以在头部或尾部补全。padStart()用于头部补全,padEnd()用于尾部补全。

'x'.padStart(5, 'ab') // 'ababx'
'x'.padStart(4, 'ab') // 'abax'
'x'.padEnd(5, 'ab') // 'xabab'
'x'.padEnd(4, 'ab') // 'xaba'
padStart()和padStart()一共接受两个参数,第一个参数用来指定字符串的最小长度,第二个参数是用来补全的字符串。
如果原字符串的长度,等于或大于指定的最小长度,则返回原字符串。
二、Array.prototype.includes()方法
includes()的作用,是查找一个值在不在数组里,若在,则返回true,反之返回false。 基本用法:
['a', 'b', 'c'].includes('a')     // true
['a', 'b', 'c'].includes('d')     // false
Array.prototype.includes()方法接收两个参数:要搜索的值和搜索的开始索引。当第二个参数被传入时,该方法会从索引处开始往后搜索(默认索引值为0)。若搜索值在数组中存在则返回true,否则返回false。
 
['a', 'b', 'c', 'd'].includes('b')         // true
['a', 'b', 'c', 'd'].includes('b', 1)      // true
['a', 'b', 'c', 'd'].includes('b', 2)      // false
 
ES6里数组的另一个方法indexOf,下面的示例代码是等效的:
['a', 'b', 'c'].includes('a')          //true
['a', 'b', 'c'].indexOf('a') > -1      //true
 
indexOf返回的是某个元素在数组中的下标值,若想判断某个元素是否在数组里,我们还需要做额外的处理,即判断该返回值是否>-1。而includes则不用,它直接返回的便是Boolean型的结果。
两者使用的都是 === 操作符来做值的比较。但是includes()方法有一点不同,两个NaN被认为是相等的,即使在NaN === NaN结果是false的情况下。这一点和indexOf()的行为不同,indexOf()严格使用===判断
let demo = [1, NaN, 2, 3]
 
demo.indexOf(NaN) //-1
demo.includes(NaN) //true
 
上述代码中,indexOf()方法返回-1,即使NaN存在于数组中,而includes()则返回了true。
上述代码中,indexOf()方法返回-1,即使NaN存在于数组中,而includes()则返回了true。
 
提示:由于它对NaN的处理方式与indexOf不同,假如你只想知道某个值是否在数组中而并不关心它的索引位置,建议使用includes()。如果你想获取一个值在数组中的位置,那么你只能使用indexOf方法。
includes()还有一个怪异的点需要指出,在判断 +0 与 -0 时,被认为是相同的。
[1, +0, 4, 5].includes(-0) //true
[1, +0, 4, 5].indexOf(-0) //1
在这一点上,indexOf()与includes()的处理结果是一样的,前者同样会返回 +0 的索引值。
注意:在这里,需要注意一点,includes()只能判断简单类型的数据,对于复杂类型的数据,比如对象类型的数组,二维数组,这些,是无法判断的。

三、求幂运算符(**)

基本用法
3 ** 2 // 9
同:
Math.pow(3, 2) // 9
let a = 2
2 **= 2
// 4
 

ES7的更多相关文章

  1. gulp es7配置文件

    http://sanwen.net/a/ybsfcoo.html /** * Created by udi on 2016/11/24. */ var gulp = require('gulp'); ...

  2. 细说ES7 JavaScript Decorators

    开篇概述 在上篇的ES7之Decorators实现AOP示例中,我们预先体验了ES7的Decorators,虽然它只是一个简单的日志AOP拦截Demo.但它也足以让我们体会到ES7 Decorator ...

  3. ES7之Decorators实现AOP示例

    在上篇博文CoffeeScript实现Python装潢器中,笔者利用CoffeeScript支持的高阶函数,以及方法调用可省略括符的特性,实现了一个类似Python装潢器的日志Demo.这只是一种伪实 ...

  4. Object.observe将不加入到ES7

    先请看 Object.observe 的 API Object.observe(obj, callback[, acceptList]) 它用来监听对象的变化,当给该对象添加属性,修改属性时都会被依次 ...

  5. 关于ES3、ES5、ES6以及ES7所有数组的方法(api)的总结

    起因:工作用经常用到操作数组的方法,这里进行一下总结,我尽量以简洁的语言概括每个方法(api)的作用.如果您想快速定位,可以Control+F 然后搜相应的方法即可定位 :) ES3的数组方法 joi ...

  6. React和ES6(二)ES6的类和ES7的property initializer

    React与ES6系列: React与ES6(一)开篇介绍 React和ES6(二)ES6的类和ES7的property initializer React与ES6(三)ES6类和方法绑定 React ...

  7. JavaScript ES7 中使用 async/await 解决回调函数嵌套问题

    原文链接:http://aisk.me/using-async-await-to-avoid-callback-hell/ JavaScript 中最蛋疼的事情莫过于回调函数嵌套问题.以往在浏览器中, ...

  8. [ES7] Object.observe + Microtasks

    ES6: If you know about the Javascirpt's event loop. You know that any asyns opreations will be throw ...

  9. async的异步使用es7

    关于异步的问题,一直很受关注,es7中的async...await也是针对异步问题的. 需求:我想使用promise,和async这两种方法,在一定时间之后输出一个'hellow world' 使用p ...

  10. 10分钟学会ES7+ES8

    撰文为何 身为一个前端开发者,ECMAScript(以下简称ES)早已广泛应用在我们的工作当中.了解ECMA机构流程的人应该知道,标准委员会会在每年的6月份正式发布一次规范的修订,而这次的发布也将作为 ...

随机推荐

  1. 第26章 联合注销 - Identity Server 4 中文文档(v1.0.0)

    联合注销是指用户使用外部身份提供程序登录IdentityServer,然后用户通过IdentityServer未知的工作流程注销该外部身份提供程序的情况.当用户注销时,对IdentityServer进 ...

  2. JavaScript用法

    JavaScript 用法 JavaScript 语句,会在页面加载时执行. <body> 中的 JavaScript <!DOCTYPE html> <html> ...

  3. win10下rdlc报表在vs(visual studio)中中文显示小方块的批量处理解决方法

    在网上找vs中rdlc报表显示中文时显示小方块的解决方案,无外就是修改文本框的字体属性.但是对于维护已有的rdlc报表时,有中文的地方(此时都显示了小方块)会很多,再一个一个设置实在太麻烦.所以自己花 ...

  4. Oracle day05 建表_约束

    表的创建 标准的建表语法 : CREATE TABLE [schema.] table (column datatype [DEFAULT expr], ... ); 使用子查询创建表的语法 CREA ...

  5. 学JAVA第八天,今天用循环做了个好玩的东西

    今天用for循环做了个打印矩形的图案 代码如下: package nf;class Kest{ public static void main(String args[]){ int a=30; in ...

  6. 折腾Java设计模式之解释器模

    解释器模式 解释器模式是类的行为模式.给定一个语言之后,解释器模式可以定义出其文法的一种表示,并同时提供一个解释器.客户端可以使用这个解释器来解释这个语言中的句子. 意图 给定一个语言,定义它的文法表 ...

  7. Js与jQuery的相互转换

    $()与jQuery() jQuery中$函数,根据传入参数的不同,进行不同的调用,实现不同的功能.返回的是jQuery对象 jQuery这个js库,除了$之外,还提供了另外一个函数:jQuery j ...

  8. 【代码笔记】Web-CSS-CSS Border(边框)

    一,效果图. 二,代码. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...

  9. TCP客户端

    TCP通信客户端-解决数据包接收不全的过程 背景:5个串口条码枪,通过MOXA Nport系列转换器,以TCPServer的形式推送扫描到的条码到客户端.5个条码枪均位于流水线上方的支架上,流水线货物 ...

  10. 集成Android人脸识别demo分享

    本应用来源于虹软人工智能开放平台,人脸识别技术工程如何使用? 1.下载代码 git clone https://github.com/andyxm/ArcFaceDemo.git 2.下载虹软人脸识别 ...