객체 분해(destructuring) 구문

`const { aaa } = this;` 코드는 JavaScript 또는 Vue.js에서 객체 분해(destructuring) 구문을 사용하는 코드입니다. 이 코드는 현재 객체에서 `aaa`라는 속성을 추출하여 새로운 변수 `aaa`에 할당하는 역할을 합니다.

여기에서 `this`는 현재 실행 중인 함수 또는 컨텍스트를 나타내는 JavaScript의 특별한 키워드입니다. Vue.js 컴포넌트 내에서 `this`는 현재 컴포넌트 인스턴스를 가리키며, 컴포넌트 내에서 선언된 데이터, 메서드, 계산된 속성 등에 접근할 수 있게 해줍니다.

예를 들어, Vue.js 컴포넌트 내에서 다음과 같이 사용될 수 있습니다:

<template>
  <div>
    <p>{{ aaa }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      aaa: 'Hello, World!'
    };
  },
  created() {
    const { aaa } = this;
    console.log(aaa); // 'Hello, World!'
  }
};
</script>



이 예제에서 `this`는 현재 Vue.js 컴포넌트 인스턴스를 가리키고 있으며, `const { aaa } = this;`를 사용하여 컴포넌트 내에서 `aaa` 속성의 값을 추출하여 `const`로 선언된 변수 `aaa`에 할당하고 있습니다. 따라서 `console.log(aaa);`는 "Hello, World!"를 출력합니다.

'┝ 개발 언어 > ┝ html_css_js' 카테고리의 다른 글

[js] 기본적인 배열 / 버퍼와 뷰  (1) 2023.10.16
[js] 배열 원소 다루기 : delete & splice  (0) 2023.10.16
[js] promise란  (0) 2023.07.26
[js] 콜백함수란  (0) 2023.07.26
script 태그 안의 async란  (0) 2023.07.07