关于ES6扩展属性

ES6

  1. let和const

    1. let命令
    • 只在代码块作用域内有效
    • 不存在变量提升(不能在申明之前赋值)
    • 暂时性死区(在区域内不受外部变量影响)
    • 不允许重复申明(在相同代码块区域内)
2.    块级作用域
* let为es6新增了块级作用域 {let a = ...;}
* 函数可以在块级作用域申明,不受外界影响 if(...) { function(){}}
**注:**块级作用域处大括号不能省略。
3. const命令
* 立即初始化,不可改变。
* 类似let于的特性。
* 对于对象,const存储只保持地址不变,对象内属性可变,但是不可给对象重新赋值。**const a = []; a = ['1'];报错**
* Object.freeze方法冻结对象,使内容不可改变。
4. 全局对象
* let命令、const命令、class命令声明的全局变量,不属于全局对象的属性。
  1. 变量的解构赋值
    1. 数组解构

      • 写法 var [v1,v2,v3] = [1,2,3];
      • let const都支持解构赋值
      • 支持“模式匹配” var [a,[b]] = [1,[2]]
      • set结构支持 var [a,b] = new set([1,2])
    2. 默认值

      • 允许默认值 var a[b=2] = [];
      • 默认值生效:当赋值不严格等于undefined var a[b=1] = [null]; b//null
      • 默认值的惰性, var a[b=function(){}] = [1]; //方法不执行
      • 默认值可以引用解构赋值的其他变量,但该变量必须已经声明。var [x=2,y=x] = [1];
    3. 对象解构

      • var {foo,bar} = {foo:"aa",bar:"bb"};
      • 变量名与属性名不一致时 var {foo:l,bar:a} = {foo:"aa",bar:"bb"};
      • 对于let和const来说,变量不能重新声明,所以一旦赋值的变量以前声明过,就会报错。let foo; let{foo}={foo:1} //err

        ({foo}={foo:1}) //成功 大括号不能省略
      • 类似于数组可以依靠模式嵌套对象
      • 可以指定默认值
      • 两个神奇用法:let { log, sin, cos } = Math;

        var {0 : first, [arr.length - 1] : last} = arr;
    4. 字符串解构

      • const [a, b, c, d, e] = 'hello';
      • let {length : len} = 'hello'; len //5;
    5. 数值和布尔值得解构

      • let {toString: s} = 123;

        s === Number.prototype.toString // true
      • null和undefined无法转化成对象,会报错
    6. 函数参数解构

       function move({x, y} = { x: 0, y: 0 }) {
      return [x, y];
      }
      move({x: 3, y: 8}); // [3, 8]
      move({x: 3}); // [3, undefined]
      move({}); // [undefined, undefined]
      move(); // [0, 0]
    7. 圆括号问题

      • 不使用圆括号情况
        1. 变量声明语句中,不能带有圆括号。
        2. 函数参数中,模式不能带有圆括号。
        3. 赋值语句中,不能将整个模式,或嵌套模式中的一层,放在圆括号之中。
      • 使用圆括号情况

        赋值语句的非模式部分,可以使用圆括号。
    8. 用途

      • 交换变量的值
      • 从函数返回多个值
      • 函数参数的定义
      • 提取JSON数据
      • 函数参数的默认值
      • 遍历Map结构
      • 输入模块的指定方法
  2. 字符串的扩展
    1. 字符的Unicode表示法

      '\z' === 'z' // true

      '\172' === 'z' // true

      '\x7A' === 'z' // true

      '\u007A' === 'z' // true

      '\u{7A}' === 'z' // true
    2. codePointAt()

      codePointAt方法会正确返回32位的UTF-16字符的码点。
    3. String.fromCodePoint()

      识别32位码点。
    4. 字符串的遍历器接口

      for...of for(obj of map)
    5. at()
    6. normalize()
    7. includes(), startsWith(), endsWith()
    8. repeat()

      'hello'.repeat(2) // "hellohello"
    9. padStart(),padEnd()

      补全字符串长度
    10. 模板字符串

      ${name} 取变量值
    11. 实例:模板编译
    12. 标签模板
    13. tring.raw()
  3. 正则的扩展
    1. RegExp构造函数

      新增加写法:new RegExp(/abc/ig, 'i') 后面的参数会覆盖前面ig
    2. 字符串的正则方法
    3. u修饰符
      • 点子符 /^.$)/u.test('a') //true
      • 识别Unicode字符 /\u{61}/u.test('a') //true
      • 量词 /a{2}/.test('aa') //true
    4. y修饰符

      粘连匹配,即必须从下一个字符处开始匹配。
    5. sticky属性

      查看是否设置了y修饰符
    6. flags属性

      返回正则表达式修饰符
    7. RegExp.escape()

      转义生成正则模式
    8. 后行断言

      只匹配美元符号之后的数字,要写成/(?<=$)\d+/
  4. 数组的扩展
    1. Array.from()

      将对象转化为数组
    2. Array.of()

      将一组值转换为数组
    3. 数组实例的copyWithin()

      将指定位置的成员复制到其他位置 (target, start, end)
    4. 数组实例的find()和findIndex()

      //返回第一个找到的值的位置

      [1, 5, 10, 15].find(function(value, index, arr) {

      return value > 9;

      }) // 10
    5. 数组实例的fill()

      填充数组,可以接受第二个和第三个参数,用于指定填充的起始位置和结束位置。
    6. 数组实例的entries(),keys()和values()

      遍历map,keys()是对键名的遍历、values()是对键值的遍历,entries()是对键值对的遍历。
    7. 数组实例的includes()

      数组是否包含给定的值。
    8. 数组的空位

      var arr =new Array(3) //[,,]

      空位处理不一致尽量不使用
  5. 数值的扩展
    1. 二进制和八进制表示法

      二进制和八进制数值的新的写法,分别用前缀0b(或0B)和0o(或0O)表示。
    2. Number.isFinite(), Number.isNaN()

      Number.isFinite()用来检查一个数值是否为有限的(finite)。

      Number.isNaN()用来检查一个值是否为NaN。
    3. Number.parseInt(), Number.parseFloat()

      转换为整形和浮点型,成为Number的属性,减少全局性方法,是语言逐渐模块化。
    4. Number.isInteger()

      判断是否为整数。 注: Number.isInteger(3.0) //true
    5. Number.EPSILON
    6. 安全整数和Number.isSafeInteger()

      ES6引入了Number.MAX_SAFE_INTEGER和Number.MIN_SAFE_INTEGER这两个常量,用来表示这个范围的上下限,Number.isSafeInteger()是用来判断一个整数是否落在这个范围之内。
    7. Math对象的扩展

      新增了17个与数学相关的方法,详细链接Math扩展
    8. 指数运算符

      let a = 2;

      a **= 2; // 等同于 a = a * a;
  6. 函数的扩展
    1. 函数参数的默认值

      function log(x, y = 'World')

      可以与解构函数一起使用。

      函数的length属性,返回没有指定默认值的数量。

    2. rest参数

      rest参数(形式为“...变量名”),用于获取函数的多余参数

    3. 扩展运算符

      扩展运算符(spread)是三个点(...)。它好比rest参数的逆运算,将一 个数组转为用逗号分隔的参数序列。

    4. name属性

      函数的name属性,返回该函数的函数名。

    5. 箭头函数

      =>

      (1)函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象。

      (2)不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出一个错误。

      (3)不可以使用arguments对象,该对象在函数体内不存在。如果要用,可以用Rest参数代替。

      (4)不可以使用yield命令,因此箭头函数不能用作Generator函数。

    6. 函数绑定

      foo::bar;

      // 等同于

      bar.bind(foo);

      函数绑定运算符是并排的两个双冒号(::),双冒号左边是一个对象,右边是一个函数。该运算符会自动将左边的对象,作为上下文环境(即this对象),绑定到右边的函数上面。

    7. 尾调用优化

      即在return函数时,不需要对当前函数作用域的值进行保存或关联操作。

       function factorial(n, total) {
      if (n === 1) return total;
      return factorial(n - 1, n * total);
      }
      factorial(5, 1) // 120
      function factorial(n) {
      if (n === 1) return 1;
      return n * factorial(n - 1);
      }
      factorial(5) // 120
    8. 函数参数的尾逗号

      ES7有一个提案,允许函数的最后一个参数有尾逗号(trailing comma)。

      目前,函数定义和调用时,都不允许有参数的尾逗号。

  7. 对象的扩展
    1. 属性的简洁表示法

      var a={x} -> var a={a:a}

      var obj = {

      class () {}

      };

      // 等同于

      var obj = {

      'class': function() {}

      };

    2. 属性名表达式

      ES6允许字面量定义对象时,用方法二(表达式)作为对象的属性名,即把表达式放在方括号内。

    3. 方法的name属性

      函数的name属性,返回函数名。对象方法也是函数,因此也有name属性。

    4. Object.is()

      判断两个对象严格相等,与===不同之处在于:一是+0不等于-0,二是NaN等于自身。

    5. Object.assign()

      Object.assign方法用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target)。

    6. 属性的可枚举性

    7. 属性的遍历

      for...in

      Object.keys(obj)

      ...

    8. __proto__属性,Object.setPrototypeOf(),Object.getPrototypeOf()

      设置、返回原型对象

    9. Object.values(),Object.entries()

      返回属性值,返回键值对。

    10. 对象的扩展运算符

      Rest解构赋值

      扩展运算符

    11. Object.getOwnPropertyDescriptors()

      返回指定对象所有自身属性(非继承属性)的描述对象。

文章关于扩展方面的总结就到这里,ES6还增加了许多新的特性,详细了解访问: ES6入门

上一篇:CentOS 中PHP开启 GD功能


下一篇:在windows 7搭建xcode开发环境