切图崽的自我教养-[ES6] 编程作风范例

媒介

没有礼貌 不成方圆

  1. let替代var来定义变量. 如果是常量,运用const

  2. 静态字符串统一用单引号'' , 动态拼接成的字符串统一用反引号

    let staticString = 'This is a static string';
    
    let d = 'dynamic';
    let dynamicString = `This is a ${d} string`;
  3. 运用数组成员对变量赋值时,只管用解构赋值

    let arr = [1,2,3,4];
    let [arr1,arr2] = arr;
     
    //arr1 =1,  arr2 = 2;
  4. 往对象里增加/修正属性时,运用Object.assign,而不必松懈的.语法

    const objectA = {};
    Object.assign(objectA, { attr1: 3 });
    
    //objectA{attr1:3}
  5. 面向对象的写法一概写成class的情势,摒弃原生的prototype的誊写要领

    class A{
        constructor(){}
        prototypeFunA(){}
        static staticFunA(){}
        ...
    }
  6. 用extends完成单继续, 摒弃原生的prototype链誊写要领的继续

    class A{
        constructor(){}
        prototypeFunA(){}
        static staticFunA(){}
        ...
    }
    
    class B extends A{
        constructor(){
            super();
        }
    }
    
    let b = new B();     
    b.prototypeFunA();
    B.staticFunA();
  7. 用mixin润饰器的体式格局能够多继续(es5中能够用call来完成多继续,不过call/apply要领都属于奇技淫巧,不引荐运用了),实际上在js中多继续的运用场景并不多见

  8. 模块的誊写, 相似CommonJs范例. 暴露要领/属性统一用export

    //moduleA.js
    
    export let name = 'Xie Min'; 
    export function fun1(){xxx}
    export function fun1(){xxx}
    
    //或许如许写        
    //moduleA.js
    
     let name = 'Xie Min'; 
     function fun1(){xxx}
     function fun1(){xxx}
     
     export{
         name,
         fun1,
         fun2,
     }
  1. 援用模块统一用import,摒弃掉require . 这里特别注意,import模块的时刻途径必需写成相对途径的情势, 比方要写成 import {xx} from './moduleA' 而不是 import {xx} from 'moduleA'

    //index.js
    
    import * as moduleA from './moduleA';
    
    moduleA.name;    
    moduleA.fun1();                        
    moduleA.fun2();           

结语

部份参考自 阮一峰《ECMAScript 6入门》
其他细节待补充

    原文作者:大切图崽
    原文地址: https://segmentfault.com/a/1190000006735248
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞