• ES6总结


    image

    let const

    let 表示申明变量。const 表示申明常量。

    • 常量定义了就不能改了。对象除外,因为对象指向的地址没变。
    • const在申明是必须被赋值。
    • 两者都为块级作用域。
      块级作用域与函数作用域。任何一对花括号({和})中的语句集都属于一个块,在这之中定义的所有变量在代码块外都是不可见的,我们称之为块级作用域。函数作用域就好理解了,定义在函数中的参数和变量在函数外部是不可见的。

    模块字符串``

    let name = 'Mike';
    let age = 27;
    let result = `My Name is ${name},I am ${age+1} years old next year.`;
    console.info(result);
    

    image

    解构

    数组模型的解构(Array)

    let arr = ['苹果','西瓜','乌龟'];
    let [a,b,c] = arr;
    console.info(a);
    console.info(b);
    console.info(c);
    

    image
    变量有默认值时解析

    let [a = 3, b = a] = [];     // a = 3, b = 3,a 与 b 匹配结果为 undefined ,触发默认值:a = 3; b = a =3
    let [a = 3, b = a] = [1];    // a = 1, b = 1,a 正常解构赋值,匹配结果:a = 1,b 匹配结果 undefined ,触发默认值:b = a =1
    let [a = 3, b = a] = [1, 2]; // a = 1, b = 2,a 与 b 正常解构赋值,匹配结果:a = 1,b = 2
    

    对象模型的解构(Object)

    let person = {name:'利威尔',age:28,job:'兵长'}
    let {name,job} = person;
    console.info(name);
    console.info(job);
    

    image

    函数

    参数默认值

    function fn(name,age=17){
     console.log(`My Name is ${name},I am ${age+1} years old`);
    }
    fn("Amy");
    

    image

    箭头函数

    参数 => 函数体

    //es5
    var fn_name = function() {
    
    }
    //es6
    var fn_name = () => {
    
    }
    
    1. 不需要 function 关键字来创建函数
    2. 省略 return 关键字
    3. this始终指向函数申明时所在作用域下的this值
    var f = (a,b) => {
     let result = a+b;
     return result;
    }
    f(6,2);  // 8
    

    for of

    for of遍历的是键值对中的值
    for in遍历的是键值对中的键

    const arr = ['red', 'green', 'blue'];
    
    for(let v of arr) {
      console.log(v); // red green blue
    }
    

    image

    class类

    class Student {
      constructor() {
        console.log("I'm a student.");
      }
    
      study() {
        console.log('study!');
      }
    
      static read() {
        console.log("Reading Now.");
      }
    }
    
    console.log(typeof Student); // function
    let stu = new Student();  // "I'm a student."
    stu.study();  // "study!"
    Student.read(); // "Reading Now."
    

    image

    导入导出

    导入improt,引入的变量可以用as起别名
    导出export

    /*-----export [test.js]-----*/
    let myName = "Tom";
    let myAge = 20;
    let myfn = function(){
        return "My name is" + myName + "! I'm '" + myAge + "years old."
    }
    let myClass =  class myClass {
        static a = "yeah!";
    }
    export { myName, myAge, myfn, myClass }
    
    /*-----import [xxx.js]-----*/
    import { myName as n, myAge as a, myfn, myClass } from "./test.js";
    console.log(myfn());// My name is Tom! I'm 20 years old.
    console.log(a);// 20
    console.log(n);// Tom
    console.log(myClass.a );// yeah!
    

    export default{}

    在一个文件或模块中,export、import 可以有多个,export default 仅有一个
    export default{}可以导出变量、函数、类。
    通过export方式导出,在import时要加{},export default则不需要{}。
    export default向外暴露的成员,可以使用任意变量来接收。

    promise

    Promise异步操作有三种状态:pending(进行中)、fulfilled(已成功)和 rejected(已失败)。

    then

    promise.then(onCompleted, onRejected);
    一个promise必须提供一个then方法以访问其当前值、终值和据因。then 方法接收两个函数作为参数,第一个参数是 Promise 执行成功时的回调,第二个参数是 Promise 执行失败时的回调,两个函数只会有一个被调用。

    async/await

    async 函数返回一个 Promise 对象,可以使用 then 方法添加回调函数。
    await 操作符用于等待一个 Promise 对象, 它只能在异步函数 async function 内部使用。
    await针对所跟不同表达式的处理方式:
    Promise 对象:await 会暂停执行,等待 Promise 对象 resolve,然后恢复 async 函数的执行并返回解析值。
    非 Promise 对象:直接返回对应的值。

    async function helloAsync(){
        console.info(1111);
        return "helloAsync";
      }
    
    console.log(helloAsync())  // Promise {<resolved>: "helloAsync"}
    
    helloAsync().then(v=>{
       console.log(2222);
       console.log(v);         // helloAsync
    })
    

    image

    Symbol数据类型

    ES6 引入了一种新的原始数据类型 Symbol ,表示独一无二的值,最大的用法是用来定义对象的唯一属性名。
    ES6 数据类型除了 Number 、 String 、 Boolean 、 Object、 null 和 undefined ,还新增了 Symbol 。

    数组filter过滤器

    array.filter((value, index, arr) => {value === '匹配对象'})

    var newarr = [
      { num: 1, val: 'ceshi', flag: 'aa' },
      { num: 2, val: 'ceshi2', flag: 'aa2'  }
    ]
    console.log(newarr.filter(item => item.num===2 ))
    

    数组去重

    var arr = [1, 2, 2, 3, 4, 5, 5, 6, 7, 7,8,8,0,8,6,3,4,56,2];
    var arr2 = arr.filter((x, index,self)=>self.indexOf(x)===index);
    console.log(arr2); //[1, 2, 3, 4, 5, 6, 7, 8, 0, 56]
    

    参考:
    https://www.cnblogs.com/wang--chao/p/14656871.html

  • 相关阅读:

    c#常用的基础概念
    Visual Studio2010+SOS.dll调试入门 摘自 http://www.cnblogs.com/luminji/archive/2011/01/27/1946217.html
    优化数据库之前的10个问题
    js数组清空的两种方式
    我的资源(网站, 工具)
    iis使用十大原则
    SQL2005分页存储过程
    温故而知新:Delegate,Action,Func,匿名方法,匿名委托,事件
    无法获得数据库 'model' 上的排他锁 网上搜索结果 IT
  • 原文地址:https://www.cnblogs.com/aeolian/p/15961893.html
Copyright © 2020-2023  润新知