JavaScript 中的多变量赋值

2023-03-12 02:35| 来源: 网络整理| 查看: 265

当前位置：主页 > 学无止境 > WEB前端 > WEB前端编程语言网络算法操作系统数据库 JavaScript 中的多变量赋值作者：迹忆客最近更新：2023/03/10 浏览次数：

本教程将解释 JavaScript 中的多个变量赋值，因为变量是我们编码中最重要的部分。

有时，我们必须做许多变量声明和赋值，因为它们具有相同的值。如何？让我们了解一下。

在 JavaScript 中使用 = 运算符分配多个变量

假设我们有 variable1、variable2 和 variable3，并且希望所有三个变量的值都为 1。

var variable1 = 1, variable2 = 1, variable3 = 1; console.log(variable1,variable2,variable3); //1,1,1 var variable1 = variable2 = variable3 = 1; console.log(variable1,variable2,variable3); //1,1,1

输出：

1, 1, 1 1, 1, 1

它们看起来是等价的，但事实并非如此。原因是变量的范围和赋值优先。

赋值运算符在 JavaScript 中是右关联的，这意味着它在解析最右边之后再解析最左边。

让我们再举一个例子来理解变量 scope 和赋值 precedence。

function test1() { var variable1 = 1, variable2 = 1, varialbe3 = 1; } function test2() { var varialbe1 = variable2 = varialbe3 = 1; } test1(); console.log(window.variable2); // undefined test2(); console.log(window.variable2); // 1. Aggh!

输出：

undefined 1

关注代码并看到 variable1、variable2 和 variable3 在函数范围内并且是 test1() 的局部。

它们在 test1() 方法之外不可用，这就是返回 undefined 的原因。这里，var variable1 = 1, variable2 = 1, varialbe3 = 1; 相当于 var variable1 = 1; var 变量 2 = 1; var varialbe3 = 1;。

现在，观察 test2() 函数。由于 var 关键字，variable1 在函数范围内，但 variable2 和 variable3 是泄露的，因为它们不是用 var 关键字编写的。

它们可以在 test2() 函数之外全局访问。请记住，变量声明只是提升。

然而，precedence 是 right-associative，这意味着 var variable1 = (window.variable2 =(window.variable3 = 1));。

这意味着 variable3 将首先分配给 1，然后 variable3 的值将分配给 variable2，最后 variable2 的值将分配给 variable1。

为了避免 test2() 中的变量泄漏，我们可以将变量声明和赋值分成两行。这样，我们可以将 variable1、variable2 和 variable3 限制在 test2() 函数范围内。

function test1() { var variable1 = 1, variable2 = 1, varialbe3 = 1; } function test2() { var variable1, variable2, variable3; variable1 = variable2 = variable3 = 1; } test1(); console.log(window.variable2); // undefined test2(); console.log(window.variable2); // undefined

输出：

undefined undefined 在 JavaScript 中使用带有 fill() 函数的解构赋值进行多变量赋值 function test() { var [a, b, c, d] = Array(4).fill(1); console.log(a,b,c,d) //1, 1, 1, 1 } test(); console.log(window.a); // undefined

输出：

1, 1, 1, 1 undefined

解构赋值有助于为多个变量赋值相同的值，而不会将它们泄漏到函数之外。

fill() 函数使用静态值更新所有数组元素并返回修改后的数组。你可以在这里阅读更多关于 fill() 的内容。

上一篇：在 JavaScript 中深度克隆对象

下一篇：为什么全局变量在 JavaScript 中给出未定义的值