shadow's wiki | 吴尒红

逻辑语句

条件语句，是我们日常使用最频繁的语句之一。最常见的条件语句if和if()else{}，我是不太爱switch语句，感觉没什么必要，还不如使用一个策略模式去替换switch。

条件语句有以下几种:

if 语句
if...else 语句
switch 语句

下面是对于这几种语句的优缺点比较:

语句	优点	缺点
if语句	1. 简单、易读、易于理解 2.可以嵌套、灵活 3. 可以处理简单的条件分支	- 处理复杂的条件分支时容易产生错误 - 多层嵌套时可读性差
if...else语句	- 可以处理简单的条件分支 - 可以嵌套、灵活 - 代码可读性好	- 处理复杂的条件分支时容易产生错误 - 多层嵌套时可读性差
switch语句	- 可以处理多个条件分支 - 代码可读性好 - 可以处理多种条件	- 处理复杂的条件分支时容易产生错误 - 每个case必须以break或return结束，否则会执行下一个case

但是我相信我们日常中的应该不会高频率的使用switch语句，一旦遇到了很多逻辑分支或者是有重复的逻辑分支，大家都会默认使用策略去解决问题。

下面列出的是利用types创建的AST节点:

if语句

javascript

  /**
   * @NOTE if语句
   * 
   * @example
   * 
   * if (a > 10 && a <= 100 || b === 100) {
   *  console.log('=====', a, b)
   * }
   */
  const leftStatement = t.binaryExpression('>', t.identifier('a'), t.numericLiteral(10))
  const andStatement = t.logicalExpression('&&', leftStatement, t.binaryExpression('<=', t.identifier('a'), t.numericLiteral(100)))
  const orStatement = t.logicalExpression('||', andStatement, t.binaryExpression('===', t.identifier('b'), t.numericLiteral(100)))
  const ifStatement = t.ifStatement(orStatement, t.blockStatement([
    loggerExpressStatement
  ]))

多个逻辑操作符形成了多个逻辑节点，遇到逻辑操作符就必须使用logicalExpress表达式，将逻辑符切开成单个的逻辑节点，最后再使用ifStatement将所有的逻辑节点组合。

If-else 语句

javascript

  /**
   * @NOTE if-else 语句
   * 
   * @example
   * 
   * if (a === 100) {
   *  console.log()
   * } else if (a === 200) {
   *  console.log()
   * } else {
   *  console.log()
   * }
   */
  const leftStatement1 = t.binaryExpression('===', t.identifier('a'), t.numericLiteral(100))
  const elseStatement = t.binaryExpression('===', t.identifier('a'), t.numericLiteral(200))
  const ifElseStatement = t.ifStatement(
    leftStatement1,
    t.blockStatement([loggerExpressStatement]),
    t.ifStatement(
      elseStatement,
      t.blockStatement([loggerExpressStatement]), 
      t.blockStatement([
        loggerExpressStatement
      ])
    ),
  )

if-elseif-else语句，其实就是if语句的变体。types中没有单独为else-if准备单独的生成函数，但是我们可以继续使用ifStatement语句，用嵌套语句来实现else-if。

Switch 语句

javascript

 /**
   * @NOTE switch 语句
   * 
   * @example
   * 
   * switch (a) {
   *  case 1: {
   *    console.log()
   *    breadk 
   *  },
   *  case 2: {
   *    console.log()
   *    break
   *  },
   *  default: {
   *    console.log()
   *    break
   *  }
   * }
   */
  const switchStatement = t.switchStatement(
    t.identifier('a'),
    [
      t.switchCase(
        t.numericLiteral(1),
        [t.blockStatement([loggerExpressStatement, t.breakStatement()])]
      ),
      t.switchCase(
        t.numericLiteral(2),
        [t.blockStatement([loggerExpressStatement, t.breakStatement()])]
      ),
      t.switchCase(
        null,
        [
          t.blockStatement([loggerExpressStatement])
        ]
      )
    ]
  )

switch语句就相当简单了，提供了全套的生成函数switchStatement、switchCase。但是需要注意一点，types没有单独为default节点准备生成函数。出现在switch语句中的最后一个节点default，我们可以继续利用switchCase传入一个null值。

派生操作，利用逻辑操作符(&&/||)

javascript

  /**
   * @NOTE 利用逻辑操作符
   * 
   * @example
   * 
   * function foo (a) {
   *    a && (console.log())
   * }
   */
  const logicalStatement = t.functionDeclaration(
    t.identifier('foo'),
    [t.identifier('a')],
    t.blockStatement([
      t.expressionStatement(
        t.logicalExpression('&&', t.identifier('a'), t.callExpression(t.identifier('console.log'), []))
      )
    ])
  )

这中方式我们在日常的工作中使用的还是比较多的，上面是一个利用逻辑与操作符，实现调用console函数的例子。除此之外，还可以利用短路操作符设置默认值。

源码地址:

条件语句: https://github.com/stack-wuh/mini-cli/blob/main/core/create-condition-babel/babel.js

逻辑语句 ​

逻辑语句