개발공작소
728x90
반응형
article thumbnail
[Vue] 뷰 컴포넌트 메서드에서 Arrow Function을 사용하면 어떻게 될까? ( Enhanced Object property, this )
FrontEnd/Vue 2022. 3. 13. 04:01

예전에 this를 공부하면서 일반함수와 Arrow Function에서의 this가 다르다는 것을 배웠다. 그렇게 기억하고 있다가, 이번에 Vue 컴포넌트 코드를 작성하고 있는데, methods안에 메서드를 선언하는데 Arrow Function으로 작성하고 싶은 욕심이 생겼다.. 그래서 작성한 코드는 아래... 예제 import dummyData from './data.js'; // 더미데이터 import export default{ template : ` 테스트 `, data () { return { data : {} // 데이터 하나 선언 } }, mounted () { this.data = dummyData; // 마운트 되었을 때 더미데이터를 넣어줌.. }, methods () { getYoutub..

article thumbnail
[JS] ES6 : Arrow Function( 화살표형 함수 )에서의 this
FrontEnd/JavaScript 2022. 3. 2. 23:08

============================================================================ 저번 글에서 Arrow Function에 대해 간단한 문법에 대해 정리해보았는데, Arrow Funtion는 this를 가지지 않는다. 라는 말을 했었다. (지난글 참조) 근데 이게 정확히 무슨 말일까? 지금까지 진행해왔던 프로젝트는 Vue라이브러리와 ES5문법을 혼용해서 사용해왔는데, Vue인스턴스나 컴포넌트의 데이터를 this 키워드를 사용해서 가져왔었다. 예를 들면 아래와 같이.. 위와 같이 component를 생성하고 data객체에 This라는 String변수를 하나 만들었다. 그리고 mouted된 순간에 this키워드를 사용하여 This의 속성값을 콘솔에 찍어..

article thumbnail
[JS] ES6 : Arrow Function( 화살표형 함수 )에 대하여
FrontEnd/JavaScript 2022. 3. 1. 05:27

ES6가 릴리즈 되면서 여러 문법이 생겼지만, 역시 하이라이트는 Arrow Function이라고 생각한다 ( 개인적인 생각 ) 이제 ES6 공부도 해야하니, 가장 기본이 되는 Arrow Function을 공부해보려 한다. Arrow Funtion 특징 ============================================================================ 1. Arrow Funtion은 Function 키워드 대신, 화살표(=>)를 사용하여, 간략한 방법으로 함수를 선언할 수 있다. 2. this를 가지지 않는다. 3. arguments를 지원하지 않는다. 4. new와 함께 호출할 수 없습니다. 정도인데 (출처: 모던 자바스크립트), 내 생각에는 Arrow Funtion..

728x90
반응형