JS
js - 현재 페이지 url 관련 (location 객체)
1. 자주 사용하는 location 객체 // Ex) https://test.com:80/newpost?type=post window.location.href // Ex) https: window.location.protocol // Ex) test.com:80 window.location.host // Ex) test.com window.location.hostname // Ex) 80 window.location.port // Ex) newpost window.location.pathname // Ex) ?type=post window.location.search 2. 참고 https://hianna.tistory.com/464
js - this 바인딩 관련
Call & Apply 바인딩 예시 코드 class Point { constructor(x) { this.x = x; } info(y, z) { console.log(`x: ${this.x}, y: ${y}, z: ${z}`); } } var point = new Point(1); point.info(2, 3); // 결과 - x: 1, y: 2, z: 3 var point2 = {x: 100}; point.info.call(point2, 200, 300); // 결과 - x: 100, y: 200, z: 300 point.info.apply(point2, [200, 300]); // 결과 - x: 100, y: 200, z: 300 설명 함수를 바인딩하여 사용 시 this가 지정해준 object로 고정..
js - 변수값으로 변수명 짓기
코드 // 이름에 변수값으로 변수명 짓기 eval(`var ${변수}이름 = 값`); 예시 // 예) var 변수 = '변수'; eval(`var ${변수}이름 = 값`); console.log(변수이름); // 결과 (값);
js - 변수 값으로 함수 사용
코드 // 변수 값이 함수명인 함수 사용 eval(`${변수}()`); 예시 코드 // 예) function 함수() { console.log('성공!'); } var 변수 = '함수'; eval(`${변수}()`); // 결과 (성공)
js - 경과 시간 계산 함수
코드 /** * 입력받은 시간이 얼마나 경과 되었는지 반환하는 함수 * @param {string} time 과거 시간 * @returns {string} 경과 시간 */ function get_date_diff(time) { var now_time = new Date(); var deadline = new Date(time); var diff_time = (now_time - deadline) / 1000; var time_list = [ { time: "분", milli_seconds: 60 }, { time: "시간", milli_seconds: 60 * 60 }, { time: "일", milli_seconds: 60 * 60 * 24 }, { time: "개월", milli_seconds: 60..
js - 단일 타이머
코드 /** @type {Number} 시간 차이 ms */ var diff_time; /** * 현재 시간을 기준으로 입력받은 종료 시간까지 타이머를 작동 시키는 함수 * @param {String} end_time 종료 시간 * @param {String} tag 타이머 텍스트가 들어갈 태그 */ function setTimer(end_time, tag) { var deadline_time = new Date(end_time); var now_time = new Date(); if (now_time > deadline_time) { $(tag).text(`타이머가 종료되었습니다.`); } else { var { diff_ms, diff_hour, diff_minute, diff_second } = c..
js - js 로드 후 생성된 html이라 on 이벤트가 감지되지 않을 때
코드 // js 로드 후 생성된 html이라 on 이벤트가 감지되지 않을 때 사용 $(document).on('click', '.태그', function () { console.log('click event'); });