• 编码规范: 不要在类构造器内实例化当前对象


    不要在类构造器内实例化当前对象也就是说不要将类class当做function使用

    请抛弃旧有的编码习惯:

    function Element (tagName, props, children) {
      if (!(this instanceof Element)) {
        if (!_.isArray(children) && children != null) {
          children = _.slice(arguments, 2).filter(_.truthy)
        }
        return new Element(tagName, props, children)
      }
       //  ......
    }
    

    我们在TSES6编码时会习惯性沿用ES5时代的编码习惯

    export class Element implements IVNode {
      // ....
      constructor(_tagName: string);
      constructor(_tagName: string, children: any);
      constructor(_tagName: string, props: T_OBJ);
      constructor(_tagName: string, props: T_OBJ, children: T_ArrayNode);
      constructor(_tagName: string, props?: T_OBJ, children?: T_ArrayNode) {
        if (!(this instanceof Element)) {
          if (typeof props !== "undefined") {
            if (Array.isArray(children)) {
              return new Element(_tagName, props, children);
            } else {
              return new Element(_tagName, props);
            }
          } else {
            if (Array.isArray(children)) {
              return new Element(_tagName, children);
            }
          }
          return new Element(_tagName);
        }
    
      // ....
    

    这种编码方式导致class , function定义不明确,职责不清晰,我们是不提倡的

    推荐将实例化的代码抽离

    export class Element implements IVNode {
        constructor(_tagName: string, props?: T_OBJ, children?: T_ArrayNode) {
            // ...
        }
    }
    
    export default function (_tagName: string): IVNode
    export default function (_tagName: string, children: T_ArrayNode): IVNode
    export default function (_tagName: string, props: T_OBJ): IVNode
    export default function (_tagName: string, props: T_OBJ, children: T_ArrayNode): IVNode
    export default function (_tagName: string, props?: T_OBJ, children?: T_ArrayNode): IVNode {
      if (arguments.length === 2) {
        const tmp = arguments[1]
        if (Array.isArray(tmp)) {
          return new Element(_tagName, {}, tmp)
        } else {
          return new Element(_tagName, tmp, [])
        }
      } else if (arguments.length === 1) {
        return new Element(_tagName, {}, [])
      }
      return new Element(_tagName, props, children)
    }
    

    By小云菜:http://www.cnblogs.com/phillyx/

    github:http://github.com/phillyx

    版权所有,转载请注明出处

  • 相关阅读:
    LeetCode 1356. 根据数字二进制下1的数目排序
    Ubuntu LaTeX 中文环境配置 与 VSCode LaTeX Workshop
    LeetCode 57. 插入区间
    VSCode Ubuntu下调试失败 无法打开 libc-start.c raise.c等
    LeetCode 30. 串联所有单词的子串
    日期处理函数
    Stream 和 byte[] 之间的转换
    Math.Round {实现四舍五入的小技巧}
    重写alert弹窗
    js轮播图
  • 原文地址:https://www.cnblogs.com/phillyx/p/14487537.html
Copyright © 2020-2023  润新知