frontend

Vue.js

ES6 STEP 1 - 기본 문법

★ 호스이팅 변수의 선언을 스코프의 최상단으로 옮기는 행위 var console.log(A1); var A1 = "hello"; var는 if문이나 for문의 중괄호 {}, 에 의한 블록 수준의 유효 범위를 제공하지 않는다. 호이스팅 단계에서 이미 변수가 생성되어 있다면, 변수를 생성하지 않고 건너뛴다. var A1 = 100; console.log(A1); var A1 = 'hello'; console.log(A1); 동일한 이름의 변수가 생성되어 오류가 발생할 것 같지만 오류 X ★ ES6 1. let 이러한 문제를 해결하기 위해 let 키워드를 지원 let msg = "GLOBAL"; function outer() { let msg = "OUTER"; console.log(msg); if(true)..

Vue.js

Vue.js STEP 4 - 기본 문법 2

6. 이벤트 연결 v-on : 해당 디렉티브를 사용해 이벤트 메소드와 연결할 수 있다. 1씩증가 {{ count }} 한번만 클릭 가능 {{ text }} 10씩증가 {{ tenCount }} 1씩 증가, 한번 클릭, 10씩 증가 7. 조건문 v-if, v-else-if, v-else v-if 를 사용해서 프로퍼티를 이용해 조건을 주어 HTML을 표현할 수 있다. one two three one check two check three check 조건문에 따른 실행 결과 8. 반복문 v-for : 배열로 이루어진 프로퍼티를 반복적으로 표현할 때 사용한다. {{ item }} {{ key }} : {{ value }} {{ item.a}} : {{ item.b }} : {{ item.c }} add dele..

Vue.js

Vue.js STEP 3 - 기본 문법

Vue 인스턴스 Vue 인스턴스에서 제공되는 옵션을 붙여 개발 할 수 있다. el : id를 찾는 함수 data : 값을 넣을 데이터 {{ myText }} 2. 데이터 표시 {{데이터}} v-text : 프로퍼티 html에 표현할 때는 {{ 프로퍼티 이름}} 형식으로 표현 v-html : HTML로 표현 {{ myText }} v-text와 {{myText}는 프로퍼티 텍스트를 그대로 출력하지만, v-html은 HTML로 표현된다. 3. 데이터 종류 Vue에서 데이터 타입은 숫자형, 문자형, Boolean이 있다. 데이터 종류 {{ myPrice * 1.08 }} {{ "안녕하세요~" + myName + "님"}} {{ myName.substr(0,1) }} 배열 오브젝트 배열,오브젝트 {{ myArr..

Server

AJAX STEP 6 - 다양한 전송 방법

★ 데이터 송수신 ■ 필요 파일들 - com.test.ajax > "Ex10.java" - views > "ex10.jsp" - com.test.ajax > "Ex10Data.java" ■ 소스코드 Ex10.java package com.test.ajax; import java.io.IOException; import javax.servlet.RequestDispatcher; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servl..

IT의 큰손
'frontend' 태그의 글 목록 (2 Page)