在 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');
输出:
使用 Destructing Assignment
解包数组
一般来说,我们可以很容易地声明变量或对象来存储数组元素。但是对于大数据,每次都定义 var
是很乏味的。
你还可以循环访问数组以访问值。除此之外,ES6 还增加了解包数组元素的功能,如下例所示。
代码片段:
function getValues() {
var hair = 'Short', color = 'Black';
return [hair, color];
}
var [x, y] = getValues();
console.log(x + ' ' + y + ' Hair');
输出:
使用 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');
输出:
正如你所看到的,我们刚刚从函数中传递了 keys
,当用键名解压它们时,输出也显示了相应的值。
相关文章
Do you understand JavaScript closures?
发布时间:2025/02/21 浏览次数:108 分类:JavaScript
-
The function of a closure can be inferred from its name, suggesting that it is related to the concept of scope. A closure itself is a core concept in JavaScript, and being a core concept, it is naturally also a difficult one.
Do you know about the hidden traps in variables in JavaScript?
发布时间:2025/02/21 浏览次数:178 分类:JavaScript
-
Whether you're just starting to learn JavaScript or have been using it for a long time, I believe you'll encounter some traps related to JavaScript variable scope. The goal is to identify these traps before you fall into them, in order to av
How much do you know about the Prototype Chain?
发布时间:2025/02/21 浏览次数:150 分类:JavaScript
-
The prototype chain can be considered one of the core features of JavaScript, and certainly one of its more challenging aspects. If you've learned other object-oriented programming languages, you may find it somewhat confusing when you start
用 jQuery 检查复选框是否被选中
发布时间:2024/03/24 浏览次数:102 分类:JavaScript
-
在本教程中学习 jQuery 检查复选框是否被选中的所有很酷的方法。我们展示了使用直接 DOM 操作、提取 JavaScript 属性的 jQuery 方法以及使用 jQuery 选择器的不同方法。你还将找到许多有用的
jQuery 中的 Window.onload 与 $(document).ready
发布时间:2024/03/24 浏览次数:180 分类:JavaScript
-
本教程演示了如何在 jQuery 中使用 Window.onload 和 $(document).ready 事件。