zoukankan      html  css  js  c++  java
  • ES 2016+

    ES2016(ES7)新增:

    Array.prototype.includes

    Exponentiation Operator 求冥运算

    ES2017 (ES8)新增:

    ECMAScript® 2017 Language Specification (ECMA-262, 8th edition, June 2017)任意门

    1、TypeArray:

    一个TypedArray 对象描述一个底层的二进制数据缓存区的一个类似数组(array-like)视图。事实上,没有名为 TypedArray的全局对象,也没有一个名为的 TypedArray构造函数。相反,有许多不同的全局对象,下面会列出这些针对特定元素类型的类型化数组的构造函数。

    语法:

    1 new TypedArray(length); 
    2 new TypedArray(typedArray); 
    3 new TypedArray(object); 
    4 new TypedArray(buffer [, byteOffset [, length]]); 
    Int8Array(); 
    Uint8Array(); 
    Uint8ClampedArray();
    Int16Array(); 
    Uint16Array();
    Int32Array(); 
    Uint32Array(); 
    Float32Array(); 
    Float64Array();

    2、字符串填充 String.padStart 、String.padEnd

      语法:str.padStart(targetLength [, padString])  返回值:填充后形成的新字符串

      targetLength 当前字符串需要填充到的目标长度。如果它小于当前字符串的长度,则返回当前字符串本身。

      padString 要填充的字符串,如果长度超过了 targetLength 则,只保留左侧部分,其他部分被阶段。缺省值,为 " "

      示例:

    'abc'.padStart(10); // "       abc"
    'abc'.padStart(10, 'foo'); // "foofoofabc"
    'abc'.padStart(4, '12345'); // "1abc"
    'abc'.padStart(1); // "abc"

      兼容性支持:

      String.prototype.padStart()

    if (!String.prototype.padStart) {
        String.prototype.padStart = function padStart(targetLength,padString) {
            targetLength = targetLength>>0; //floor if number or convert non-number to 0;
            padString = String(padString || ' ');
            if (this.length > targetLength) {
                return String(this);
            }
            else {
                targetLength = targetLength-this.length;
                if (targetLength > padString.length) {
                    padString += padString.repeat(targetLength/padString.length); //append to original to ensure we are longer than needed
                }
                return padString.slice(0,targetLength) + String(this);
            }
        };
    }

       str.padEnd 与 str.padStart 用法相同,只是 padEnd 是在当前字符串后面添加内容。

      兼容性支持:

     1 if (!String.prototype.padEnd) {
     2     String.prototype.padEnd = function padEnd(targetLength,padString) {
     3         targetLength = targetLength>>0; //floor if number or convert non-number to 0;
     4         padString = String(padString || ' ');
     5         if (this.length > targetLength) {
     6             return String(this);
     7         }
     8         else {
     9             targetLength = targetLength-this.length;
    10             if (targetLength > padString.length) {
    11                 padString += padString.repeat(targetLength/padString.length); //append to original to ensure we are longer than needed
    12             }
    13             return String(this) + padString.slice(0,targetLength);
    14         }
    15     };
    16 }

      作用:

    • 以等宽字体显示平整的数据。
    • 在文件名或URL中添加计数或ID:’001.txt’。
    • 对齐控制台输出: ‘Test 001: ’。
    • 打印具有固定位数的十六进制或二进制数字:’0x00FF’

     3、async 和 await 目前还是实验性质的方法,实战项目中慎用哦~

      AsyncFunction 构造函数。用来创建新的 异步函数 对象

        语法:new Asyncfunction( [arg1 [, arg2 [, ... argN] ] ,] fucntionBody )

        argN: 函数的参数名

        functionBody: 字符串格式的函数体

      async function 关键字。用来在表达式中定义异步函数

        语法:async function [name] (param1 [ param1 [, param1 [, ..., paramM] ] ] ) { statements }

        name: 此异步函数的名称,可以是匿名函数,该名称仅可在本函数中使用。

        paramN: 传入函数的参数的名称。

        statements: 函数体

      await 操作符。用来等待一个 Promise 对象。它只能在异步函数 async function 中使用。

        表达式: 一个 Promise 对象,或者任何要等待的值。 [return_value] = await expression;

        返回值:返回 Promise 对象的处理结果。如果等待的不是 Promise 对象,则返回该值本身。

     1 function resolveAfter2Seconds(x) {
     2   return new Promise(resolve => {
     3     setTimeout(() => {
     4       resolve(x);
     5     }, 2000);
     6   });
     7 }
     8 
     9 // 构造函数的方式
    10 var a = new AsyncFunction('a', 'b', 'return await resolveAfter2Seconds(a) + await resolveAfter2Seconds(b);';
    11 
    12 a(10,20).then( v => {
    13     console.log(v); // 4 秒后打印 30
    14 });
    15 
    16 //async 关键字的方式
    17 var add1 = async function(x) {
    18     var a = await resolveAfter2Seconds(20);
    19     var b= await resolveAfter2Seconds(30);
    20     return x + a + b;
    21 }
    22 add1(10).then( v => {
    23      console.log(v); // 4 秒后打印 60
    24 });
    25 // 注意 ⚠️ await 位置不同的差异
    26 (async function(x) { 
    27   var p_a = resolveAfter2Seconds(20);
    28   var p_b = resolveAfter2Seconds(30);
    29   return x + await p_a + await p_b;
    30 })(10).then(v => {
    31   console.log(v);  // 2 秒后打印 60
    32 });

    4、获得对象上自身某属性的描述符:Object.getPropertyDescriptor() 。它解决了 Object.assign() 无法正确拷贝 get 和 set 属性的问题

      语法: Object.getpropertyDescriptor(obj, prop)

      obj: 要查找的目标对象

      prop:要查找的目标对象的属性

      返回值:若存在该属性,则返回其属性描述,否则返回 undefined

     1 var o, d;
     2 
     3 o = { get foo() { return 17; } };
     4 d = Object.getOwnPropertyDescriptor(o, "foo");
     5 
     6 //结果
     7 // d {
     8 //   configurable: true, // 指定对象的属性描述可以被改变或者属性可以被删除时,为 true
     9 //   enumerable: true, // 该属性可以被枚举时为 true
    10 //   get: /*the getter function*/, // 该属性的访问器函数
    11 //   set: undefined    // 该属性的设置器函数
    12 // }
    13 
    14 o = { bar: 42 };
    15 d = Object.getOwnPropertyDescriptor(o, "bar");
    16 // d {
    17 //   configurable: true,
    18 //   enumerable: true,
    19 //   value: 42, // 该属性的值
    20 //   writable: true //该属性值可被修改时为 true
    21 // }
    22 
    23 o = {};
    24 //定义属性描述的方法用 defineProperty
    25 Object.defineProperty(o, "baz", {
    26   value: 8675309,
    27   writable: false,
    28   enumerable: false
    29 });

    ES2018 (ES9)新增:

     1、Regular 正则表达式命名捕获组 ?<name>

     1 const
     2   reDate = /([0-9]{4})-([0-9]{2})-([0-9]{2})/,
     3   match  = reDate.exec('2018-04-30'),
     4   year   = match[1], // 2018
     5   month  = match[2], // 04
     6   day    = match[3]; // 30
     7 
     8 const
     9   reDate = /(?<year>[0-9]{4})-(?<month>[0-9]{2})-(?<day>[0-9]{2})/,
    10   match  = reDate.exec('2018-04-30'),
    11   year   = match.groups.year,  // 2018
    12   month  = match.groups.month, // 04
    13   day    = match.groups.day;   // 30
    const
      reDate = /(?<year>[0-9]{4})-(?<month>[0-9]{2})-(?<day>[0-9]{2})/,
      d      = '2018-04-30',
      usDate = d.replace(reDate, '$<month>-$<day>-$<year>');

    2、反向肯定查找  (?<=X)Y 匹配的是 Y,但是Y前面必须有X

     反向否定查找 (?<!X)Y 匹配的是Y,但是Y的前面不能有X

     正向肯定查找 X(?=Y) 匹配的是X,但是 X的后面必须有Y

       正向否定查找 X(?!Y) 匹配的是X,但是 X的后面不能跟Y

    // 反向肯定查找
    const reg1 = /(?<=a)b/;
    reg1.exec('ab')[0]; // b
    reg1.exec('abc')[0]; // b
    reg1.exec('cb'); // null
    // 反向否定查找
    const reg2 = /(?<!a)b/;
    reg2.exec('ab'); //null
    reg2.exec('cb')[0]; // b
    reg2.exec('cdb')[0]; // b
    // 正向肯定查找
    const reg3 = /a(?=b)/;
    reg3.exec('ab')[0]; //a
    reg3.exec('abc')[0]; //a
    reg3.exec('ac'); //null
    // 正向否定查找
    const reg4 = /a(?!b)/
    reg4.exec('ab'); //null
    reg4.exec('ac'); //a
    reg4.exec('acd'); //a

    3、正则表达式标志 s 。允许 . 匹配换行符

      原本 . 小数点是匹配除换行符以外的任何字符,使用 s 后 . 也可以匹配换行符

    /abc.abc/.test('abc
    abc'); // false
    /abc.abc/s.test('abc
    abc'); //true

    有空继续更...

  • 相关阅读:
    Multidimensional Arrays
    TortoiseGit
    Excel教程(14)
    Excel教程(13)
    Excel教程(12)
    Excel教程(11)
    lock
    reflect
    game
    html x
  • 原文地址:https://www.cnblogs.com/z-one/p/9015465.html
Copyright © 2011-2022 走看看