Front-end12 Instance / Component 사실 인스턴스라는 이야기는 객체지향 공부를 하면서 많이 듣고 알고있는 내용이다. 근데 vue에서의 insttace 와 자바스크립트의 instance 의 내용은 똑같다고 보면 된다!.. # Instance new Vue(); console창에 Vue라는 인스턴스를 만들게 되면 미리 정의되어 있는 속성과 메소드 (API) 가 있기 때문에 이 기능들을 이용해서 빠르게 개발이 가능합니다! 인스턴스에서 사용할 수 있는 속성과 API는 다음과 같습니다. new Vue({ el : , template : , data : , methods : , created : , watch : , .... }); el : 인스턴스가 그려지는 화면의 시작점 (특정 HTML 태그) template : 화면에 표시할 요소 (HTML, .. 2019. 12. 26. Vue VUE 란 ? ' MVVM 패천의 뷰모델 레이어에 해당하는 화면(View)단 라이브러리 ' 간단하게 설명을 하자면 view의 키보드 입력 이라던지 마우스 click 등의 이벤트를 VUE DOM listeners가 청취하게 된다. 이러한 이벤트를 잡아서 javaScript에 있는 데이터를 바꿔주거나 지정했던 특정 로직에서 실행을 한다! javaScript의 데이터가 변경되었을때 Data Bindings 를 통해서 화면에 반영 됩니다!! 기존의 개발 그러나 이런걸 Vue 의 Reactivity로 구현하자면 Reactivity는!! 데이터의 변화를 라이브러리에서 감지해서 화면을 구성을 해준다 2019. 12. 26. 비동기 처리(Promise 객체) 저번시간에 배웠던 콜백 함수! 권장하지 않는 방법이다. 요새 많은 사람들이 사용하는 Promise 에 대해서 공부해 보자! 왜 Promise가 필요한가? ajax가 서버에다 데이터 하나만 주세요 라는 요청을 보낸다. 그런데 데이터를 받아오기도 전에 마치 데이터를 다 받아온 것 처럼 화면에 데이터를 표시하려고 하면 오류가 발생하거나 빈 화면이 뜬다. 이러한 문제점을 해결하기 위한 방법중 하나가 프로미스이다!! 간단한 예를 통해서 설명을 해보겠습니다. function getData(callbackFunc) { $.get('url 주소/products/1', function (response) { callbackFunc(response); // 서버에서 받은 데이터 response를 callbackFunc().. 2019. 12. 18. 비동기 처리(Callback hell) 비동기 처리? function getData() { var tableData; $.get('URL', function(response) { tableData = response; }); return tableData; } console.log(getData()); 위 코드의 정답은 무엇인가? 바로 대답한다면 비동기 처리를 좀 아시는 분이군요~ 정답은 return 으로 undefined가 출력이 된다는 것이다 즉 비동기 처리를 하면 특정 코드의 연산이 끝날 때까지 코드의 실행을 멈추지 않고 다음 코드를 먼저 실행하는 특성을 가진다!!! 그렇기 때문에 데이터를 아직 가져오지 못했는데 리턴 해버려서 undifined가 출력 되는 것이다!! 나 또한 웹프로젝트를 하면서 어떨때는 return값이 잘 가지고 오다가.. 2019. 12. 17. 이전 1 2 3 다음
