> 웹 프론트엔드 > JS 튜토리얼 > 자바스크립트의 마법 같은 Date 객체(그래픽 튜토리얼)

자바스크립트의 마법 같은 Date 객체(그래픽 튜토리얼)

亚连
풀어 주다: 2018-05-19 09:20:07
원래의
1270명이 탐색했습니다.

일상생활 곳곳에는 다양한 형태의 시간문자가 존재합니다. 시간 개념의 출현, 시간 단위와 타이밍 도구의 발명은 인간에게 한 단어로 설명하기 어려운 변화를 가져왔습니다. 오늘은 날짜에 대해 이야기해보겠습니다. JavaScript의 Date 객체를 살펴보겠습니다.

Date 객체는 가장 일반적으로 사용되는 객체 중 하나이지만, 많은 사람들은 간단한 조작에도 직접 사용해 보지 않고 순간을 사용합니다.

이번에는 Date에서 날짜 사용법을 공유하겠습니다. 모두에게 영감을 줄 수 있기를 바랍니다.

MDN 공식 홈페이지 소개

setDate() 메소드는 현지 시간을 기준으로 날짜 객체의 일수를 지정합니다.

dayValue가 해당 월의 합리적인 범위를 벗어나면 setDate는 그에 따라 Date 개체를 업데이트합니다.

예를 들어 dayValue에 0을 지정하면 날짜는 이전 달의 마지막 날로 설정됩니다.

월의 일수 가져오기

// 获取月份天数
function getMonthDayCount(year, month) {
 return new Date(year, month, 0).getDate();
}
console.log(getMonthDayCount(2017, 10)); // 31
로그인 후 복사

Date 세 번째 매개변수의 본질은 setDate와 동일합니다.

날짜가 0이 되면 자동으로 이전 달의 마지막 날로 돌아가기 때문에 여기서는 달을 줄일 필요 없이 딱 맞습니다.

모든 달의 일수를 구하세요

function getAllMonthDayCount(year) {
 var days = [31, new Date(year, 2, 0).getDate(), 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
 return days;
}
console.log(getAllMonthDayCount(2016));// [31, 29, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31]
로그인 후 복사

위 내용의 확장이므로 설명이 필요하지 않습니다.

윤년인가요?

function isLeapYear(year) {
 return (year % 4 == 0) && (year % 100 != 0 || year % 400 == 0);
}
로그인 후 복사

이것은 인터넷에 있는 코드입니다. 대부분의 사람들이 사용한다고 생각합니다.

근데 정말 이해하고 기억하시나요?

어차피 난 못해. .

function isLeapYear(year) {
 return new Date(year, 2, 0).getDate() === 29;
}
console.log([
 isLeapYear(2000),
 isLeapYear(2016),
 isLeapYear(2017),
 isLeapYear(2018)
]); // [ true, true, false, false ]
로그인 후 복사

이렇게 보면 아주 간단하고 이해하기 쉽습니다.

그리고 기억할 필요도 없는데 잊고 싶어도 못 잊을 것 같나요?

일의 덧셈과 뺄셈

누군가가 상대 초를 사용하여 몇 일 전이나 몇 일 후, 심지어 몇 달과 몇 년을 계산하는 것을 본 적이 있습니다.

사실, 날짜를 직접 설정하기만 하면 월과 연도가 교차하는 상황을 자동으로 처리해 줍니다.

// 10天后是几月几号
var dt = new Date('2016-12-25');
dt.setDate(dt.getDate() + 10);
console.log(dt.toLocaleDateString()); // 2017/1/4


// 10天前是几月几号
var dt = new Date('2017-01-04');
dt.setDate(dt.getDate() - 10);
console.log(dt.toLocaleDateString()); // 2016/12/25
로그인 후 복사

요약

이런 것들은 아주 기본적이고 누구나 방법의 이름을 알 수 있지만, 아직도 많은 사람들이 사용하지 않습니다.

jq를 사용하는 것과 동일하지만 여전히 for 루프를 사용하여 결과를 처리합니다.

여기에는 몇 가지 예만 나열되어 있습니다. 다른 마법의 조작 기술이 여러분을 기다리고 있을 수도 있습니다.

위 내용은 제가 여러분을 위해 정리한 내용입니다. 앞으로 도움이 되길 바랍니다.

관련 기사:

JS 콜백 기능 사용 사례에 대한 자세한 설명

JS DOM 요소의 일반적인 추가, 삭제, 수정 및 확인 작업에 대한 자세한 설명

JS 새로 고침 페이지 방법 요약

위 내용은 자바스크립트의 마법 같은 Date 객체(그래픽 튜토리얼)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿