在 ES12（ECMAScript2021）中，新增了一些语言特性，其中一个值得关注的特性是 Order of Evaluation。在以前的 ECMAScript 版本中，调用函数参数的顺序通常是从左到右进行的，但是在新版 ECMAScript 中，这种顺序可能会发生变化，这就可能导致问题的发生。在这篇文章中，我们将探讨这个问题，并提供一些解决方案。
问题的本质
在旧版 ECMAScript 中，参数在调用函数之前就已经被计算好了。例如：
-------- --------- ----- - ------ ---- - ----- - --- ------ - ----- - -- ---
这个例子中，2*4 和 3 会在调用 add 函数之前被计算好，然后传递给函数。
然而，在新版 ECMAScript 中，这个顺序可能会有所不同。例如，考虑下面的代码：
-------- --------- ---- - ----- - ------ ---- - ----- - --- ------ - -------
在这个例子中，我们给 add 函数传递了一个参数 2。但是，我们在定义函数时给 num2 设置了一个默认值，这个默认值是 num1。所以我们期望 add(2) 返回 4，因为 num1 是 2，num2 是 num1，所以 num2 也是 2，然后 2+2=4。
然而，在新版 ECMAScript 中，num2 的值是在调用函数时才被计算的。因此，num2 的值此时是 undefined，然后 num1+undefined=NaN。导致代码结果与我们的预期不一致。
上述例子让我们了解了 Order of Evaluation 问题的本质，以及新版 ECMAScript 中可能会出现的问题。
解决方案
现在，让我们看一下如何解决这个问题。我们可以采取以下几种方法：
显式地传递参数
最简单的解决方案是显式地传递参数。例如，我们可以改写 add 函数，把默认值改成一个不可能出现的值：
-------- --------- ---- - ----- -
-- ----- --- ----- -
---- - -----
-
------ ---- - -----
-
--- ------ - -------在这个例子中，如果 add 函数只传递了一个参数，那么 num2 就会被设置为 null。然后，我们可以在函数体内检查 num2 是否为空，如果为空则将其设置为 num1 的值。
使用逗号表达式
另一种解决方案是使用逗号表达式。逗号表达式是一个可以同时执行多个表达式的表达式。它的语法如下：
------------ ------------ ---- -----------
这个表达式会按顺序执行每个子表达式，最后返回最后一个子表达式的值。
因此，我们可以使用逗号表达式来确保参数的顺序：
-------- --------- ---- - ----- - ----- ------ - ------ ---- - ----- - --- ------ - -------
在这个例子中，我们将 num2 的默认值设置为 (temp = num1, temp)。这个表达式的意思是：先计算 temp = num1，然后返回 temp。这样，我们就可以在一个语句中计算 num1 的值并将其设置给 temp，然后 temp 的值就被传递给 num2。
使用解构
最后，我们可以使用解构语法来确保参数的顺序。解构是一种从数组或对象中取值的语法。例如，我们可以这样写：
-------- ----- ----- ---- - ---- -- - ------ ---- - ----- - --- ------ - ----- ----- - ---
在这个例子中，我们将 add 函数的参数改成了一个对象，这个对象有两个属性 num1 和 num2。然后我们可以在函数体内使用解构语法从这个对象中取出这些属性，并设置默认值。
结论
在新版 ECMAScript 中，调用函数参数的顺序可能会发生变化，这可能导致我们的代码与预期不一致。为了解决这个问题，我们可以采用显式传递参数、使用逗号表达式或使用解构等方法。希望这篇文章能够帮助你理解这个问题并提供一个解决方案。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/671e1d772e7021665ef5fb19