zoukankan      html  css  js  c++  java
  • es6学习

    1,学习网址

      http://es6.ruanyifeng.com/#docs/intro

    2,解构赋值

    3,字符串模板

      let name="shmily";

      let age = 11;

      let str = '我的姓名${name},年龄${age}';

      var 定义一个全局变量是属于window的。而let  和const则不同

    4,字符串查找

       str.includes()  // 返回值是true false        

      用于判断浏览器

           navigator.userAgent.include('chrome');

      str.indexOf()  // 找不到返回-1  找得到返回下标

    5,字符串是否以什么开头

      str.startsWith()

    6,字符串是否已什么结尾

      str.endsWith()

    7,重复

      str.repeat(num);  // num  重复次数

    8,填充字符串

       str.padStart(填充后整个字符串长度,填充内容); // 往前填充

      str.padEnd(填充后整个字符串长度,填充内容);  // 往后填充

    9,函数变化

      可赋给默认值

      函数参数默认已经定义,不能再使用let  const再次声明

      扩展运算符  rest运算符    ...运算符     展开(重置)数组    ...[1,2,3,4,5] -> 1,2,3,4,5

      function show(...a) {

        console.log(a)

      }

      show(1,2,3,4,5);

      //   打印  [1,2,3,4,5]

      剩余参数   剩余参数必须放在最后

      ... 复制数组

      转换数组

      let str = 'a-b-c';

      let arr = Array.from(str);    //换成数组

    10,箭头函数

      let show = ()=> 1// return  

      // 语句   

       let show = () {

        // 语句

      }

      注意事项:

      箭头函数的this指向在函数定义时已经确定,普通函数的this的指向在调用时确定

      箭头函数里没有arguments,用...

      箭头函数不能当构造函数

    11,函数参数最后可以有逗号

    12,数组

      arr.forEach(function(val,index,arr){});   // 代替普通for循环   没有返回值

      arr.map()  // 适用于数据映射   //正常情况下需要配合return使用返回一个新数组    如果没有return  相当于forEach   //平时用map  一定要有return 

          // 重新整理数据结构

      arr.filter()   //过滤   过滤一些不合格的元素  如果回调函数返回的是true 就留下来

      arr.some()  // 类似查找   数组中某一个元素符合条件   返回true

      arr.every()  // 类似查找   数组中所有元素都符合条件  返回true 

      // 接收两个参数,第一个参数是回调函数,第二个是this指向谁

      arr.reduce()    // 求数组的和  阶乘   //接收的参数   arr.reduce((prev,cur,index,arr) =>{return  prev+cur});    Math.pow(a,b)   // a的b次方 

            // 从左往右

          es2017  新增运算符   幂次方  2**3

      arr.reduceRight()      // 从右往左

      // for  of  循环

              // arr.keys()  数组下标   // arr.entries()   //数组某一项

      扩展运算符

        ...

        Array.from  // 作用:把类数组(具备length)(获取一组元素,arguments...)对象转成数组

        Array.of   // 作用:把一组值转成数组

        arr.find()  // 查找数组中第一个符合条件的值  如果没有找到 返回underfined

        arr.findIndex()  // 查找数组中第一个符合条件的值的位置  如果没有找到 返回-1

        arr.fill(填充的东西,开始位置,结束位置)  //填充   

        arr.includes()

    13,对象

      json  变化

        对象简洁语法(相当有用)

        let  name ="shmily"; let age = 18;

        let json = {

          name,

          age

         }

         vue 里面的method里面不用箭头函数

      Object.is()   用来比较两个值是否相等;

        Object.is('a','a');

      比较两个值是否相等    ==    ===

      注意  NaN   

        NaN == NaN     false

        Number.isNaN(NaN)    true 

        Object.is(NaN,NaN)   true

      +0  -0

      +0 == -0   true

      Object.is(+0,-0)   false  

    Object.assign(目标对象,源头)  // 用于合并参数     //用于复制对象

      let json = {a:1}

      let json1 = {b:2}

      let json2 = {c:3}

    let obj = Object.assign({},json,json1,json2);   //合并     // 相同类名  后面会覆盖前面

    ES2017

    Object.keys()

    Object.entries()

    Object.values()

    对象   ...      // 对象扩展运算

    14    promise      // 解决异步回调的问题       传统方式采用回调函数   异步驱动解决异步问题

    promise.catch(err=>{

    })    // 错误捕获

    Promise.resolve('aa')     // 将现有的东西转成一个promise对象 ,resolve状态   成功状态

    Promise.reject('aaa')   // 将现有的东西转成一个promise对象   ,reject状态   失败状态

     

    Promise.all([p1,p2,p3])    /// promise 对象打包扔到数组里   打包完成还是一个promise对象

              // 必须确保所有的promise对象必须是resolve状态

    Promise.race([p1,p2,p3])    //   只要有一个resolve状态就能返回

    15  模块化

        js不支持模块化

        es6之前   js社区制定规范

          commonJs      // 主要服务端  nodeJs    require(’http')

          AMD               // requireJs    curlJs

          CMD              //seaJs

    es6   统一客户端和服务端规范

        模块化     //注意  需要放到服务器环境   

          1) 如何去定义模块

              export  导模块

              import  引模块

          2)如何使用

        使用模块时   script标签加  type = ”module"

        import

            1)可以是相对路径,也可以是绝对路径

            2)import模块只会导入一次,无论引入多少次

            3) export 的东西都需要花括号  export default 不需要

            4) 有提升效果  import会自动提升到顶部,首先执行

            5)导出的模块内容,如果内部内容有更改,外面也会更改     区别于common规范缓存

        import()  类似于node 里面的require   可以动态引入    默认import语法不能写入if之类里面        //返回值是promise对象

              es2017  可以结合 async   await 使用

          优点

            1) 按需加载

            2) 可以写if

            3) 路径可动态

    es6自动采用严格模式  'use  strict'

    16  程序中的类

      面向对象    类

      es6里面class没有提升     在es5里用函数模拟可以   默认函数提升

    getter  (取值函数)

    setter (存值函数)

    静态方法就是类身上的方法

    父类

    子类

    继承  extends

    17  数据类型

      number  string

      typeOf  检测出来数据类型是 symbol

      新增:symbol    使用情况一般    Symbol('aaa')     

      注意

        1) symbol  不能new

        2) symbol的返回值是唯一的   // 作为key用,定义唯一或私有的东西

        3) symbol是一个单独的数据类型   基本类型

        4) 如果symbol作为key  用for in循环出不来   (因为是私有的)

    json  循环  用 for in

    18  generator函数

        生成器

        解决异步编程    深度嵌套   的问题  

    for ... of 循环   // 注意return 的东西不会遍历

    解构赋值

    扩展运算符

    Array.from() 

    generator结合axios

    异步:不连续   上一个操作没有执行完,下一个操作可以开始

    同步:连续   上一个操作没有执行完,下一个操作不可以开始

    解决异步

        1)回调函数

        2) 事件监听

        3) 发布/订阅

        4) Promise对象

    19 async

        

         await   表示后面的结果需要等待

    特点:

      1) await只能放在async函数中

      2) 相比其他更语义化

      3) await后面可是一个promise对象  也可以是字符串,数字,布尔值

      4) async函数返回的是promise对象

      5) 只要await语句后面Promise状态变成reject,那么整个async函数都会中断执行

    个人建议:只要有await都要try  catch掉,防止程序异常

    20  数据结构

        数组

        json

    set数据结构   // 注意兼容性问题  ie

      类似数组

      用法

        new Set(['a','b']);

        set里面的内容不能有重复

        方法

          1)add()  //添加方法

          2)  delete()  // 删除方法

          3)has检测有没有某内容

          4) size  个数

          5) clear()     清空

        循环

          for  of循环

     数组去重

        可以用set

    new Set([])    //存储数组

    new WeakSet({})     //存储json   //确认初始添加json对象是不行的,最好使用add

    weakSet  没有size  ,没有clear

    21  map

      类似json,但json的key只能是字符串

      map的key可以是任意类型

    使用

       let  map = new Map();

       map.set(key,value);   //set设置一个值

       map.get(key)   // get获取一个值

    weakMap  // key只能是对象

      

      

  • 相关阅读:
    数论数论函数基础知识
    KMP入门和简单运用
    高斯消元入门
    FFT和NTT
    AC自动机入门和简单应用
    后缀自动机入门
    线段树优化建图的速成
    爱情九十七课,降低期待
    爱情九十二课,说出你的弱
    爱情八十六课,等得不是爱情
  • 原文地址:https://www.cnblogs.com/shmily-code/p/7642336.html
Copyright © 2011-2022 走看看