qual è la differenza tra const e const {} in javascript

Quando studio l'elettrone, ho trovato 2 modi per ottenere l'oggetto BrowserWindow.

const {BrowserWindow} = require('electron')

e

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

Qual è la differenza tra conste const {}in JavaScript?

Non riesco a capire perché la const {}lattina funzioni. Mi manca qualcosa di importante su JS?

Le due parti di codice sono equivalenti, ma la prima utilizza l' assegnazione di destrutturazione ES6 per essere più breve.

Ecco un rapido esempio di come funziona:

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

const {BrowserWindow} = require('electron')

La sintassi sopra utilizza ES6. Se hai un oggetto definito come:

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

Ora, se vogliamo assegnare o utilizzare l'email e il campo del titolo di obj, non dobbiamo scrivere l'intera sintassi come

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

Questa è vecchia scuola adesso.

Possiamo usare l' assegnazione di destrutturazione ES6 cioè, se il nostro oggetto contiene 20 campi nell'oggetto obj, allora dobbiamo solo scrivere i nomi di quei campi che vogliamo usare in questo modo:

const { email,title } = obj;

Questa è una sintassi ES6 più semplice Assegnerà automaticamente e-mail e titolo da obj, solo il nome deve essere dichiarato correttamente per il campo richiesto.

Questa è una delle nuove funzionalità di ES6. La notazione delle parentesi graffe è una parte del cosiddetto destructuring assignment. Ciò significa che non è più necessario ottenere l'oggetto stesso e assegnare variabili per ciascuna proprietà desiderata su righe separate. Puoi fare qualcosa come:

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

Come hai visto alla fine, la funzionalità è la stessa: ottenere semplicemente una proprietà da un oggetto.

C'è anche altro nell'assegnazione destrutturante: puoi controllare l'intera sintassi in MDN: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment