본문 바로가기

Programming/[Java Script]

(9)
[Java Script] ES6 문법 정리 ES의 정의 ES는 에크마스크립트의 줄임말 보통 자바스크립트 중에서 es6이상을 모던 자바스크립트라고 함 ES5와 ES6의 차이점 es5는 프로토타입방식으로 작성하고, es6는 클래스방식으로 작성 es6의 클래스도 그 속을 보면 프로토타입으로 컴파일러가 이해 es6는 바벨이라는 폴리필이 있기 때문에, 바벨로 컴파일하면 하위버전으로 호환가능한 코드로 변환해 줌 const/let 블록 스코프 var의 변수스코프는function단위,const/let은block단위,const는 상수,let는 변수 1 2 3 4 5 6 7 8 jafunction foo() { let a = 1 if (true) { let a = 2 console.log(a) // 2 } console.log(a) // 1 } cs 템플릿 / 백..
[Java Script] HTTP 폴링, 롱폴링 최근에는 실시간 웹 어플리케이션 개발이 다양한 서버 측 푸시 기술을 시뮬레이션하는 폴링이란 기술을 주축으로 이뤄진다. 그중에 가장 대중적인 기술은 코멧인데 이 기술은 기본적으로 클라이언트로 메시지를 전달할 때까지 HTTP 응답을 지연시킨다. 폴링 - 주기적인 시간마다 클라이언트가 서버로 요청을 동기적으로 호출해서 사용 가능한 정보가 있는지 알아낸다. 요청을 주기적인 간격으로 이뤄 지며 클라이언트는 정보가 있든 없든 응답을 받는다. 구체적으로 말해, 정보가 있으면 서버는 그 정보를 송신하고 정보가 없으면 서버는 부정적인 응답을 반환하고 클라이언트는 연결을 닫는다. - 폴링은 메시지가 전달되는 간격을 정확히 알고 있을 때 적절한 해결책이다. 왜냐하면 서버에 정보가 있음을 알고 있어야만 클라이언트를 동기화해서..
[Java Script] 자바스크립트 정규식 전자우편 주소: /^[a-z0-9_+.-]+@([a-z0-9-]+\.)+[a-z0-9]{2,4}$/ URL: /^(file|gopher|news|nntp|telnet|https?|ftps?|sftp):\/\/([a-z0-9-]+\.)+[a-z0-9]{2,4}.*$/ HTML 태그 - HTML tags: /\]+)\>/ 전화 번호 - 예, 123-123-2344 혹은 123-1234-1234: /(\d{3}).*(\d{3}).*(\d{4})/ 날짜 - 예, 3/28/2007 혹은 3/28/07: /^\d{1,2}\/\d{1,2}\/\d{2,4}$/ jpg, gif 또는 png 확장자를 가진 그림 파일명: /([^\s]+(?=\.(jpg|gif|png))\.\2)/ 1부터 50 사이의 번호 - 1과 50 포..
[Java Script] Ajax Ajax Asynchronous JavaScript and XML 비동기적인 웹 애플리케이션 제작 표현 정보를 위한 HTML, CSS 동적인 화면 출력 및 표시 정보와의 상호작용을 위한 DOM, 자바스크립트 웹 서버와 비동기적으로 데이터를 교환하고 조작하기 위한 XML, XSLT, XMLHttpRequest 함께 사용하는 기술의 묶음을 지칭 필요한 데이터만을 웹 서버에 요청해 받은 후 클라이언트에서 데이터에 대한 처리를 할 수 있다. 웹 서버에서 전적으로 처리되던 데이터 처리의 일부분이 클라이언트 쪽에서 처리 되므로 웹 브라우저와 웹 서버 사이의 데이터 량과 처리량이 줄어 들기에 응답성이 좋아짐 장점 - 페이지 이동없이 고속으로 화면 전환 - 서버 처리를 기다리지 않고, 비동기 요청 가능 - 수신하는 데..
[Java Script] 회원가입 창(유효성 검사) 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 12..
[Java Script] 이미지 일정 시간이후 변경 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 var imgArray = new Array(); imgArray[0] = "01.jpg"; imgArray[1] = "02.jpg"; imgArray[2] = "03.jpg"; imgArray[3] = "04.jpg"; function showImage() { var imgNum = Math.round(Math.random() * 3); var objImg = document.getElementById("introImg"); objImg.src = imgArray[imgNum]; setTimeout("showImage()", 200); } Colored by Color Script..
[Java Script] 만년달력 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 만년 달력 var today = new Date(); // 오늘 날짜 function prevCalendar() { // 이전 달을 today에 값을 저장하고 달력을 뿌려줍니다. today = new Date(today.getFullYear(), today.getMonth() - 1, today.getDate()); buildCalendar(); } functi..
[Java Script] 공학 계산기 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 var flag = false; function input(num) { if (fl..