본문 바로가기

분류 전체보기232

001. Java의 기본 자료구조(reverse) reverse 진행 과정 먼저 역순으로 출력하기전에 어떤식으로 진행하는지 보겠습니다. 1 2 3 4 5 먼저 이렇게 생긴 배열이 있습니다. 맨앞에 있는 1과 5를 교환하면 아래와 같이 변합니다. 5 2 3 4 1 또 한번 교환 시키면 역순으로 만들어 진 것을 확인할 수 있습니다. 5 4 3 2 1 여기서 알 수 있는점은 교환 횟수는 배열의 크기/2 이며 i번째 배열과 (배열의 크기-i)번째값이 교환되는 것을 확인할 수 있습니다. 두 값의 교환 메소드 두 값을 교환 하기 위해서는 임시 저장 공간을 통한 교환 과정이 필요합니다. 진행 과정은 아래와 같습니다. 1. t = a[x] 2. a[x] = a[y] 3. a[y] = t 그러면 아래와 같은 메소드를 만들 수 있습니다. static void swap(i.. 2020. 1. 6.
000. Java의 기본 자료구조(배열) 배열 배열의 선언 먼저 배열을 선언 할때는 아래와 같이 선언합니다. int[] x;// 선언하기 x = new int[3];// 참조하기 x[0]=1; x[1]=5; x[2]=7; 각 요소들을 출력하기 위해서는 배열의 크기만큼 출력하기 위해 x.length를 사용합니다. for(int i=0;i 2020. 1. 6.
004. 상 하위 컴포넌트 관계 상하위 컴포넌트 관계 하위 컴포넌트에서는 상위 컴포넌트로 이벤트만 전달합니다. 상위 컴포넌트에서 하위 컴포넌트로는 props만 전달합니다. ※ props속성 : 상위 컴포넌트에서 하위 컴포넌트로 데이터를 전달할 때 사용하는 속성 props 속성 정의 하는 방법 Vue.component('child-component',{ props : ['props 속성 이름'] }); 상위 컴포넌트의 HTML 코드에 등록된 child-component 태그에 v-bind속성을 추가한다. 예제 코드 html을 확인하면 이런값이 나오는 것을 확인 할 수 있습니다. 하위 컴포넌트에서 상위 컴포넌트로 이벤트 전달하기 $emit( )을 이용하여 이벤트를 발생합니다. this.$emit('이벤트명'); v-on: 속성을 이용한 이.. 2019. 11. 21.
003. 뷰 컴포넌트(Component) 컴포넌트란? 컴포넌트란 조합하여 화면을 구성할 수 있는 블록입니다. 화면의 영역을 컴포넌트로 쪼개서 재활용할 수 있는 형태로 관리합니다. 코드를 재사용하기 편리합니다. 컴포넌트 간의 관계는 자료구조의 트리(Tree)모양과 유사합니다. 지역 컴포넌트 vs 전역 컴포넌트 지역컴포넌트 특정 인스턴스에서만 유효한 범위를 갖습니다. 전역 컴포넌트 여러 인스턴스에서 공통으로 사용할 수 있습니다. 뷰로 접근 가능한 모든 범위에서 사용할 수 있습니다. 컴포넌트 등록하기 전역컴포넌트 Vue 변수를 이용하여 등록합니다. Vue.component( )를 호출하여 수행합니다. 형식은 아래와 같습니다. 전역 컴포넌트 표시 전역 컴포넌트를 활용한 예시 코드 컴포넌트 등록 지역 컴포넌트 인스턴스에 components속성을 추가합니.. 2019. 11. 21.
002. Vue의 라이프 싸이클 뷰 인스턴스 라이프 사이클 1. 인스턴스 생성 new Vue( ) 이벤트 및 라이프 사이클 초기화 → beforeCreate → 화면에 반응성 주입 → created → el, template 속성 확인 → template 속성 내용을 render로 변환 → beforeMount → $el 생성 후 el속성 값을 대입 → mounted 2. 인스턴스를 화면에 부착 인스턴스의 데이터 변경 → beforeUpdate → 화면 재 렌더링 및 데이터 갱신 → updated 3. 인스턴스 내용 갱신 인스턴스 접근 가능 → beforeDestoroy → 컴포넌트, 인스턴스, 디렉티브등 모두 해제 → destroyed → 인스턴스 소멸 4. 인스턴스 소멸 (끝) 각 분기 자세한 설명 beforeCreate 인스턴스가.. 2019. 11. 21.
001. Vue.js CDN을 통해 Vue.js 체험 및 뷰 속성 개념 Hello Vue.js 출력하기 CDN : https://cdn.jsdelivr.net/npm/vue/dist/vue.js {{message}} Vue인스턴스를 새로 생성한 후 data에 message 값을 넣어 위쪽 id="app"엘리먼트를 통해 {{message}}값을 전달합니다. 여기서 뷰 인스턴스 생성자 new Vue( ) 일때 Vue( ) Vue.js 라이브러리를 로딩하고 나면 접근 가능합니다. 사용하는 이유는 필요한 기능들을 미리 정의해 놓고, 사용자가 재정의 하여 편리하게 사용하기 위해입니다. 생성자란? 자주사용하는 옵션과 기능들을 미리저장 기존에 포함된 기능과 더불어 기존 기능을 확장하여 사용 객체 지향 프로그래밍의 객체 정의 방식 뷰 인스턴스 옵션 속성 data, el, template .. 2019. 11. 21.