• es6 学习笔记


      1、let、const

      let和const作用类似于var,区别是const声明的是一个制度的变量,一单声明之后,常量的值就不能变。

      比如:

        

      这样的话,a能正常输出,但是b会报错

      let和var的区别:

            

         

      因为,在var的场景中,if和for的声明的是全局变量,而在let的场景下,只会在声明的代码快里面有效

    2、str.repeat(n) 返回一个新的字符串, 将元字符串重复n次

         

    3、拼接字符串

      模版字符,拼接字符串使用${}来引用变量, 用`来标记起始, 所有的空格和缩进都会都会被保留下来,并输出。

        

    4、String.raw

      使用String.raw作为模版字符的前缀,则该模板是原始的,反斜线不再是特殊字符, 也不会被解释成换行符。

         

    5、Number

      Number.isFinite(): 用来检测一个数值是不是非无穷的

      Number.isNaN(): 用来检测一个字符是不是NaN

      Number.isInteger(): 用来检测一个数值是不是整数,

            但是这个方法的Number.isInteger(23)等价于Number.isInteger(23.0)

    6、Math

      Math.trunc(): 去除数值的小数部分,返回整数

      Math.sign(): 判断一个数是正数、负数还是零,

           返回值:整数:1,负数:-1,0:0,-0:-0,其他值:NaN

      Math.cbrt(): 计算一个值的立方根

      Math.fround():返回一个值的单精度浮点数,某个数的有效数字位数超过7位,超出的部分会自动四舍五入

      Math.hypot(): 返回所有参数的平方和的平方根  

      Math.expm1(x): ex - 1

      Math.log1p(x): 返回1 + x的自然对数,如果x小于-1, 返会NaN

      Math.log10(x): 返回以10为底的x的对数,如果x小于0,则返回NaN

      Math.log2(x):返回以2为底的x的对数。如果x小于0,则返回NaN

       Math.sinh(x): 返回x的双曲正弦

       Math.cosh(x): 返回x的双曲余弦

       Math.tanh(x): 返回x的双曲正切

       Math.asinh(x): 返回x的双曲asinh

       Math.acosh(3): 返回x的反双曲余弦

       Math.atanh(3): 返回x的反双曲正切

    7、Array.from 用于将类似数组的对象(array-like object)和可遍历(iterable)的对象(包括ES6新增的数据结构Set和Map)转为真正的数组

       

      其中,Array.from()将字符串转化成数组之后,返回字符串的长度。

      Array.from(string).length;

    8、Array,of() 将值转换成数组

       

    9、arr.find(callback()) 找出第一个符合条件的数组成员和位置,可以发现NaN

      它的参数是一个回调函数,所有数组成员依次执行该回调函数,回调函数接受三个参数,(当前的值、当前的位置和原数组)。直到找出第一个返回值为true的成员,然后返回该成员,找到了就不再继续往下查找了。如果没有符合条件的成员,则返回undefined,

       

    10、arr.findIndex(callback()) 找出第一个符合条件的数组成员的位置,如果都不符合,返回-1,可以发现NaN

       

    11、fill() 使用给定的值,填充一个数组

        

      除此之外,fill()接受第二个和第三个参数, 用于指定填充的起始位置

    12、entries() 、keys() 、 values()

      用于遍历数组,返回的是一个遍历器,可以使用for-of循环进行遍历。

      entire()是对键值对的遍历

      keys()是对键名的遍历

      values()是对键值的遍历

       

      

      待解决,不懂为什么values()的方法报错

    13、object

      (1) destructuring 解构

      我们平常的话,可以这样写对象

       

      使用es6的话,如下:

       

      也可以反过来,如下:

       

      (2) 属性名表达式

        在原本中,给对象赋值,可以使用标识符作为属性名,也可以使用表达式作为属性名(将表达式放在[]中),也可以痛多对向字面量,用标识符作为属性名。

        但是,在es6中,允许字面量定义对象的时候,用[]放置表达式作为属性名

          

      (3) Object.is() 用来比较两个值是否严格相等,与===相似,区别在于在===里,=0 === -0 是对的, NaN === NaN 是错的,但是在Object.is中,Object.is(+0, -0) 是错的, Object.is(NaN, NaN)是对的

      (4) Object.assign() 用来讲源对象(source)的所有可枚举的属性,复制到目标对象(target),他至少需要两个对象作为参数,第一个参数是target, 后面的参数都是source, 只要有其中一个参数不是对象,就会抛出TypeError

        

      注意:如果目标对象与源对象有同名属性,或多个源对象有同名属性,则后面的属性会覆盖前面的属性

        

      除此之外:

      Object.assign也可以用来处理数组,数组位置相同的地方将被覆盖

      

      可以用来为对象添加属性

      

      可以用来为对象添加方法

       

      克隆对象

      在JS里子类利用Object.getPrototypeOf去调用父类方法,用来获取对象的原型。用它可以模仿Java的super

      

    14、function

      (1) 使用默认参数

         

      (2) rest参数, 格式为(...变量名),也叫做不定参数,用于获取函数的多余参数,这样就不需要使用arguments对象了

        rest参数搭配的变量是一个数组,将该变量的多余参数放入数组中。

          

      (3) 扩展运算符, 是三个点(...), 它就好比是rest参数的你运算,讲一个数组转为用(,)分隔的参数序列,该运算符主要用于函数调用,它允许传递数组或者类数组直接作为函数的参数而不用通过apply

         

      (4) 箭头函数: =>

        

        

        箭头函数有几个使用注意点。
          1.函数体内的this对象,即绑定定义时所在的对象,而不是使用时所在的对象.并不是因为箭头函数内部有绑定this的机制,实际原因是箭头函数根本没有自己的this,它的this是继承外面的,因此内部的this就是外层代码块的this。
          2.不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出一个错误。
          3.不可以使用arguments对象,该对象在函数体内不存在。
          上面三点中,第一点尤其值得注意。this对象的指向是可变的,但是在箭头函数中,它是固定的。  

     15、Set: 数据结构Set类似于数组,但是成员的值都是唯一的,没有重复的值

      (1) 基本用法

        

      (2) 实例的属性

        Set.prototype.constructor: 构造函数,默认就是Set函数

        Set.prototype.size: 返回Set实例的成员总数

          

      (3) 实例的方法

        add(value): 添加某个值,返回Set结构本身

        delete(value): 删除某个值,返回一个布尔值,表示删除成功

        has(value): 返回一个布尔值,表示是否为Set的成员

        clear(): 清除所有成员,没有返回值

           

       (4) 遍历操作

        keys(): 返回一个键名的遍历器
        values(): 返回一个键值的遍历器
        entries(): 返回一个键值对的遍历器
        forEach(): 使用回调函数遍历每个成员

         由于Set结构没有键名,只有键值(或者说键名和键值是同一个值),所以key方法和value方法的行为完全一致。

           

    16、WeakSet: 和Set一样,不存储重复的值,但是WeakSet的成员只能是对象,不能是其他类型的值。

      方法:

        add(value)

        delete(value)

        has(value)

      因为WeakSet没有size的属性,没有办法遍历它的成员

    17、Map: 是一个“超对象”,其 key 除了可以是 String 类型之外,还可以为其他类型(如:对象)他的方法和 Set 差不多:

      (1)方法:

        size:返回成员总数,该方法返回的是Map本身,因此可以采用链式写法
        set(key, value):设置key所对应的键值,返回整个Map结构。如果key已经有值,则键值会被更新,否则就新生成该键。
        get(key):设置key所对应的键值,然后返回整个Map结构。如果key已经有值,则键值会被更新,否则就新生成该键。
        has(key):返回一个布尔值,表示某个键是否在Map数据结构中。
        delete(key):删除某个键,返回true。如果删除失败,返回false
        clear():清除所有成员,没有返回值。

      (2)遍历器

        keys():返回键名的遍历器。
        values():返回键值的遍历器。
        entries():返回所有成员的遍历器。

            

        如果没有使用rest参数的话,就使用for-of去遍历

    18、WeakMap: WeakMap结构与Map结构基本类似,唯一的区别是它只接受对象作为键名(null除外),不接受原始类型的值作为键名,而且键名所指向的对象,不计入垃圾回收机制。

      WeakMap与Map在API上的区别主要是两个:

      一是没有遍历操作(即没有key()、values()和entries()方法),也没有size属性;
      二是无法清空,即不支持clear方法。这与WeakMap的键不被计入引用、被垃圾回收机制忽略有关。
      因此,WeakMap只有四个方法可用:get()、set()、has()、delete()。

    19、Iterator: 遍历器

       (1)Iterator的作用有三个:

        1/是为各种数据结构,提供一个统一的、简便的访问接口;

        2/使得数据结构的成员能够按某种次序排列;

        3/是ES6创造了一种新的遍历命令for...of循环,Iterator接口主要供for...of消费。

       (2) Iterator的遍历过程是这样的。

        创建一个指针,指向当前数据结构的起始位置。也就是说,遍历器的返回值是一个指针对象。
        第一次调用指针对象的next方法,可以将指针指向数据结构的第一个成员。
        第二次调用指针对象的next方法,指针就指向数据结构的第二个成员。
        调用指针对象的next方法,直到它指向数据结构的结束位置。

      (3)迭代数组结构度必须实现一个名为Symbol.iterator的方法,该方法返回一个该结构元素的迭代器

           

      (4) 结构赋值

        对数组和Set结构进行解构赋值时,会默认调用iterator接口

          

    20、Generator

      该函数是一个函数内部状态的遍历器,也就是说该函数是一个状态机。形式上,它是一个普通函数,但是有两个特征:

      (1) function命令与函数名之间有*

      (2) 内部使用yield语句,定义遍历器的每个成员,即不同的内部状态

      (3) yield*: 表明返回的是一个遍历器

    21、Class   

      constructor内定义的方法和属性是实例对象自己的,而constructor外定义的方法和属性则是所有实例对象可以共享的。
    Class之间可以通过extends关键字实现继承,这比ES5的通过修改原型链实现继承,要清晰和方便很多。
    上面定义了一个Cat类,该类通过extends关键字,继承了Animal类的所有属性和方法。
      super关键字,它指代父类的实例(即父类的this对象)。子类必须在constructor方法中调用super方法,否则新建实例时会报错。
    这是因为子类没有自己的this对象,而是继承父类的this对象,然后对其进行加工。如果不调用super方法,子类就得不到this对象。
    ES6的继承机制,实质是先创造父类的实例对象this(所以必须先调用super方法),然后再用子类的构造函数修改this。

  • 相关阅读:
    跨数据库查询——dblink
    进度条
    datagrid 的标题的内容不对应整齐
    ie9table排列不对.td错行,多了一列
    进位方法
    ie9 jscript7 内存不足 页面无响应
    a标签 href触发及传值
    uploadify上传附件 点击保存无效 切F12就可以正常保存
    oracle增加用户密码,cmd导入数据库
    ${}中嵌套${}
  • 原文地址:https://www.cnblogs.com/qzccl/p/6542626.html
Copyright © 2020-2023  润新知