{"componentChunkName":"component---src-templates-blog-post-js","path":"/javascript/es6-객체-표현식/","result":{"data":{"site":{"siteMetadata":{"title":"Bottlehs Tech Blog","description":"웹·앱·AI 개발자 전병훈(bottlehs)의 기술 블로그. AI·LLM, JavaScript·Vue, Spring Boot, 알고리즘, 블록체인 실무 가이드를 다룹니다","siteUrl":"https://www.bottlehs.dev","author":{"name":"Jeon Byung Hun","summary":"개발을 즐기는 bottlehs - Engineer, MS, AI, FE, BE, OS, IOT, Blockchain, 설계, 테스트"},"social":{"github":"bottlehs","codepen":"bottlehs"}}},"markdownRemark":{"id":"103d1600-40f8-59c8-aca4-01e7024a7f0d","excerpt":"ES6 객체 표현식 ES6에서는 더욱 동적이고 간단하게 객체를 생성하고 할당하는 표현식을 제공한다. 만약, 객체의 속성을 변수명과 같은 속성명으로 설정하려면 이를 간단하게 표현할 수 있다. 예를 들어, 아래 코드1과 같은 객체가 있다면, 코드…","html":"

\"ES6

\n

ES6에서는 더욱 동적이고 간단하게 객체를 생성하고 할당하는 표현식을 제공한다. 만약, 객체의 속성을 변수명과 같은 속성명으로 설정하려면 이를 간단하게 표현할 수 있다.

\n

예를 들어, 아래 코드1과 같은 객체가 있다면, 코드2 와 같이 간단하게 설정이 가능하다.

\n
// 코드1\nconst coffee1 = \"coffee1\"\nconst coffee2 = \"coffee2\"\n\nconst obj = {\n  coffee1: coffee1,\n  coffee2: coffee2,\n}
\n
// 코드2\nconst obj = {\n  coffee1,\n  coffee2,\n}
\n

또한, 함수를 정의할 시에 function 키워드를 생략하고 getter 및 setter를 설정하는 것을 키워드를 통해 간단히 구현할 수 있다. 이는 속성명 앞에 get과 set을 붙여서 이용한다.

\n
const coffeeFunc = {\n   func() {\n      console.log(\"new function\");\n   }\n   _name: \"coffeeFunc\",\n   get name() {\n      return this._name;\n   },\n   set name(name) {\n      this._name = name;\n   }\n};
","tableOfContents":"","wordCount":{"words":62},"fields":{"slug":"/javascript/es6-객체-표현식/","image":"/assets/es6.png","faq":[]},"frontmatter":{"title":"ES6 객체 표현식","date":"2020년 12월 13일","dateISO":"2020-12-13T19:15:26.956Z","updatedISO":null,"category":"javascript","description":"ES6에서는 더욱 동적이고 간단하게 객체를 생성하고 할당하는 표현식을 제공한다. 만약, 객체의 속성을 변수명과 같은 속성명으로 설정하려면 이를 간단하게 표현할 수 있다.","tags":["ES6","객체 표현식","JavaScript","ECMAScript6"]}}},"pageContext":{"slug":"/javascript/es6-객체-표현식/","previous":{"fields":{"slug":"/javascript/es6-임포트-import-와-익스포트-export-모듈/"},"frontmatter":{"title":"ES6 임포트(import)와 익스포트(export) 모듈","tags":["ES6","임포트(import)","익스포트(export)","JavaScript","ECMAScript6"]}},"next":{"fields":{"slug":"/javascript/es6-map-set/"},"frontmatter":{"title":"ES6 Map & Set","tags":["ES6","Map & Set","JavaScript","ECMAScript6"]}}}},"staticQueryHashes":["213619243","3262363727"]}