Chào các bạn, hôm nay cafedev chia sẻ cho ace một danh sách các bài tập từ cơ bản tới nâng cao liên quan tới các kiến thức cơ bản trong lập trình Javascript. Cụ thể, trong bài này chúng ta sẽ làm quen với Date, Time, JSON. Từ đó giúp ace nâng cao kiến thức, kỹ năng, kinh nghiệm lập trình của mình và áp dụng nó vào thực tế.
Trước khi đi vào chi tiết bài tập, cafedev khuyến khích ace tự code bài tập của mình trước khi tham khảo bài hướng dẫn nhé.
Để chạy hoặc code các bài tập sau, ace có thể code trên trang web này như sau:
- Chọn new
- Chọn dự án bạn muốn code, ở đây có nhiều lựa chọn như Javascript, AngularJS, React,…. Tất nhiên mình sẽ chọn Javascript.
- Sau đó bạn sẽ thấy nơi bạn code.
- Sau khi code sau chọn Preview để xem kết quả.
Ngoài ra ace cũng có thể dùng các IDE đã được giới thiệu tại đây để code và chạy code đó trên máy tính của mình nhé.
Lưu ý: Mọi bài tập bên dưới cũng như các bài tập khác trong Series Javascript này được tạo ra từ các bài học và kiến thức của từng phần trong series tự học Javascript này. Nếu ace nào chưa làm được hoặc chưa hiểu kỹ về bài học thì bạn có thể tham khảo lại series tự học này nhé. Chúc các bạn thành công.
Bài 1
Tạo đối tượng Date cho ngày: 20 tháng 2 năm 2020, 3:12 sáng. Múi giờ là địa phương.
Hiển thị nó bằng cách sử dụng alert.
Bài 2
Viết hàm getDateAgo(date, days) để hiển thị ngày trong tuần ở định dạng ngắn gọn: ‘MO’, ‘TU’, ‘WE’, ‘TH’, ‘FR’, ‘SA’, ‘SU’.
Bài 3
Tạo một hàm getDateAgo(date, days) để trả về ngày của tháng, ngày trước kể từ ngày.
Ví dụ: nếu hôm nay là ngày 20, thì getDateAgo(new Date(), 1) phải là 19 và getDateAgo(new Date(), 2) phải là 18.
Nên hoạt động đúng trong days = 365 hoặc hơn:
let date = new Date(2015, 0, 2);
alert( getDateAgo(date, 1) ); // 1, (1 Jan 2015)
alert( getDateAgo(date, 2) ); // 31, (31 Dec 2014)
alert( getDateAgo(date, 365) ); // 2, (2 Jan 2014)Bài 4
Viết một hàm getLastDayOfMonth(year, month) trả về ngày cuối cùng của tháng. Đôi khi đó là ngày 30, 31 hoặc thậm chí 28/29 đối với tháng 2.
Thông số:
year– năm có bốn chữ số, ví dụ như năm 2012.-
year– tháng, từ 0 đến 11.
Ví dụ: getLastDayOfMonth(2012, 1) = 29 (năm nhuận, tháng 2).
Bài 5
Tạo một hàm getSecondsToTomorrow() trả về số giây cho đến ngày mai.
Bài 6
Viết một hàm formatDate(date) sẽ định dạng date như sau:
- Nếu kể từ ngày trôi qua dưới 1 giây, thì “ngay bây giờ”.
- Ngược lại, nếu kể từ ngày trôi qua dưới 1 phút, thì “n giây trước”.
- Ngược lại, nếu ít hơn một giờ, thì “m min. Ago”.
- Nếu không, ngày đầy đủ ở định dạng “DD.MM.YY HH: mm”. Đó là: “day.month.year hours: minutes”, tất cả đều ở định dạng 2 chữ số, ví dụ: 31.12.16 10:00.
Ví dụ:
alert( formatDate(new Date(new Date - 1)) ); // "right now"
alert( formatDate(new Date(new Date - 30 * 1000)) ); // "30 sec. ago"
alert( formatDate(new Date(new Date - 5 * 60 * 1000)) ); // "5 min. ago"
// yesterday's date like 31.12.16 20:00
alert( formatDate(new Date(new Date - 86400 * 1000)) );Hướng dẫn cách xem và tải tài liệu từ trang cafedev tại đây.
Giải bài 1,2,3,4,5,6
Bài 7
Chuyển user thành JSON và sau đó đọc lại thành một biến khác.
let user = {
name: "David Xuan",
age: 35
};Bài 8
Trong các trường hợp đơn giản của tham chiếu vòng tròn, chúng ta có thể loại trừ một sản phẩm vi phạm khỏi loạt bài theo tên của nó.
Nhưng đôi khi chúng ta không thể chỉ sử dụng tên, vì nó có thể được sử dụng cả trong tham chiếu vòng tròn và thuộc tính bình thường. Vì vậy, chúng ta có thể kiểm tra thuộc tính theo giá trị của nó.
Viết hàm thay thế(replacer) để xâu chuỗi mọi thứ, nhưng xóa các thuộc tính tham chiếu đến meetup:
let room = {
number: 23
};
let meetup = {
title: "Conference",
occupiedBy: [{name: "John"}, {name: "Alice"}],
place: room
};
// circular references
room.occupiedBy = meetup;
meetup.self = meetup;
alert( JSON.stringify(meetup, function replacer(key, value) {
/* your code */
}));
/* result should be:
{
"title":"Conference",
"occupiedBy":[{"name":"John"},{"name":"Alice"}],
"place":{"number":23}
}
*/Giải bài 7,8
Nguồn và Tài liệu tiếng anh tham khảo:
Tài liệu từ cafedev:
- Full series tự học Javascript từ cơ bản tới nâng cao tại đây nha.
- Ebook về javascript tại đây.
- Các series tự học lập trình khác
Nếu bạn thấy hay và hữu ích, bạn có thể tham gia các kênh sau của cafedev để nhận được nhiều hơn nữa:
Chào thân ái và quyết thắng!
