NodeJS JavaScript中const和const {}的区别是什么

xpcnnkqh  于 2023-03-07  发布在  Node.js
关注(0)|答案(4)|浏览(351)

当我学习电子的时候,我发现了两种获取BrowserWindow对象的方法。

const {BrowserWindow} = require('electron')

以及

const electron = require('electron')
const BrowserWindow = electron.BrowserWindow

JavaScript中constconst {}的区别是什么?
我不明白为什么const {}可以工作。我错过了关于JS的重要内容吗?

pbossiut

pbossiut1#

这两段代码是等效的,但第一段代码使用的ES6 destructuring assignment更短。
下面是一个简单的例子来说明它是如何工作的:

const obj = {
  name: "Fred",
  age: 42,
  id: 1
}

//simple destructuring
const { name } = obj;
console.log("name", name);

//assigning multiple variables at one time
const { age, id } = obj;
console.log("age", age);
console.log("id", id);

//using different names for the properties
const { name: personName } = obj;
console.log("personName", personName);
agxfikkp

agxfikkp2#

const {BrowserWindow} = require('electron')

以上语法使用ES6。如果将对象定义为:

const obj = {
    email: "hello@gmail.com",
    title: "Hello world"
}

现在,如果我们想分配或使用obj的email和title字段,那么我们不必编写整个语法,如

const email = obj.email;
const title = obj.title;

这就是老派

我们可以使用ES6结构化赋值,即如果我们的对象在obj对象中包含20个字段,那么我们只需要像这样写入我们想要使用的字段的名称:

const { email,title } = obj;

这是ES6语法-更简单的语法它将自动从obj分配电子邮件和标题,只需为必填字段正确说明名称。

w8biq8rn

w8biq8rn3#

这是ES6中的一个新特性。花括号符号是所谓的destructuring assignment的一部分。这意味着,您不再需要获取对象本身并在单独的行中为每个属性分配变量。您可以执行以下操作:

const obj = {
  prop1: 1,
  prop2: 2
}

// previously you would need to do something like this:
const firstProp = obj.prop1;
const secondProp = obj.prop2;
console.log(firstProp, secondProp);
// etc.

// however now you can do this on the same line:
const {prop1, prop2} = obj;
console.log(prop1, prop2);

正如您在最后看到的,功能是相同的-只是从对象获取属性。
还有更多关于解构赋值的内容--你可以检查MDN中的整个语法:https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment

vbopmzt1

vbopmzt14#

其他的答案已经足够好了,我会建议Destructuring assignment的一些有用的特性

    • 首先,让我们看一下以下定义:**

解构赋值语法是一个JavaScript表达式,它使unpack values from arrays, or properties from objects, into distinct variables成为可能。

    • 特点:**

1.* 解构数组,数组中每个项的索引充当属性(由于 * Array是JavaScript中的对象

> const {0: first, 1: second} = [10, 20]
console.log(first);   // 10
console.log(second);  // 20

1.* 与Spread ...运算符组合 *

> {a, b, ...rest} = {a: 10, b: 20, c: 30, d: 40}
console.log(a); // 10
console.log(b); // 20
console.log(rest ); // {c: 30, d: 40}

1.* 默认值 *

const {a = 10, b = 20} = {a: 1};

console.log(a); // 1
console.log(b); // 20

1.* 分配给新变量名 *

const {p: a, q: b} = {p: 10, q: 20};

console.log(a); // 10
console.log(b); // 20

相关问题