반응형

JavaScript 17

Javascript 에도 명시적 변수 선언 있다. let, const

https://gist.github.com/LeoHeo/7c2a2a6dbcf80becaaa1e61e90091e5d 윗 글을 읽어보면, 무지무지무지 설명이 잘 되어 있다. 요약하자면, 변수를 상수 값처럼 쓰고 싶다면, ( C 의 const, java 의 static 등 ) javascript 에서 var 대신 const 쓰자. 변수 선언 중복을 문법 단계에서 방지하고 싶다면, ( C++ 이나 VB 의 explicit ) javascript 에서 var 대신 let 쓰자. 오타나 대소문자로 인해 생기는 버그/삽질을 줄일 수 있다. [ 뜻은 좀 다른거 같지만, 단순하게 쓰긴 참 좋다.... 정도. ]

JSON 쓸 때 홑따옴표[']는 비표준이라네?

몰라. 그렇다네. 나도 우연히 알게 됨. 내가 이전에 알고 있던 건, javascript 에서 문자열 처리시 홑따옴표( single quotation ' ) 와 겹따옴표 ( double quotation " ) 를 둘 다 문자열 처리에 사용할 수 있다는 거였다. = 차이 없다. 그런데 , stackoverflow 에서 누가 답글 올려놓은 거 보니, 자기가 플젝 할 때 ajax 로 post 값 넘길 때, method='POST' 썼다가 주옥된 적 있다네. method="POST" 로 홑따옴표를 겹따옴표로 고쳐 쓰니 된다고. 그래서 jquery 로 ajax 쓰려면 꼭 method="POST" 쓰라는 것. method='POST' 말고. https://stackoverflow.com/questions/2104..

encodeURI() 와 encodeURIComponent() 의 차이점.

백만년 만이구만. 작업하다가, 웹 선택값을 다음 페이지로 넘길 일이 생겼는데, 한글 문자열 값이었다.그래서, encodeURI() 를 쓰려고 봤더니.... 이게 encodeURI() 랑 encodeURIComponent() 두가지가 있네?두가지 차이점이 뭔지 몰라서 인터넷 뒤져보니 아래와 같다고 한다. https://stackoverflow.com/questions/14317861/difference-between-escape-encodeuri-encodeuricomponent 결론부터 이야기하면, encodeURIComponent() 써라. url 로 값 넘길때, get 방식으로 넘길 경우는 변수간 구별 delimiter 로 "&" 를 쓰는데, encodeURI() 는 앤드 기호를 UTF-8 로 변경해..

javascript 의 key event 처리방법은, IE 와 Chrome / Firefox 가 다르다.

말그대로임. 버전까지 비교하면서 테스트 해 보지는 않았는데, IE 11 과 chrome , firefox 는 키 입력 이벤트 처리법이 다르다. 먼저 소스부터 보면, // for chrome, firegoxwindow.onkeydown = function() { var kcode = event.keyCode; if ( kcode == 13 || kcode == 65 ) { alert(' a : 65 , enter : 13 '); }} // for IEdocument.onkeydown = function(e){ key = ( e ) ? e.keyCode : event.keyCode; if ( kcode == 13 || kcode == 65 ) { alert(' a : 65 , enter : 13 '); }}..

javascript - 한글 입력 후 엔터키로 이벤트 처리할 때 , 이벤트가 두 번 발생하는 경우.

말 그대로다. 이전에는 같은 코드로 이런 일이 안 일어났던 것 같은데, 이상하긴 하다.하여튼, 문제가 발생하면 해결해야 하는 것이 업業 이라, 놓아둘 수는 업는법.반나절의 삽질 끝에 원인을 찾아 해결한다. 1. 현상.javascript + jquery 로 keyUp 이벤트를 걸었는데,영문 입력시에는 1번 일어나는 key up 이벤트가, 한글 입력시에는 2번 일어난다. 예를들어, 아래와 같이 코드를 구성. ... 흔하디 흔한 "입력 완료 후 엔터 검출" 코드다.근데, 이게 왜인지는 모르겠는데, IE 에서는 영문 입력시에는 기대한대로 key up 이벤트가 1번 일어나는데, 한글 입력시에는 key up 이벤트가 2번 일어난다. IE만 그러더라. 2. 해결.나도 이런적은 처음이어서 ( 사실 이런 일이 발생할거라..

프로그램 2015.04.10

javascript( node.js ) 에서 for each + key 값을 이용해야 할 때.

foreach ... 공돌이를 어엿비 여기어 하늘이 내려주신 도구임에 틀림없다.만, 보통 key + value 에서 value 는 안 쓰잖아?근데, 대상이 되는 object 의 value 말고 key 도 같이 써야 할 때가 있다. 물론 object 가 array 라면 상관 없겠지만, 세상은 그리 간단하지 않지. 임의의 object 를 key + value 로 사용해야 할 때, 이러하게 쓴다. var obj1 = { a:31, b:32, c:33 }; for( var lp1 in obj1 ){ console.log( ' lp1:' + obj1[ lp1 ] + ' ' );// 11 -> 12 -> 13 출력 = value 출력. if ( obj1.hasOwnProperty( lp1 ) ) console.lo..

프로그램 2015.02.25

javascript 에서, checkbox 나 radio를 jquery 로 다룰 때, is() + attr() 대신 prop() 를 이용하자.

제목 그대로임.이게 아마도... jquery version 1.7 이후에 바뀐 거 같은데... 이전에 html 의 checkbox 나 radio 를 jquery 로 다루려면 , attr() 속성이나 is() 속성을 이용했다. 예를 들어, 를 , jquery 로 반전시킨다면, 아마 이렇게 할 거다. $('#check1').attr('checked', !$('#check1').is( ':checked' ) ); 즉, is() 로 체크되었는지 확인한 후, ! 로 반전해서, attr() 로 등록. ( is(":checked" ) 에 콜론이 들어가 있는것에 주의. ) 그런데, 이게 라이브러리가 올라가면서, attr() 의 기능이 약간 바뀐 듯 하다.버전 업 된 jquery 에서는, attr('checked', t..

프로그램 2014.10.11

HTML5 의 canvas에서는, style 의 width, height 크기 설정이 안 먹는다.

흠. 나도 의외긴 한데, 그렇다. 사용 시나리오는 이러하다. 1. canvas 를 선언2. width, height 를 명시적으로 지정3. 그림 그린 후 출력 확인4. 크기가 2. 에서 지정한 width, height 와 맞지 않는다. 무슨 소리냐... 예를 들어 , 아래와 같은 코드를 작성했다 치자. 이러면, 300 * 200 캔버스 칸에 100 * 100 짜리 검은 사각형이 그려지고 나머지 부분이 빨간 색으로 차 있어야 하잖아?근데 , 캔버스가 300*200 아니고 이상한? 배율을 확대한 것 같은 내용이 된다.저기서 fillRect() 대신 fillText() 를 쓰면, 도트가 깨지는 걸 명확히 확인할 수 있다. 뭔소리냐면, canvas 안의 좌표계와 html 의 좌표계가 일치하지 않는다는 증거다. ..

프로그램 2014.03.10

javascript location.href vs location.assign vs location.replace

... 생각나서 정리( = 포스팅을 위한 핑계 ) javascript 로 한 페이지에서 다른 페이지로 이동하려면, 3가지 방법이 있다. 제목대로 location.href = 이동할url;location.assign( 이동할url );location.replace( 이동할url ); assign 은 찾다가 처음 알았는데, 뭐 그게 중요한 게 아니고, location.href = location.assign() 과 기능상 같다. 그럼, href 와 replace 의 차이점은? 바로 이동할 때 history 를 남기느냐 아니냐의 차이다. window.location.href 로 이동한 사이트는 이동 히스토리가 기록되기 때문에 브라우저의 back 키 ( 혹은 window.history.back(); ) 으로 이..

프로그램 2013.11.22
반응형