자바 스크립트에서 const와 const {}의 차이점은 무엇입니까
전자를 공부할 때 BrowserWindow 객체를 얻는 두 가지 방법을 찾았습니다.
const {BrowserWindow} = require('electron')
과
const electron = require('electron')
const BrowserWindow = electron.BrowserWindow
const
와 const {}
JavaScript 의 차이점은 무엇입니까 ?
const {}
캔이 작동 하는 이유를 이해할 수 없습니다 . JS에 대해 중요한 점이 있습니까?
두 코드는 동일하지만 첫 번째 코드는 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);
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 할당을 사용할 수 있습니다. 즉, 객체가 obj 객체에 20 개의 필드를 포함하는 경우 다음과 같이 사용하려는 필드의 이름을 작성하면됩니다.
const { email,title } = obj;
이것은 ES6 구문이 더 간단한 것입니다.에서 이메일과 제목을 자동으로 할당 obj
하며 필수 필드에 이름 만 올바르게 지정해야합니다.
이것은 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);
결국 보셨 듯이 기능은 동일합니다. 단순히 객체에서 속성을 가져 오는 것입니다.
There is also more to destructuring assignment - you can check the entire syntax in MDN: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment
'development' 카테고리의 다른 글
STL 캐릭터 특성의 요점은 무엇입니까? (0) | 2020.10.16 |
---|---|
Angularjs를 사용하려면 node.js가 필요합니까? (0) | 2020.10.16 |
Java에서 중괄호는 그 자체로 무엇을 의미합니까? (0) | 2020.10.16 |
줄의 n 번째 기호로 이동 (0) | 2020.10.16 |
여러 인수를 사용하는 명시 적 생성자 (0) | 2020.10.16 |