в чем разница между const и const {} в javascript

104

Когда я изучаю электрон, я нашел 2 способа получить объект BrowserWindow.

const {BrowserWindow} = require('electron')

а также

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

В чем разница между constи const {}в JavaScript?

Я не могу понять, почему это const {}может работать. Пропускаю ли я что-нибудь важное о JS?

Кевин00000000
источник

Ответы:

165

Два фрагмента кода эквивалентны, но первый использует назначение деструктуризации ES6, чтобы быть короче.

Вот краткий пример того, как это работает:

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);

ВЛАЗ
источник
Ваш ответ полезен. Мне очень трудно понять сайт разработчика Mozilla. Спасибо.
DavidHyogo
30
const {BrowserWindow} = require('electron')

Вышеупомянутый синтаксис использует ES6. Если у вас есть объект, определенный как:

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

Теперь, если мы хотим назначить или использовать адрес электронной почты и поле заголовка obj, нам не нужно писать весь синтаксис, например

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

Это старая школа.

Мы можем использовать назначение ES6 Destructuring, т.е. если наш объект содержит 20 полей в объекте obj, тогда нам просто нужно написать имена тех полей, которые мы хотим использовать, например:

const { email,title } = obj;

Это упрощенный синтаксис ES6. Он автоматически назначит адрес электронной почты и заголовок obj, просто имя должно быть правильно указано в обязательном поле.

Гаурав Сачдева
источник
18

Это одна из новых функций 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

Васил Динински
источник