在 JavaScript 中返回多个值

Anika Tabassum Era 2023年10月12日
  1. 在 JavaScript 中从带有数组的函数返回多个值
  2. 使用 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,当用键名解压它们时,输出也显示了相应的值。

Anika Tabassum Era avatar Anika Tabassum Era avatar

Era is an observer who loves cracking the ambiguos barriers. An AI enthusiast to help others with the drive and develop a stronger community.

LinkedIn Facebook

相关文章 - JavaScript Return

相关文章 - JavaScript Function