使用打字稿在 reduce 方法中使用扩展语法进行解构

Question

这是我的示例，它使用别名工作。下面的示例：'aliasCatch'

通过打字稿验证

export type TProcessResponseFunc = (error: TError, stdout: TSTDOut, stderr: TSTDOut) => void;

export interface IObjCMD {
  msg?: string;
  cmd?: string;
  func?: (fn: TProcessResponseFunc) => void;
  catch?: IObjCMD[];
}

const shallowCloneArrObjCMD = (arrNext: IObjCMD[]) => 
  arrNext.reduce((accum, current) => {
    let objCMD: IObjCMD = current;
    if (current.catch) {
      const { ...rest, catch: aliasCatch} = current;
      const arrCatch: IObjCMD[] = aliasCatch ? shallowCloneArrObjCMD(aliasCatch) : [];
      objCMD = { ...rest, catch: arrCatch};
    }
    accum.push({ ...objCMD });
    return accum;
  }, [] as IObjCMD[]);

如果我替换别名以直接访问解构的项目 - 即 catch，在下面的示例中，那么我到处都会出错：

打字稿验证失败

const shallowCloneArrObjCMD = (arrNext: IObjCMD[]) => 
  arrNext.reduce((accum, current) => {
    let objCMD: IObjCMD = current;
    if (current.catch) {
      const { ...rest, catch } = current;
      const arrCatch: IObjCMD[] = catch ? shallowCloneArrObjCMD(catch) : [];
      objCMD = { ...rest, catch};
    }
    accum.push({ ...objCMD });
    return accum;
  }, [] as IObjCMD[]);

const { ...rest, catch } = current; - gives me error on the end curly brace: expected : and this breaks the rest of the code.

我唯一能想到的原因是因为我的变量 'catch' 可能未定义，如我的界面中所声明的那样。因此，通过将其分配给 variable/aka 别名，使其成为别名可以绕过变量具有值的直接需求。

对此进行一些澄清会有所帮助。谢谢

Answer 1

catch 是一个 reserved word。您不能将其用作变量名。 current.catch 可以，但 const { ...rest, catch } = current 不行。

我建议完全避免使用 catch（以及其他保留字，如 delete 或 class）作为属性名称。如果你不能，你可能需要使用注释来告诉你的 linter 不要坚持解构：

/* eslint-disable prefer-destructuring */
const arrCatch: IObjCMD[] = current.catch
  ? shallowCloneArrObjCMD(current.catch)
  : [];
objCMD = { ...current };

使用打字稿在 reduce 方法中使用扩展语法进行解构

Destructuring with spread syntax in reduce method using typescript

typescript

ecmascript-6

spread-syntax

通过打字稿验证

打字稿验证失败