Dev. Web/JavaScript Jquery (16) 썸네일형 리스트형 [JS] 배열 합치기, join 응용 var buffer = { entries : [], add : function(s) { this.entries.push(s); }, concat : function() { return this.entries.join(""); } }; var source = ["867", "-", "5309"]; source.forEach(function(s) { buffer.add(s); }); buffer.entries.join(""); result : "867-5309" jQuery와 javascript 에서의 trim() 함수 대부분의 프로그래밍 언어에서 trim() 함수는 문자열 앞과 뒤 공백을 제거하는 함수이다. 하지만 javascript 에서는 기본적으로 이 함수를 제공하지 않는데, 이 때문에 jquery의 trim()이 많이 사용된다 var str = ...; var trimmed_str = jQuery.trim(str); 만약 jquery를 쓰기 싫다면 정규식을 사용한 아래 함수를 이용하면 된다 function trim(stringToTrim) { return stringToTrim.replace(/^\s+|\s+$/g,""); } var trimmed_str = trim(str); 최소한의 전역변수 사용 [출처] 자바스크립트 핵심 가이드 전역변수는 프로그램의 유연성을 약화하기 때문에 가능하면 피하는 것이 좋다.전역변수 사용을 최소화 하는 방법은 애플리케이션에서 전역변수 사용을 위해 다음과 같이리터럴 형식으로 전역변수를 생성하는 것이다. var MYAPP ={}; MYAPP.stooge = { "first-name" : "Joe", "last-name" : "Howard"}; MYAPP.flight = { airline : "Korea-Air", number : 815, "departure" : { time : "2019-09-22", city : "Seoul" }}; 제이쿼리 작성의 좋은 예 보호되어 있는 글입니다. jQuery: data() 이해와 활용 jQuery의 data()의 저장 방법 위와 같이 형태로 data를 엘리먼트에 저장할 수 있습니다.* 추가적으로 HTML5에서는 HTML 엘리먼트에 data-*형식을 이용하여 미리 데이터를 저장할 수 있습니다. 이 방법은 jQuery의 data()를 이용해 저장한 것과 동일한 효과를 나타낼 수 있습니다.사실 HTML5의 data-*가 나오기 전에는 개발자들마다 가지각색으로 HTML 엘리먼트에 허용되지 않는 속성(임의의 Attr속성)을 추가하여 사용했기 때문에 유지보수 측면이나 해석할때 매우 난해하고 지저분한 HTML이 많았습니다. 하지만 HTML5로 넘어오면서 data-* 속성이 표준화가 되면서 이전의 문제점들이 해결되었습니다. .data()가 저장되는 방식 [ case 2. 데이터 읽기 ]문법 : $(.. datepicker 에서 달력이 다른 레이어에 가려질때 (출처 : http://son10001.blogspot.kr/2014/10/jquery-datepicker.html ) 요즘은 jQuery 가 많이 사용되다 보니, 예전같으면 만드느라 꽤나 고생했을 달력 같은 기능들을 아주 손쉽게 달수 있어 편리하다. 하지만, 역시 완벽한 것은 없어서, datepicker 를 쓰다보면 다른 레이어 밑으로 숨어버려 곤란 할때가 있다. 바로 아래 이미지와 같은 경우인데, 텍스트 박스에 datepicker 를 달아 놓아서 해당 텍스트 박스를 클릭하면 바로아래에 달력이 나오도록 한 것인데, 그 아랬쪽에 달아 놓은 웹 에디터에 있는 체크 박스와 겹쳐지면서, 그 체크 박스가 달력 위로 나타난다. 물론 다른 아이콘이 있을 경우에는 그 아이콘들도 달력위로 불쑥 솟아나 나온다. 지금 이.. AJAX 내부 리턴 문제(only return false) AJAX를 사용하다 보면, Success로 들어가긴 하는데 계속 return false로 실행되는 경우가 있다.이럴 땐, ajax 선언 부분에 async=false를 써 주면 해결되는 경우가 많다. 위와 같은 같은 경우에도, async : false를 써주기 전까지 alert(data.message)만 계속 실행되었다. 1시간 여를 고생한 끝에 찾은 정답이 async : false라는게 허무한 경우였다. ㅡㅡㅋ [번역] 자바스크립트 피로감을 줄여주기 위한 학습 계획 [출처] https://rhostem.github.io/posts/2016-12-19-A-Study-Plan-To-Cure-JavaScript-Fatigue/ [번역] 자바스크립트 피로감을 줄여주기 위한 학습 계획번역JavascriptReactReduxES6gatsbyGraphQLFront-end2016년 12월 19일 이 글은 "A Study Plan To Cure JavaScript Fatigue"를 번역한 글입니다. 많은 이들처럼 나도 최근 Jose Aguinaga의 글 "How it feels to learn JavaScript in 2016"을 읽었다. 그의 글은 정곡을 찔렀던 것이 분명한 모양이다.(나는 그 포스트가 Hacker News에 한번도 아니고 두번이나 탑 스팟에 오르는 것을 보았다... 이전 1 2 다음