목록Javascript (15)
자바스크립트에서 정규식을 활용하여 특정 문자 이외의 입력이 들어오는것을 방지할 수 있습니다. 예전에 쓴 글에 정규식이 몇가지 있었지만, 너무 중구난방으로 되어있어서 정규식을 잘 활용할 수 있도록 다시 정리를 하였습니다. 이전글 : input text 입력 제한 기능 정리 1. 숫자만 체크하는 정규식 : /^[0-9]+$/ 2. 완성형 한글만 체크하는 정규식 : /^[가-힣]+$/ 3. 완성형 한글과 영문, 띄어쓰기를 체크하는 정규식 : /^[가-힣a-zA-Z\s]+$/ 4. 완성형 한글과 영문, 띄어쓰기를, 일부 특수기호(, - #)를 체크하는 정규식 : /^[가-힣a-zA-Z\s,-#]+$/ 기본 형태에 필요한 부분을 추가해 나가면 됩니다. 완성형 한글, 영문, 띄어쓰기만 입력이 되어야 하는 input..
예전에 Java의 POI 라이브러리를 활용하여 HTML 테이블을 엑셀로 출력하는 방법에 대해 포스팅 한 적이 있습니다. POI, JSON을 활용하여 HTML Table을 Excel 출력 하기 이번에는 서버 없이 순수 자바스크립트만으로 HTML 테이블을 엑셀로 출력하는 방법에 대해 포스팅하겠습니다. 이미 훌륭한 레퍼런스들이 많이 있었고 그 중 하나를 살짝 수정하여 사용하였습니다. 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354 function fnExcelReport(id) { var title = $("#logDate").val() + "_종합평가지표 조회수"; var tab..
자바스크립트에서 this는 자세히 보지 않으면 쉽게 헷갈립니다. this를 명확히 이해하기 위해서는 자바스크립트의 함수와 메소드의 차이를 알아야 하는데요, 다음 소스에서 함수와 메소드의 차이를 보시겠습니다. 12345678910111213141516var func = function(x) { console.log(this); console.log(x);}; func(1); var obj = { methA : func, inner : { methB : func }}; obj.methA(2);obj.inner.methB(3);cs 전역으로 선언된 func는 함수입니다. func(1)을 실행하면 this로 전역(window)이 찍히는걸 확인할 수 있습니다. 반면 obj 안에 있는 methA와 methB는 메소..
자바스크립트에서 생성한 Date객체를 yyyy, mm, dd 의 형태로 포멧을 변경하고 싶을 때 사용하는 함수입니다. 12345678910111213function getFormatDate(date) { var year = date.getFullYear(); var month = (1 + date.getMonth()); month = month >= 10 ? month : '0' + month; var day = date.getDate(); day = day >= 10 ? day : '0' + day; var hour = date.getHours(); var minute = date.getMinutes(); minute = minute >= 10 ? minute : '0' + minute; var sec..
자바스크립트의 클로저를 한번에 설명하기는 어렵습니다. 간단한 코드를 통해 클로저가 어떤 성격을 가지고 있는지 확인해보겠습니다. 1234567891011var outer = function() { var a = 1; var inner = function() { return ++a; } return inner();}; var outer2 = outer();console.log(outer2);console.log(outer2);cs (2, 2 출력) 10번 11번 라인의 outer2 함수 호출은 독립적으로 호출되면서 2, 2가 출력이 됩니다.이 코드에서는 outer의 실행 컨텍스트가 종료되기 전에 inner의 실행 컨텍스트가 종료 되면서 이후 inner 함수를 호출할 수 없게 됩니다. 그렇다면 outer 함수..
자바스크립트의 큰 특징중 하나라고 할 수 있는 호이스팅에 대해 포스팅하겠습니다. 호이스팅은 '특정 실행 컨텍스트(scope)안에서 선언된 변수 이름과 함수 선언 내용을 해당 실행 컨텍스트 최상단에 올려놓는 것'이라고 할 수 있습니다. 아래 코드에서 12345678910111213141516var a = 1; var outer = function() { var inner = function() { console.log(a); var a = 3; } inner(); console.log(a); } outer();console.log(a);cs 출력은 undefined, 1, 1 이 됩니다. inner 함수 안에서 undefined가 뜨는 이유가 바로 호이스팅 때문인데요, 전역으로 a라는 변수가 선언되어있음에..
자바스크립트에서 비동기로 호출 된 특정 로직이 끝나고 나서 실행되도록 하는 함수를 콜백함수라고 합니다. 일반적으로 자바스크립트에서 비동기로 함수를 호출하게 되면 그 함수 로직이 끝날때까지 기다리는것이 아니라 바로 다음으로 넘어가게 되는데요, 12345678910111213141516function first() { setTimeout(function() { console.log(1); }, 1000);} function second() { console.log(2);} first();second(); // 2// 1// 출력cs first()를 실행하고 second()를 실행하였음에도 second가 먼저 실행이 되는 것을 볼 수 있습니다. 12345678910111213function doHomework..
자바스크립트에서 함수를 작성하는 2가지 방법(함수 선언문과 함수 표현식)이 있습니다. 함수 선언문 : function a () {}; 함수 표현식 : var a = function() {}; 이 2가지 방법에서 가장 큰 차이점은 호이스팅에서 나옵니다. 함수 선언문으로 작성한 함수는 함수 전체가 호이스팅 되지만, 함수 표현식으로 작성한 함수는 호이스팅이 되지 않습니다. 1234567891011121314151617console.log(sum(3,4)); // 7 출력, 호이스팅 가능 function sum(x, y) { return x+y;} console.log(sum(1,2)); // 3 출력 console.log(a(3,4)); // Uncaught TypeError: a is not a functi..