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

Question 1

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

const {BrowserWindow} = require('electron')

а также

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

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

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

Question 2

Два фрагмента кода эквивалентны, но первый использует назначение деструктуризации 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);

Развернуть фрагмент

Question 3

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, просто имя должно быть правильно указано в обязательном поле.

Question 4

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