es6常用

  • 变量声明let与const

    var的缺点:可以重复声明 ;没有块级作用域;不能限制;

               let        变量声明不能被模块外面调用

    const   是常量声明,必须初始化不能改变赋值

  • 块级作用域

     

  • 变量的解构赋值   (1.左右两边要相等   2. 右边得是个正常的东西)

    • 数组解构赋值          

    • 对象解构赋值

    • 字符串解构赋值

  • 字符串扩展

    • includes()    判断字符串中是否包含指定的字符串(有就返回true,没有false)

          参数一:匹配的字符串; 参数二:从第几个开始匹配

    • startsWith()    判断字符串是否以特定字串开始

    • endsWith()     判断字符串是不是以特定字串结束

    • 模板字符串     反引号表示模板,模板中的内容可以有格式,通过${ }方式填充数据

  • 函数扩展

    • 参数默认值

    • 参数解构赋值

    • rest参数   (剩余参数)// ... 必须在最后面

    • 扩展运算符

    • 箭头函数(*

      1.箭头函数的this取决与函数的定义,而不是调用

      2.箭头函数不可以new

      3.箭头函数不可以使用arguments获取参数列表,可以使用rest参数代替

      4.如果又且只有一个参数,()也可以省

      5.如果有且只有一条语句 -return  ,{ } 也可以省 

      6.箭头函数不适合的地方

        1.在定义对象函数时

        2.定义事件回调函数

        3.定义构造函数

        具体细节具体分析

  • 类与继承

  • 系统对象

  array

    map( )      映射       1对1

    forEach( )  遍历     循环一遍

    filter( )       过滤

    reduce( )     减少     多变1

  string(见上字符串扩展)

  json

   1.stringify     js  ---》  json

   2.parse       json -----》 js

 


 

异步处理   ( Promise  async / await )

什么是异步操作?

异步--- 同时处理多个请求

同步----一次只能处理一个请求

promise

使用方法:

Promise.all([
    p1,
    p2,
    p3
   。。。。。    
]).then();

//先实行完all里面所有的请求,然后执行then里面的函数

缺点:all处理时无顺序无逻辑(很少会有promise单独使用)

解决promis的问题,引入了 async/await  (用同步的方法写异步请求)

async function  函数名 ( ){
        let a= 12;
        let b = 11;
        .... //正常执行函数
            //出现await时 相当于会暂停async 函数执行await先
        let data = await promise;

    .......

        alert(a+b);
    }

//也可写成
    let xxx = asycn () => {
        .....
    }

 


 

es6新增了 Class  constructor super和 extend 

<script>   
        class Person{
            constructor(name,age){      //constructor可以直接构造对象的属性
                this.name=name;
                this.age = age;
            }
            show(){
                alert(this.name);
            }
        }

        class Child extends Person{   
            constructor(name,age,job){
                super(name,age);   //super用于继承父类的属性
                this.job=job;
            }

            showJob(){
                alert(this.job);
            }
        }

        let w = new Child('xx',18,'daren');
        w.show();
        w.showJob();
        </script>

es模块化


 

(因为浏览器不支持es6 的模块化)所以要用webpack工具将es6 的模块化编译以便让浏览器去支持

webpack编译:

1.   entry ====  入口地址

2.   output==== 输出

   path:绝对路径

   filename:文件名

3.   mode ===== 模式

4.   在所有路径前加 . / (这是node里面的要求)

 


 export (导出 )

  export  function  xxx ( ){   };

  export  class  xxx  {    }

       export   {  xxx , xxxx , xxx };

  export    default   xx;

import (引入)

  import  * as  mod from  " . / xxx" ;       //全部引入

  import  { a,b,c,.... }  from " . / xxx";      // 选择引入

 

  //引入默认成员

  import xxx from  ‘ . / mod ' ;

 

  //模块的代码引入,但不引入内部成员

  import  “ . / 1.jpg ” ; 

  import  " . / 1.css " ;

 

  //异步引入

  let promise = import( " . / mod1 " );

 

 

 

 

 

 

 

 

 

 

转载于:https://www.cnblogs.com/BR-Tao/p/11149329.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值