비개발자, CPO가 되기까지
19.12.06 개발 기록 - [Javascript] 뉴스피드의 몇 년 전, 몇 개월, 몇 일 전, 전 몇 시간 전, 몇 분 전, 몇 초 전 만들기
뚜까망치 루크
2019. 12. 7. 00:30
오늘의 포스팅 내용은 페이스북 뉴스피드나 인스타그램 포스팅 등에서 볼 수 있는 ~~시간 전을 계산 하여
Javascript로 구현하는 Syntax이다.
뉴스피드 기능에 있어서 굉장히 중요하고 필요한 기능이라고 생각되어 완벽하게 구현하고자 하는 욕심이 있었다!
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
|
var crrtDay = new Date();
var crrtYear = crrtDay.getFullYear(),
crrtMonth = crrtDay.getMonth(),
crrtDate = crrtDay.getDate();
var nf_created_dttm = result.results.lamb_list[i].nf_created_dttm;
var createdDay = new Date(nf_created_dttm);
var createdYear = createdDay.getFullYear(),
createdMonth = createdDay.getMonth(),
createdDate = createdDay.getDate(),
createdHour = createdDay.getHours(),
createdMin = createdDay.getMinutes();
if (crrtYear > createdYear) {
minus = crrtYear - createdYear;
thirdSpan.innerHTML = minus + '년 전';
} else if (crrtMonth > createdMonth) {
minus = crrtMonth - createdMonth;
thirdSpan.innerHTML = minus + '개월 전';
} else if (crrtDate > createdDate) {
minus = crrtDate - createdDate;
thirdSpan.innerHTML = minus + '일 전';
} else if (crrtDate == createdDate) {
var crrtTime = crrtDate.getTime(),
createdTime = createdDate.getTime();
if (crrtTime > createdTime) {
sec = parseInt(crrtTime - createdTime) / 1000;
day = parseInt(sec / 60 / 60 /24);
sec = (sec - (day * 60 * 60 * 24));
hour = parseInt(sec / 60 / 60);
sec = (sec - (hour * 60 * 60));
min = parseInt(sec / 60);
sec = parseInt(sec - (min * 60));
if (hour > 0) {
thirdSpan.innerHTML = hour + '시간 전';
} else if (min > 0) {
thirdSpan.innerHTML = min + '분 전';
} else if (sec > 0) {
thirdSpan.innerHTML = sec + '초 전';
}
}
}
|
|
|
|
|
먼저 현재 시간을 가져오는 문법을 구현하고, 게시물이 만들어진 시간을 created_dttm을 이용하여 가져오도록 한다.
그리고 위 코드처럼 쭉쭉 가져와서 사용하면 되는데, 굳이 복기하거나 외울 필요 없이 긁어다가 쓰면 될 거 같아 여기서 줄이도록 한다.
아 참, 여기서 내가 몰랐던 parseInt() 라는 함수에 대해서 정리해보자.
1. parseInt 는 문자열을 정수로 변환하는 함수이다.
2. 사용 예시는 parseInt('string' , n) 로, string을 n 진법일 때의 값으로 변환해 준다.
3. n 값을 입력하지 않으면 자동으로 10진법으로 적용된다.
4. 소수 부분은 버린다.
오늘은 요정도만 알면 될 듯 하다!
이 포스팅을 보시는 분 중 제가 틀린 부분, 잘못 이해한 부분이 있어 알려주실만한 내용이 있다면 언제든 편하게 댓글 남겨주세요 :) 감사합니다 !
728x90
반응형