ĐẠI HỌC QUỐC GIA HÀ NỘI TRƯỜNG ĐẠI HỌC CÔNG NGHỆ NGUYỄN NHƯ MINH NGHIÊN CỨU LẬP TRÌNH PHẢN ỨNG VỚI NGÔN NGỮ ELM LUẬN VĂN THẠC SĨ CÔNG NGHỆ THÔNG TIN Hà Nội - 2015 ĐẠI HỌC QUỐC GIA HÀ NỘI TRƯỜNG ĐẠI HỌC CÔNG NGHỆ NGUYỄN NHƯ MINH NGHIÊN CỨU LẬP TRÌNH PHẢN ỨNG VỚI NGÔN NGỮ ELM Ngành: Công nghệ thông tin Chuyên ngành: Kỹ thuật phần mềm Mã số: 60480103 LUẬN VĂN THẠC SĨ CÔNG NGHỆ THÔNG TIN NGƯỜI HƯỚNG DẪN KHOA HỌC: PGS TS TRƯƠNG ANH HOÀNG Hà Nội - 2015 LỜI CẢM ƠN Trƣớc tiên xin chân thành cảm ơn PGS.TS Trƣơng Anh Hoàng tận tình hƣớng dẫn, giúp đỡ suốt trình thực luận văn tốt nghiệp Tôi xin chân thành cảm ơn thầy cô giáo khoa Công nghệ Thông tin, trƣờng Đại học Công nghệ, Đại học Quốc gia Hà Nội, ngƣời tận tình truyền đạt kiến thức, quan tâm, động viên suốt thời gian học tập nghiên cứu Trƣờng Nhân cho phép gửi lời cảm ơn tới nhóm bạn học lớp K20CNPM, lớp chuyên ngành công nghệ phần mềm thƣờng xuyên quan tâm, giúp đỡ, chia sẻ kinh nghiệm, cung cấp tài liệu hữu ích suốt thời gian học tập trƣờng Hà Nội, tháng 12 năm 2015 Tác giả luận văn Nguyễn Như Minh LỜI CAM ĐOAN Tôi xin cam đoan luận văn “Nghiên cứu lập trình phản ứng với ngôn ngữ Elm” công trình nghiên cứu dƣới hƣớng dẫn khoa học PGS.TS Trƣơng Anh Hoàng, tham khảo nguồn tài liệu rõ trích dẫn danh mục tài liệu tham khảo Các nội dung công bố kết trình bày luận văn trung thực chƣa đƣợc công bố công trình Hà Nội, tháng 12 năm 2015 Tác giả luận văn Nguyễn Như Minh MỤC LỤC LỜI CẢM ƠN LỜI CAM ĐOAN MỤC LỤC DANH SÁCH HÌNH VẼ MỞ ĐẦU Lý chọn đề tài Mục đích nghiên cứu Đối tƣợng phạm vi nghiên cứu Kết cấu luận văn 10 CHƢƠNG 1-GIỚI THIỆU VỀ LẬP TRÌNH PHẢN ỨNGError! Bookmark not defined 1.1 Giới thiệu lập trình phản ứng Error! Bookmark not defined 1.2 Lập trình phản ứng luồng liệu Error! Bookmark not defined 1.3 Đặc điểm lập trình phản ứng Error! Bookmark not defined 1.4 Lập trình hàm phản ứng Error! Bookmark not defined 1.4.1 Classical FRP Error! Bookmark not defined 1.4.2 Real-time FRP & Event-Driven FRP Error! Bookmark not defined 1.4.3 Arrowized FRP Error! Bookmark not defined CHƢƠNG – LẬP TRÌNH PHẢN ỨNG VỚI NGÔN NGỮ ELM Error! Bookmark not defined 2.1 Khái quát ngôn ngữ lập trình hàm Error! Bookmark not defined 2.1.1 Định nghĩa Error! Bookmark not defined 2.1.2 Tính khai báo ngôn ngữ hàm Error! Bookmark not defined 2.1.3 Một số khái niệm ngôn ngữ hàmError! Bookmark not defined 2.2 Cơ ngôn ngữ Elm Error! Bookmark not defined 2.2.1 Các cú pháp Error! Bookmark not defined 2.2.2 Ví dụ giao diện đồ họa Elm Error! Bookmark not defined 2.2.3 Các tín hiệu tƣơng tác Elm Error! Bookmark not defined 2.3 Các ƣu điểm ngôn ngữ Elm Error! Bookmark not defined 2.4 Các thao tác với tín hiệu Elm Error! Bookmark not defined 2.5 Lập trình tƣơng tác Error! Bookmark not defined 2.6 Gỡ lỗi Elm Error! Bookmark not defined 2.7 Kiến trúc Elm lập trình trò chơi Error! Bookmark not defined CHƢƠNG – XÂY DỰNG ỨNG DỤNG TRÒ CHƠI HOCKEY Error! Bookmark not defined 3.1 Mô tả trò chơi Error! Bookmark not defined 3.2 Phân tích trò chơi Error! Bookmark not defined 3.3 Xây dựng code chƣơng trình với ngôn ngữ ElmError! Bookmark not defined 3.3.1 Xây dựng giao diện Error! Bookmark not defined 3.3.2 Xây dựng mô hình liệu Error! Bookmark not defined 3.3.3 Xây dựng tín hiệu đầu vào Error! Bookmark not defined 3.3.4 Cập nhật liệu chƣơng trình Error! Bookmark not defined 3.3.5 Thực thi chạy chƣơng trình Error! Bookmark not defined 3.4 Nhận xét, đánh giá thảo luận Error! Bookmark not defined 3.4.1 Ƣu điểm lập trình phản ứng Error! Bookmark not defined 3.4.2 Một số khó khăn lập trình phản ứngError! Bookmark not defined 3.4.3 Ƣu điểm ngôn ngữ Elm Error! Bookmark not defined 3.4.4 Nhƣợc điểm ngôn ngữ Elm Error! Bookmark not defined KẾT LUẬN Error! Bookmark not defined TÀI LIỆU THAM KHẢO 11 DANH SÁCH HÌNH VẼ Hình 1.1: Sự truyển đổi giá trị liên tục dòng theo tín hiệu chuột Error! Bookmark not defined Hình 1.2: Sơ đồ đặc điểm lập trình phản ứngError! Bookmark not defined Hình 2.1: Hiển thị văn Elm Error! Bookmark not defined Hình 2.2: Các Forms đồ họa đƣợc tạo Error! Bookmark not defined Hình 2.3: Tạo kết hợp hình dạng thành thành phần .Error! Bookmark not defined Hình 2.4: Bảng tín hiệu đầu vào ElmError! Bookmark not defined Hình 2.5: Theo dõi chuyển động trỏ chuột [5]Error! Bookmark not defined Hình 2.6: Di chuyển đối tƣợng hình tròn phím mũi tên Error! Bookmark not defined Hình 2.7: Mô tả trình hoạt động tín hiệuError! Bookmark not defined Hình 2.8: Elm’s Time Traveling Debugger Error! Bookmark not defined Hình 3.1: Ca sử ngƣời chơi Error! Bookmark not defined Hình 3.2: Ca sử dụng sân bóng Error! Bookmark not defined Hình 3.3: Mô hình kiểu liệu trò chơiError! Bookmark not defined Hình 3.4: Giao diện trò chơi Error! Bookmark not defined Hình 3.5: Văn hƣớng dẫn trò chơi Error! Bookmark not defined Hình 3.6: Giao diện trò chơi kết thúc Error! Bookmark not defined Hình 3.7: Giao diện Degbug chƣơng trình Error! Bookmark not defined MỞ ĐẦU Lý chọn đề tài Ngày Internet kết nối hàng tỷ ngƣời khắp giới ứng dụng phổ biến nhƣ mạng xã hội, công cụ tìm kiếm, dịch vụ blog cá nhân… đƣợc sử dụng hàng triệu chí hàng tỷ ngƣời sử dụng máy tính Điều thể thay đổi phạm vi quy mô mong đợi máy tính làm cho ngƣời Với lợi ích ứng dụng web đại ứng dụng di động có tính tƣơng tác cao với vô số kiện liên quan đến tƣơng tác ngƣời dùng Các ứng dụng ngày phát triển phong phú cho phép tƣơng tác cao với ngƣời sử dụng thời gian thực Để làm đƣợc điều cần phải nghiên cứu thiết kế ứng dụng phổ biến để thực kỹ thuật Điều cung cấp cho máy tính nhiệm vụ muốn phản ứng lại nhanh Nói cách khác máy tính phải phản ứng với ngƣời sử dụng đáp ứng đƣợc yêu cầu cách xác Ví dụ gửi email thông qua Gmail bạn muốn xác nhận đƣợc gửi ta xóa email biến khỏi danh sách hiển thị, tất thao tác ngƣời sử dụng đƣợc hiển thị trình duyệt web Hoặc chơi trò chơi tƣơng tác với nhân vật trò chơi phải đƣợc phản ứng theo ý thời gian định để đạt mục đích Để làm đƣợc điều lập trình phản ứng câu trả lời Lập trình phản ứng kết hợp hệ thống đồng thời hệ thống hƣớng kiện cho phép xử lý luồng liệu không đồng nhƣng trì phong cách ngôn ngữ lập trình thông thƣờng Lập trình phản ứng làm tăng mức độ trừu tƣợng mã giúp ngƣời lập trình tập trung vào kiện có liên quan tới giải logic phức tạp Mã lập trình phản ứng thƣờng ngắn gọn, rõ dàng dễ trì Tƣ lập trình phản ứng thƣờng thiên việc truyển đổi từ liệu đầu vào tƣơng tác với liệu chƣơng trình để thị liệu đầu Ở giới lập trình phản ứng xu hƣớng đƣợc dựa luồng chảy liệu (dataflow) giá trị chúng đƣợc thay đổi cách tự động nhƣ có tác động từ môi trƣờng bên vào Với phổ biến hƣớng kiện, khả mở rộng kiến trúc tƣơng tác máy chủ máy trạm khái niệm "reactiveness" ngày đƣợc ý Nó ứng dụng cao để viết ứng dụng web hệ thống liên quan tới sở liệu lớn phƣơng pháp tạo nhiều hệ thống đồng thời có tính hiệu cao Mục đích nghiên cứu Mục đích nghiên cứu luận văn nhằm tìm hiểu đặc điểm lập trình phản ứng, cụ thể nghiên cứu lập trình phản ứng ngôn ngữ Elm, ngôn ngữ giới trình phát triển Từ nắm vững đƣợc đặc điểm lập trình phản ứng nhƣ cách vận dụng chúng ngôn ngữ Elm để tạo ứng dụng mang tích tƣơng tác với ngƣời sử dụng có tính hiệu cao Mục đích thứ hiểu rõ đƣợc cú pháp nhƣ phƣơng thức hoạt động động ngôn ngữ Elm từ áp dụng vào để xây dựng lên chƣơng trình cụ thể Đối tượng phạm vi nghiên cứu Đầu tiên ta nghiên cứu đặc điểm phƣơng thức hoạt động lập trình phản ứng xem chúng có điểm tƣơng đồng với luồng liệu Tiếp theo tập chung nghiên cứu sâu ngôn ngữ Elm để làm bật đƣợc đặc điểm lập trình phản ứng Ngôn ngữ Elm ngôn ngữ đƣợc phát triển hoạt động dựa thao tác với giá trị đầu vào đƣợc gọi tín hiệu (Signal) Tín hiệu giá trị dòng chảy thay đổi theo thời gian đƣợc thiết lập xử 10 lý để thay đổi giá trị luồng liệu chƣơng trình Các thƣ viện Elm đơn giản đầy đủ cho phép tối ƣu hóa mã lập trình tạo giao diện tƣơng tác ngƣời dùng cách dễ dàng Elm hoàn toàn hƣớng kiện việc tính toán lại giá trị trừ kiện xảy hỗ trợ việc xử lý luồng liệu không đồng Cuối xây đựng trò chơi ngôn ngữ Elm để thể rõ đƣợc đặc điểm lập trình phản ứng Kết cấu luận văn Luận văn trình bày phần mở đầu, mục lục, danh mục tài liệu tham khảo, kết đạt đƣợc nội dung luận văn gồm chƣơng Chƣơng nghiên cứu lập trình phản ứng, nội dung chƣơng nêu đặc điểm lập trình phản ứng, đặc điểm luồng liệu xem chúng có đặc điểm tƣơng đồng hay không Chƣơng nghiên cứu đôi nét lập trình hàm từ sâu cú pháp ngôn ngữ lập trình hàm Elm cách tạo giao diện đồ họa tìm hiểu tín hiệu đầu vào tƣơng tác với chƣơng trình Sau sâu vào chế vận hành ngôn ngữ Elm với tín hiệu để thấy rõ đƣợc điểm mạnh của lập trình hàm phản ứng Cũng chƣơng ta nghiên cứu trình gỡ lỗi lập trình tƣơng tác Elm Chƣơng áp dụng ngôn ngữ Elm vào để xây dựng trò chơi nhỏ thể rõ đặc điểm lập trình hàm phản ứng Qua ứng dụng trò chơi nhƣ nghiên cứu luận văn đƣa số nhận xét, đánh giá, thảo luận ƣu nhƣợc điểm lập trình phản ứng chƣơng Nhờ đánh giá mà nhà nghiên cứu ngƣời lập trình tiếp tục phát triển ngôn ngữ Elm dùng làm công cụ để tạo ứng dụng mang tính tƣơng tác cao với ngƣời sử dụng 11 TÀI LIỆU THAM KHẢO Tiếng Việt TS Phan Huy Khánh (2004), Lập trình hàm, Nhà xuất khoa học kỹ thuật, Hà Nội Tiếng Anh Matt Carkci (2014), Dataflow & Reactive Programming Systems R J Wieringa (2003) , Design Methods for Reactive Systems_ Yourdon, Statemate and the UML , Morgan Kaufmann Publishers, An imprint of Elsevier Science, 340 Pine Street, Sixth Floor , San Francisco Edward Amsden, “A Survey of Functional Reactive Programming”, Rochester Institute of Technology, eca7215@cs.rit.edu Evan Czaplicki & Stephen Chong, “Asynchronous Functional Reactive Programming for GUIs”, Havard University, United States Evan Czaplicki (30 March 2012), “Elm: Concurrent FRP for Functional GUIs” Harel,D., & Pnueli, A.(1985), “On the Development of Reactive Systems”, Springer Berlin Heidelberg Chicago Gerard Berry (1989), “Real Time Programming: Special Purpose or General Purpose Languages” (pp.11-17) IFIP Congress Conal Elliott & Paul Hudak (1997), Functional reactive animation, In Proceedings of the second ACM SIGPLAN international conference on Functional programming, ICFP ’97, pages 263–273, New York, NY, USA, 1997 ACM Website 10 http://elm-lang.org/ 11 http://voer.edu.vn/m/lap-trinh-ham/f9cb9246 12 https://gist.github.com/staltz/868e7e9bc2a7b8c1f754 12 13 http://en.wikipedia.org/wiki/Reactive_programming 14 http://open.bekk.no/making-a-collaborative-piano-using-functional-reactiveprogramming-frp 15 The Reactive Manifesto, Phublished on september 16 2014 (v2.0) http://www.reactivemanifesto.org/ 16 Martin Odersky, Principles of Reactive Programming https://www.youtube.com/watch?v=7D9QfMj_KwI 17 http://www.infoq.com/news/2013/08/reactive-programming-emerging 18 http://sean.voisen.org/blog/2013/09/intro-to-functional-reactiveprogramming/ 13 [...]... nét về lập trình hàm từ đó đi sâu về các cú pháp cơ bản của ngôn ngữ lập trình hàm Elm và cách tạo các giao diện đồ họa và tìm hiểu các tín hiệu đầu vào tƣơng tác với chƣơng trình Sau đó tôi sẽ đi sâu vào cơ chế vận hành của ngôn ngữ Elm với các tín hiệu để thấy rõ đƣợc điểm mạnh của của lập trình hàm phản ứng Cũng trong chƣơng này ta nghiên cứu về trình gỡ lỗi và lập trình tƣơng tác trong Elm Chƣơng... Chƣơng 3 sẽ áp dụng ngôn ngữ Elm vào để xây dựng một trò chơi nhỏ thể hiện rõ các đặc điểm của lập trình hàm phản ứng Qua ứng dụng trò chơi cũng nhƣ các nghiên cứu thì luận văn tôi sẽ đƣa ra một số nhận xét, đánh giá, thảo luận về ƣu nhƣợc điểm của lập trình phản ứng trong chƣơng này Nhờ những đánh giá này mà các nhà nghiên cứu và ngƣời lập trình có thể tiếp tục phát triển ngôn ngữ Elm dùng nó làm công... phản ứng trong đó Kết cấu của luận văn Luận văn của tôi trình bày ngoài phần mở đầu, mục lục, danh mục tài liệu tham khảo, kết quả đạt đƣợc thì nội dung của luận văn gồm 3 chƣơng Chƣơng 1 sẽ nghiên cứu về lập trình phản ứng, nội dung trong chƣơng sẽ nêu ra những đặc điểm về lập trình phản ứng, đặc điểm về luồng dữ liệu và xem chúng có những đặc điểm gì tƣơng đồng hay không Chƣơng 2 tôi sẽ nghiên cứu. .. chƣơng trình Các thƣ viện trong Elm cũng khá là đơn giản và đầy đủ cho phép tối ƣu hóa mã lập trình và tạo giao diện tƣơng tác ngƣời dùng một cách dễ dàng Elm là hoàn toàn hƣớng sự kiện và việc tính toán lại giá trị chỉ trừ khi một sự kiện xảy ra và nó hỗ trợ việc xử lý các luồng dữ liệu không đồng bộ Cuối cùng tôi sẽ xây đựng một trò chơi bằng ngôn ngữ Elm để thể hiện rõ đƣợc đặc điểm của lập trình phản. .. này Nhờ những đánh giá này mà các nhà nghiên cứu và ngƣời lập trình có thể tiếp tục phát triển ngôn ngữ Elm dùng nó làm công cụ để tạo ra các ứng dụng mang tính tƣơng tác cao với ngƣời sử dụng 11 TÀI LIỆU THAM KHẢO Tiếng Việt 1 TS Phan Huy Khánh (2004), Lập trình hàm, Nhà xuất bản khoa học và kỹ thuật, Hà Nội Tiếng Anh 2 Matt Carkci (2014), Dataflow & Reactive Programming Systems 3 R J Wieringa (2003)... Institute of Technology, eca7215@cs.rit.edu 5 Evan Czaplicki & Stephen Chong, “Asynchronous Functional Reactive Programming for GUIs”, Havard University, United States 6 Evan Czaplicki (30 March 2012), Elm: Concurrent FRP for Functional GUIs” 7 Harel,D., & Pnueli, A.(1985), “On the Development of Reactive Systems”, Springer Berlin Heidelberg Chicago 8 Gerard Berry (1989), “Real Time Programming: Special... (1997), Functional reactive animation, In Proceedings of the second ACM SIGPLAN international conference on Functional programming, ICFP ’97, pages 263–273, New York, NY, USA, 1997 ACM Website 10 http:/ /elm- lang.org/ 11 http://voer.edu.vn/m/lap-trinh-ham/f9cb9246 12 https://gist.github.com/staltz/868e7e9bc2a7b8c1f754 12 13 http://en.wikipedia.org/wiki/Reactive_programming 14 http://open.bekk.no/making-a-collaborative-piano-using-functional-reactiveprogramming-frp