从函数中返回多个值

摘要：在本教程中，您将学习定义返回多个值的 JavaScript 函数。

JavaScript 函数 可以返回单个值。要从函数中返回多个值，您可以将返回值打包为 数组 的元素或 对象 的属性。

使用数组从函数中返回多个值

假设以下 getNames() 函数从后端数据库或第三方 API 调用的结果中检索姓氏和名字，并将其作为数组的元素返回。

function getNames() {
    // get names from the database or API
    let firstName = 'John',
        lastName = 'Doe';

    // return as an array
    return [firstName, lastName];
}Code language: JavaScript (javascript)

以下显示了如何从 getNames() 函数获取返回值。

let names = getNames();Code language: JavaScript (javascript)

因为 names 变量是一个数组，您可以使用方括号引用其元素，如下所示。

const firstName = names[0],
      lastName  = names[1];Code language: JavaScript (javascript)

在 ES6 中，您可以使用 解构赋值 语法更直观地从数组中解包值，如下所示。

const [firstName, lastName] = getNames();Code language: JavaScript (javascript)

在此代码中，firstName 和 lastName 变量将获取返回值数组的第一和第二个元素。

使用对象从函数中返回多个值

如果要为每个返回值分配一个名称以使其更具可读性和易于维护，可以使用 对象。

function getNames() {
  // get names from the database or API
  let firstName = 'John',
      lastName = 'Doe';

  // return values
  return {
    'firstName': firstName,
    'lastName': lastName
  };
}Code language: JavaScript (javascript)

由于属性的名称与变量相同，您可以使用 ES6 中的对象文字语法扩展 将其缩短，如下所示。

function getNames() {
  // get names from the database or API
  let firstName = 'John',
      lastName  = 'Doe';

  return { firstName, lastName };
}
Code language: JavaScript (javascript)

您可以像这样获取返回值作为对象。

let names = getNames();

let firstName = names.firstName,
    lastName  = names.lastName;Code language: JavaScript (javascript)

如果要从对象中解包属性，可以使用 对象解构语法，如下所示。

let { firstName, lastName } = getNames();Code language: JavaScript (javascript)

总结

• JavaScript 不支持返回多个值的函数。但是，您可以将多个值包装到数组或对象中，然后返回该数组或对象。
• 使用解构赋值语法从数组中解包值，或从对象中解包属性。