JavaScript:如何从函数返回两个值并在另一个函数中调用这两个变量？

Question

JavaScript的:

                function getValue(){
                    var num1 = document.getElementById("firstNum").value;
                    var num2 = document.getElementById("secondNum").value;

                    return (num1, num2);
                }

                function add(){
                    getValue();

                    var result = parseFloat(num1) + parseFloat(num2);

                    return result;
                }

我正在创建的是一个从输入框中获取值的计算器.我遇到的问题是我应该如何调用我在getValue()中声明的变量; 函数在我的add(); 用于创建值的函数.

我很感激帮助.

Answer 1

你不能像这样返回两个值:

return (num1, num2);

Javascript不会那样工作.如果您正在尝试执行类似Python的元组,则Javascript没有具有该语法的数据结构.

您可以在数组中放入两个值,并在对象中返回数组或两个值并返回该对象.

然后,当您调用该函数时,您必须将结果分配给某些东西才能使用返回的结果.

这是返回数组的一种方法:

function getValues(){
    var num1 = document.getElementById("firstNum").value;
    var num2 = document.getElementById("secondNum").value;
    // return array of two values
    return [num1, num2];
}

function add(){
   // get values and assign the returned array to a local variable named values
   var values = getValues();
   return parseFloat(values[0]) + parseFloat(values[1]);
}

或者,您可以将两个值都放入具有命名属性的对象中:

function getValues(){
    var num1 = document.getElementById("firstNum").value;
    var num2 = document.getElementById("secondNum").value;
    // return array of two values
    return {firstNum: num1, secondNum: num2};
}

function add(){
   // get values and assign the returned array to a local variable named values
   var values = getValues();
   return parseFloat(values.firstNum) + parseFloat(values.secondNum);
}

对象语法更具描述性和冗长,因为每个属性都有一个相关的名称,而不仅仅是一个数字索引,但它也不那么紧凑.在这种特殊情况下,您可以使用对象或数组.

ES6解构更新

在数组或对象中返回两个值时,您还可以使用ES6语法缩短代码来执行此操作.例如,在返回对象时,您可以使用简写语法将属性名称指定为与变量相同的名称,如下所示:

return {num1, num2};

这实际上返回一个像这样的对象:

{ num1: num1, num2: num2 }

然后,当您调用该函数时,可以使用解构将两个值分配给变量:

function getValues(){
    var num1 = document.getElementById("firstNum").value;
    var num2 = document.getElementById("secondNum").value;
    // return array of two values
    return {num1, num2};
}

let {num1, num2} = getValues();
console.log(num1);
console.log(num2);

或者,您可以使用与数组类似的解构:

function getValues(){
    var num1 = document.getElementById("firstNum").value;
    var num2 = document.getElementById("secondNum").value;
    // return array of two values
    return [num1, num2];
}

let [num1, num2] = getValues();
console.log(num1);
console.log(num2);