JavaScript
-
[JS] lodash란?JavaScript 2022. 11. 25. 11:11
lodash lodash는 JavaScript의 인기있는 라이브러리 중 하나입니다. Javascript에서 배열 안의 객체들의 값을 핸들링(배열, 객체 및 문자열반복 / 복합적인 함수생성) 할 때 유용합니다. Javascript의 코드를 줄여주고, 빠른작업에 도움이 됩니다. _. (변수) lodash wrapper로 변수를 감싸게 되면서 해당 변수에 대한 chaining를 시작합니다. _ 라는 기호를 이용해서 사용하기 때문에 명칭 또한 lodash가 된 것 입니다. 브라우저에서 지원하지 않는 성능이 보장되어있는 다양한 메서드를 가지고 있습니다. npm이나 기타패키지 매니저를 통해 쉽게 사용이 가능합니다. # lodash method array 관련 _.findIndex 형식 : _.findIndex(ar..
-
[JS] Pushstate 페이지 갱신 없이 페이지 전환JavaScript 2022. 11. 15. 12:50
현재 페이지 주소창 url변경 history.pushstate(state, title, url) history.pushstate( state, title, url ) 현재의 주소창의 url을 다른 것으로 변경하고자 할때 페이지는 그대로 유지하고 싶다면? history객체의 pushstate()를 사용하는 방법이 있다. pushstate()는 현재의 주소를 다른 것으로 변경하면서 페이지는 그대로 유지해주기 때문에 페이지가 전환, 갱신되는 것을 방지하면서 동시에 주소창의 url이 변경된다. 장점은 페이지 주소만 변경하는 것이 아니라 url주소를 바꾸면서 동시에 데이터(state)를 전달하거나 타이틀 변경도 가능하다. 1. url 변경 데이터(state), 타이틀(title)이 없다면 아래와 같이 간단하게 주..
-
[JS] null, undefined 체크 하기JavaScript 2022. 11. 7. 14:53
isNull() null과 undefined를 체크하는 function을 만들자 function inNull (data) { return (data === undefined || data === null) ? true : false; } Lodash _.isNull() 메서드 Lodash는 underscore.js 위에서 작동하는 JavaScript 라이브러리 입니다. _.isNull() aㅔ서드는 객체의 값이 null인지 여부를 찾는데 사용됩니다. 값이 null이면 true / 그렇지 않으면 false 를 반환합니다. if (_.isNull(data) || data === '') { isErrorFlag = true; }
-
[JS] 초를 시:분:초 형태로 변환 (HH:MM:SS)JavaScript 2022. 11. 2. 11:17
초를 시:분:초 변환하기 function humanReadable(seconds) { if (seconds < 61) { return '00:' + addZero(seconds) } // sec var hours = Math.floor(seconds/3600) var mins = Math.floor((seconds - hours*3600)/60) var secs = seconds - hours*3600 - mins*60 return addZero(hours) + ':' + addZero(mins) + ':' + addZero(secs) function addZero(num) { return ((num < 10) ? '0' : '') + num } } seconds가 60 미만이면 연산할 필요가 없으니 그..
-
[JQuery] removeAttr(), attr(), removeClass() 속성제어JavaScript 2022. 10. 31. 13:20
removeAttr() 선택한 요소의 특정 속성 제거 attr( attributeName ) 속성값 추가/제어 removeClass() 클래스의 값삭제 addClass() 클래스의 값추가 removeAttr( attributeName ) $( 'h1' ).removeAttr( 'title' ); // h1요소에서 title속성을 제거한다. // input 요소의 placeholder 속성을 제거한다. $( document ).ready( function() { $( 'input' ).removeAttr( 'placeholder' ); } ); // id요소가 cardbox인 style 속성을 제거한다. $('#cardbox'+idx).removeAttr('style') attr( attributeName..
-
[JS] 문자열안에 따옴표 넣기. 특수문자 치환JavaScript 2022. 10. 27. 14:11
문자열안에 따옴표 넣기 Javascript문법에서는 백슬래시(\)다음에 사용하고자 하는 따옴표나 쌍따옴표를 넣으면 원하는 문자열로 출력된다. let data = "나는 \"개발자\" 입니다."; 정규표현식을 이용한 replace 특수문자 치환 // 이스케이프 특수문자 치환 data.replace(/"/g,'\"'); HTML 특수 문자표 HTML 상에서 특수문자가 제대로 나타나지 않을 수 있기 때문에 아래 문자들를 사용합니다. 표현문자 숫자표현 문자표현 설명 - �- - 사용하지 않음 space - 수평탭 space - 줄 삽입 - - - 사용하지 않음 space - 여백 ! ! - 느낌표 " " " 따옴표 # # - 숫자기호 $ $ - 달러 % % - 백분율 기호 & ..
-
[JS] 배열에서 동명이인 찾기. Array.filter()JavaScript 2022. 10. 25. 10:11
Array.filter()는 배열의 요소들 중에 특정 조건을 만족하는 요소들을 모아서 새로운 배열로 리턴 // 아래의 배열에서 MyNm이 같은 요소만 찾아 새로운배열로 리턴 let data = [ { "BirthYmd": "20220915", "Sex": "M", "SchoolNm": "EM", "Id": "001104", "UnitNo": "22809641", "MyNm": "윤텐", "Room": "KTAS", "Age": "33세" }, { "BirthYmd": "20220815", "Sex": "M", "SchoolNm": "EM", "Id": "001104", "DeptCd": "112180", "UnitNo": "22809641", "MyNm": "김이박", "Room": "KTAS", "Ag..