HOWTO · JavaScript

在 JavaScript 中返回多个值

JavaScript 不支持可以返回多个值的函数。但是可以通过数组或对象传递多个值,以后可以访问。

本页内容

通常,函数终止时有一个返回案例。返回的情况可以有一个值或没有任何东西可以传递。

在 JavaScript 中,不支持函数返回多个值。因此,为了能够打包多个值并通过函数传递它们,我们需要数组和对象的帮助。

在这里,我们将演示使用数组来存储多个函数值。稍后,我们还将了解如何使用对象来收集函数值。

此外,我们还将弄清楚如何使用 destructing assignment 和一般变量声明来解包函数值。

在 JavaScript 中从带有数组的函数返回多个值

在本例中,getValue 函数有两个变量,我们将它们作为数组传递并返回。

新的变量 feature 声明将以数组的形式存储函数返回。像任何其他数组遍历一样,我们可以使用索引访问值。

更简单地说,这里的 feature 是另一个数组,它以数组形式获取从 getValues 函数返回的同步值。

代码片段:

function getValues() {
  var hair = 'Short', color = 'Black';
  return [hair, color];
}
var feature = getValues();
var x = feature[0];
var y = feature[1];
console.log(x + ' ' + y + ' Hair');

输出:

return_multiple_values_with_array

使用 Destructing Assignment 解包数组

一般来说,我们可以很容易地声明变量或对象来存储数组元素。但是对于大数据,每次都定义 var 是很乏味的。

你还可以循环访问数组以访问值。除此之外,ES6 还增加了解包数组元素的功能,如下例所示。

代码片段:

function getValues() {
  var hair = 'Short', color = 'Black';
  return [hair, color];
}
var [x, y] = getValues();
console.log(x + ' ' + y + ' Hair');

输出:

array_destruct

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

你可以轻松地使用键值对来使用对象构建数据。对于这个示例驱动器,我们将再次初始化函数 getValues,这次返回案例将采用对象格式。

代码片段:

function getValues() {
  var hair = 'Long', color = 'Brown';
  return {hair, color};
}
var feature = getValues();
var x = feature.hair;
var y = feature.color;
console.log(x + ' ' + y + ' Hair');

输出:

对象返回

这里的代码块有一个作为对象工作的变量 feature。稍后与 dot(.) 方法一起,我们调用 keys 来访问值。

这个 map 需要明确的键名,因此相应的值得到了发言权。

使用 Destructing Assignment 解包对象

通过声明 ES6 约定:destructing assignment,可以解压缩从函数传递的对象。

在这里,我们将显式声明 keys,但声明将直接从函数访问值对。让我们检查一下代码块。

代码片段:

function getValues() {
  var hair = 'Long', color = 'Brown';
  return {hair, color};
}
var {hair, color} = getValues();
console.log(hair + ' ' + color + ' Hair');

输出:

object_destruct

正如你所看到的,我们刚刚从函数中传递了 keys,当用键名解压它们时,输出也显示了相应的值。