TypeScript中传递多个参数的方法咨询——JS写法的TS适配

首先得指出你原JavaScript代码里的小问题：data = {name, email, password}这种写法如果没有在外部提前定义name、email、password这三个变量，会直接抛出ReferenceError。你应该是想定义一个包含特定属性的对象参数，同时给它设置默认值对吧？下面是TypeScript里的正确实现方式：

第一步：定义参数类型 #

先通过interface或者type alias明确参数的结构和属性类型，这样TypeScript能帮你做类型校验：

// 用interface定义用户数据类型
interface UserData {
  name: string;
  email: string;
  password: string;
}

// 或者用type alias效果一样
// type UserData = {
//   name: string;
//   email: string;
//   password: string;
// };

场景1：要求必须传入符合类型的参数 #

如果调用createOrUpdate时必须传入完整的用户数据，直接给参数指定类型即可：

const createOrUpdate = async (data: UserData) => {
  const params = {
    TableName: Table,
    Item: data
  };

  try {
    await db.put(params).promise();
    return { success: true };
  } catch (error) {
    return { success: false };
  }
};

场景2：允许参数可选，带默认值 #

如果想让参数可选，同时给一个默认的空对象（或者带默认属性值的对象），需要先把类型里的属性设为可选，再设置默认值：

// 属性设为可选（加?）
interface UserData {
  name?: string;
  email?: string;
  password?: string;
}

const createOrUpdate = async (data: UserData = {}) => {
  // 如果你需要给属性设置默认值，可以合并传入的data和默认值
  const finalData = {
    name: '',
    email: '',
    password: '',
    ...data
  };

  const params = {
    TableName: Table,
    Item: finalData
  };

  try {
    await db.put(params).promise();
    return { success: true };
  } catch (error) {
    return { success: false };
  }
};

场景3：解构对象参数（和你原JS写法更接近） #

如果你原本是想把对象的属性直接解构出来作为函数内部变量，TypeScript也能轻松实现：

interface UserData {
  name: string;
  email: string;
  password: string;
}

// 解构参数同时指定类型，默认值设为空对象避免报错
const createOrUpdate = async ({ name, email, password }: UserData = { name: '', email: '', password: '' }) => {
  const params = {
    TableName: Table,
    Item: { name, email, password }
  };

  try {
    await db.put(params).promise();
    return { success: true };
  } catch (error) {
    return { success: false };
  }
};

核心思路就是先明确参数的类型结构，再根据业务需求选择参数是否可选、设置合理的默认值，TypeScript会在编译阶段帮你校验参数的正确性，避免运行时错误。

内容的提问来源于stack exchange，提问作者Kethmie Perera