바닐라(vanilla-js) JS를 공부해봅시다 - 21. 함수를 정의할 수 있어야한다. -> function 을 붙힘으로써 함수를 정의할 수 있다. 여기서 함수는 "기능"을 말한다.ex) function hello(){console.log("안녕");}hello(); ==> 안녕hello("hello my name"); ==> 안녕왜 hello() 함수안에 "hello my name"이라고 썻는데 안녕이 출력이 될까??? * 오늘의 단어는 argument (인자)ex) hello("괄호안에 쓰는 것이 인자"); 2. 함수에게 외부 데이터를 줄 수 있어야한다. ( 1번에 대한 이유도 함께 보자 ) argument는 변수와 같은 것.ex) function hello(hihihihi){console.log(..
JS Array VS Object 배열과 객체(Object)의 차이 예를들어,배열 선언은 ex) const info = ["book", "read"]; ////// Object 선언은 const info = {"book", "read"} 이라할 때, Object로 선언한 info를 console.log로 찍어보면 SyntaxError: Unexpected token 에러가 뜬다. 즉, Object를 배열처럼 {} 안에다가 "" , "" 로 선언할 수 없다는 뜻.참고로 배열은 [] 괄호로, Object는 {}로 사용한다. Object는 실제 객체를 만드는 것.ex) const info = {name:"park",gender:"male"}이렇게 변수와 값을 넣어주고 console.log(info)를 찍어보면..
JS배열 - 손쉽게 코딩하기 배열 선언에 대해 보면 const days = [];이런식으로 선언을 한다. 배열에 직접 값을 넣어서 출력해주려면 ex) days = ["mon", "tue"]; console.log(days); 를 하게되면 콘솔에는 ["mon", "tue"] 이렇게 찍히게됨. 근데 우리는 "tue" 만 찍고 싶다. 그러면 우리는 console.log(days[1]); 이렇게 찍으면 된다. 그런데 왜 days[1] days안에다가 1을 찍어??? "tue는 2번째에 있는데... 배열에서 인덱스는 0부터 시작을 하기 때문에 mon의 순서는 0번째, tue의 순서는 1번째가 된다. 만약에 days[] 안에다 321을 넣으면 days[321] => "undefined" 가 나오게 된다. * 배열에..
바닐라 JS - 순수 JavaScript우리가 라이브러리를 경험하기 전에 꼭 거쳐가야하는 중요한 스크립트- 라이브러리를 먼저 거쳐서 코딩을 하게 될 경우, 라이브러리에 극 의존하는 개발자가 될 것이라고 한다. 1. console.log가 무엇인지 알아야한다.=> 자바에서 값을 확인할 때에는 System.out.print를 사용을 하지만, JS에서는 console.log를 이용해 값을 확인한다. 2. variable이 무엇인지 알아야한다. 3. 모든 변수 선언을 한 후에 ; (세미콜론)을 해줘야 끝이난다. 3-1. 변수를 사용할 때, 생성 - 초기화 - 사용 순으로 하면 된다.ex) a = 221; ///// => a 변수를 생성하고 221로 초기화를 하였다. 4. constants가 무엇인지 알아야한다...
[JavaScript]let, const, var의 차이 기본예제 - 1 1234567let a = 1; const b = 2; a = 4; console.log(b, a);cs 위에서 let으로 생성해준 변수 a는 기존에 1로 초기화 했던것을 4로 다시 초기화 시켜줄 수 있는 반면, const 변수 b는 상수라는 개념으로 "안정된" 이라는 뜻으로 생각하면 된다.w 즉, 다른 곳에서 값을 다시 초기화 해줄 수 없다. 기본예제 - 2 1234567const a = 221; let b = a-5; a = 4; console.log(b, a);cs 2번 예제를 실행시키면 이는 아래와 같은 오류가 난다. 12TypeError: Assignment to constant variable. at https://rep..
[JSP] c:if 로 값비교하기(JSTL, EL) - 손쉽게 코딩하기우리는 보통 JSTL안에서 EL태그를 사용할때 ~~~~~~ 값들어가는 부분 이런 식으로 사용을 합니다. 근데 간혹가다select 태그안에서 선택한 option이 보여지게 하려면 어떻게 할까요.( 보통 select 옵션 값을 선택하고 submit을 하게 되면 웹은 reload가 되면서 맨 처음 option으로 바뀌게 됩니다. ) ex) 년도로 따져봅시다. 1234567891011 년도 2019 2018 2017 2016Colored by Color Scriptercs 이런 select태그가 있다고 하죠.우리는 첫번째는 년도, 두번째는 2019, 세번째는 2018이고두번째 2019를 클릭하고 submit을 하면 reload가 되기때문에 화..
[JSP] 다중 배열checkbox 실시간 check값 확인하는방법 - 개인 기록 JS에서 12345678910111213141516171819$("input:checkbox[name^='AddrVOList'][name$='.group_id']").on("change", function(){ if($(this).is(":checked")){ $(this).prop("checked", true); alert($(this).val); $("#cancelReason").hide(); } else{ $(this).prop("checked", false); alert($(this).val); $("#cancelReason").show(); } });Colored by Color Scriptercs form안에서 ..
[SQL] ibatis iterator 사용방법 - 손쉽게 코딩하기 가끔 이런 문제가 생길때가 있다. 예를들어보자. 1) checkbox가 1,2,3,4 네개 일때, 1번부터 4번까지 다 체크하고 A테이블에 insert.2) 2,3 체크해제하고 1,4번만 A테이블에 insert.3) 2번에서 2,3번은 A테이블에서 삭제되어야하고 B테이블에 들어가야한다.4) 결국에는 A테이블에는 체크되어있는 1,4번이 남고B테이블에는 체크해제된 2,3번이 들어가야한다. 이런상황이 생겼을 경우 1)번 같은 경우는 단순 jsp에서 check된 파라미터를 배열로 넘기면 Controller에서 for문으로 insert처리를 하면 된다.(물론 vo에는 check된 놈을 받을만한 list vo가 있어야겟지) sql은 insert i..
[Java]이중루프, for문 빠져나가는 방법 우리가 흔히 자바에서 for문으로 이중 루프를 돌릴때, 조건에 맞으면 나가야 할 때가 있다. 그럴때 쓰는것이 바로 break; 예를 들어서 [단일 loop] for(int i= 0; i < a.length; i ++){ system.out.println(i);} 이렇게 했을때, a.length가 3일경우012이렇게 출력이 될텐데 나는 i가 1일때 이 for문에서 빠져 나가고 싶어. 할때 break를 걸어준다 예를들면, for(int i= 0; i < a.length; i ++){if(i = 1){ system.out.println(i); break;}}이렇게 사용하면 루프를 돌면서 i가 1일때 출력하고 조건이 맞으면 그만 돌릴래~~ 라는 뜻으로 1만 출력이 ..
Tomcat 에러 Removing obsolete files from server... Could not clean server of obsolete files: Content is not allowed in prolog. Content is not allowed in prolog. 프로젝트 import 받고 톰캣을 돌릴때 위와 같은 에러가 발생한다면 1. 이클립스 종료 2. 해당 프로젝트 workspace폴더 안에 있는 .metadata/.plugins/org.eclipse.wst.server.core 폴더로 들어가서tmp0, tmp1... 같은 폴더가 있는지 확인한다. 3. 저런 폴더가 있으면 삭제 후, 다시 이클립스 실행 서버를 돌려보면 실행이 되는 것을 확인할 수 있다. 도움이 되셧다면 공감과 광..
[jQuery] document.ready() - DOM 순서 우리가 jquery를 쓸때 제일 처음에 써주는 $(document).ready(function(){}); 이것은 $(function(){}); 이렇게 줄여서 사용할 수 있습니다. 이 그림을 먼저 보시죠 위에서 아래로 내려오는 순서입니다.브라우저가 웹문서를 읽기 시작하면DOM이 생성됩니다. 여기서 DOM이란,Document Object Model - 문서 객체 모델 문서는 HTML과 XML과 같은 것들을 문서라 하고이러한 문서를 구조적으로 표현하는 방식을 제공하는 것이 DOM이라고 합니다. w3school에서 제공하는 HTML DOM Tree 구조를 보면 출처 : https://www.w3schools.com/js/js_htmldom.asp 이..
[Eclipse] Ctrl+H 찾기창 File Search로 기본설정하는 방법 eclipse 상단 - window - Preferences - General - keys 캡처사진 처럼 입력 schema 아래 입력창에 file search 입력 Binding입력창에 Ctrl + H 입력하고 apply - ok 그리고 이클립스 창에서 Ctrl + H 입력하면 끝
코드 정적 분석 도구 - 린팅툴(linting tool): 린팅툴에는 유명한 PMD, FindBugs가 있고 sonarlint도 있다본격적으로 적용하려면 sonar qube-> 이클립스나 인텔리제이 플러그인으로 지원 IDE(통합 개발 환경)- Eclipse, IntelliJ, 넷빈즈 XP익스트림 프로그래밍- 관련도서 "익스트림 프로그래밍 소개" 페어 프로그래밍 TDD(테스트 주도 개발) 메서드 체이닝 - 자바스크립트 기술 중 하나. JS객체의 메서드를 줄줄이 이용한다는 뜻. 이벤트 전달 - 이벤트 발생순서 이벤트 버블링 - 자식 노드에서 부모 노드 순으로 이벤트 실행 이벤트 캡처링 - 부모 노드에서 자식 노드 순으로 이벤트 실행 ( 쓰이지 않음 - 익스가 호환이 안됨 ) CDN(Content Delive..
[CSS&JSP] zoom 사용하기화면을 크게 보고 싶거나 작게 보고싶을때 우리는 웹화면크기를 늘렸다 줄였다하는 기능을 구현해야한다.(당연한 소리!!) 물론'Ctrl' + '+' 나 'Ctrl' + '-' 를 사용해서 화면을 키웟다 줄였다 하면 정말 편하다. 하지만 우리는 고객의 기능을 만들어 줘야하는 입장이라 alert으로 alert("확대는 Ctrl + +를 눌러주세요"); 라고 할 수도 없는 판...이랬다간 바로 수정요청이 들어올 것 이다ㅋㅋㅋㅋㅋㅋㅋ 뒷 말 안나오게 쉽게 화면 zoom 기능을 구현해보자내가 화면 확대하고 줄이고 싶은 부분에 태그로 감싸서 영역을 만들어 준다던지 태그 밑에 태그로 감싸던지 자신의 취향껏 영역을 만들어준다. 내가 한 방식은 section 태그 밑에 div로 ul태그를 ..
페이스북 공유하기 (SNS 공유하기) 페이스북 아이콘을 클릭하여 공유하는 방법입니다.먼저 스크립트부터 보면 SNS.facebook(link, title)에 다가 link와 title을 넣어줘야겠죠link와 title을 url이 읽을 수 있도록 인코드 시킨 후 url변수에 facebook 링크 뒤에 추가했습니다. link와 title 넣어주는 방법은 아래와 같습니다.snsSubmit메소드 기능을 보면 type과 title을 받아서 type이 트위터인지 페이스북인지 조건을 검사한 후, SNS.sns메소드명(currentUrl, title)을 넣어줍니다.여기서 또 currentUrl(현재url) 은 어떻게 가져왔을까요이런식으로 jQuery(location).attr('href')로 현재 url의 주소를 가져와..