• ES6


    ES6 是模板语言

    var 定义的变量有变量提升(把变量提到代码第一行),声明的变量有内存泄露,没有被销毁
    let 是块级作用域
    const 定义常量,不能被改变

    const b={a:1};//object地址,有内存
    b.a=2;
    内存地址不能改变,里面的值可以改变

    varfunction 有变量提升,letconst没有

    console.log(a);//undefined
    var a=1;
    console.log(b);//报错 is not defined
    let b=2;
    //块级作用域
    {//大括号限制块级作用域
        let a=1;//在块级的外面没法找到
        var b=2;//var是函数集作用域,在块级里依然可以被变量提升
    }

    模板语言

    var str=`
    a
    b
    `
    let name="jack";
    console.log(`I'm ${name}`)

    声明函数的默认参数

    //默认参数,防止忘记传
    function add(flag=true){
    
    }

    箭头函数

    a:function(){}
    //ES6
    a(){}
    function(res){
        this //指向内部
    }
    
    //ES6
    res=>{//箭头函数
        this //指向外部
    }

    数组的解构

    var [a,b]=[3,3,2];//数组的分解,a=3
    var [x,y,z]="vue";//字符串的分解,x=v
    var {m,n}={m:10,n:20};//对象的结构,对key进行拆分
    //函数的解构
    function sum([x,y]){
      return x+y;
    }
    sum([2,5])
    
    var a=[1,2,3,2]
    [...new Set(a)]//得到[1,2,3]去重

    Rest 拓展参数

    //function sum(...m){
    let sum=(...m)=>{//...rest参数,动态的
      let total=0;
      for(var i of m){
        total+=i;
      }
      console.log(`total:${total}`)
    }
    sum(4,21,3,2)
    //对数组的扩展,对数组拆解
     console.log(...[4,8]) //4 8
    let a=[1,2];let b=[3,4];[...a,...b] //1 2 3 4
    [x,...y]=[1,2,3,4] //x=1,y=[2,3,4]
    
    //对字符串的扩展,对字符串拆解
    xy=[...'ES6']; //["E", "S", "6"]

    Promise

    解决callback回调,通过链式调用,.then对Promise的封装

    let checkLogin = function() {
        return new Promise(function(resolve, reject) { //resolve成功回调,reject失败回调
            let flag = document.cookie.indexOf("userId") > 1 ? true : false;
            if (flag = true) {
                resolve({
                    status: 0,
                    result: true
                })
            } else {
                reject("error");
            }
        })
    }
    let getUserInfo = () => {
        return new Promise((resolve, reject) => {
            let userInfo = {
                userId: '101'
            }
            resolve(userInfo);
        })
    }
    /*
    checkLogin().then(res=>{//回调
        if(res.status==0){
            //登录成功
            console.log('登录成功');
        }
    }).catch(error=>{//捕获异常
       console.log(`errors:${error}`);
    })
    */
    Promise.all([checkLogin(), getUserInfo()]).then(([res1, res2]) => {
        console.log(res1.result);
        console.log(res2.userId)
    })

    module.exports和ES6 import/export的使用

    //通过export导出,在util文件夹下
    export default{ //默认导出
    }
    export let sum=(x,y)=>{
        return x+y;
    }
    
    //import导入
    import util from './util' //sum(1,2)
    import {sum} form './util' //sum(1,2)
    import * as util from './util' //util.sum(1,2)
    
    import('./../util')//可以异步加载js文件

    模块化开发中的解决方案

    AMD(异步模块定义):是requirejs在推广过程中对模块定义的规范化产出。特点:依赖前置
    CMD(同步模块定义):是seajs在推广过程中对模块定义的规范化产出。特点:依赖就近,在什么时候使用就在时候时候引入
    CommonJS:前端浏览器不支持,在nodejs后端定义模块,在服务端使用,module.exports匿名输出,exports.a带名字的输出
    ES6特性export/import

  • 相关阅读:
    Js
    CSS
    CSS
    第七周作业及总结
    第六周作业及总结
    第五周作业及总结
    第四周作业及总结
    第三周作业及总结
    7-1 判断上三角矩阵
    第二周作业及总结
  • 原文地址:https://www.cnblogs.com/conglvse/p/9543539.html
Copyright © 2020-2023  润新知