http://vietjack.com/javascript/index.jsp Copyright © vietjack.com Debug JavaScript Trong mã hóa chương trình, nhà lập trình tạo lỗi Một lỗi chương trình script xem bug Tiến trình tìm kiếm sửa bug gọi dubugging phần bình thường tiến trình lập trình Chương giới thiệu số cơng cụ cơng nghệ mà giúp bạn với nhiệm vụ debug Thông báo lỗi IE Cách đơn giản để phát lỗi bật thông tin lỗi trình duyệt bạn Theo mặc định, IE biểu tượng lỗi trạng thái lỗi xảy trang Nhấn đúp chuột vào biểu tượng hiển thị hộp thoại thông tin lỗi cụ thể xảy Khi biểu tượng dễ bị coi nhẹ (hay khó quan sát), IE cung cấp cho bạn tùy chọn để tự động hiển thị thông báo lỗi lỗi xảy Để kích hoạt chức này, chọn Tools → Internet Options → Advanced tab kiểm tra hộp tùy chọn "Display a Notification About Every Script Error" hình http://vietjack.com/ Trang chia sẻ học online miễn phí Page http://vietjack.com/javascript/index.jsp Copyright © vietjack.com Thông báo lỗi Firefox Mozilla Các trình duyệt khác Firefox, Netscape Mozilla gửi thơng báo lỗi tới cửa sổ đặc biệt gọi JavaScript Console Error Consol Để quan sát bàn điều khiển này, chọn Tools → Error Consol Web Development Khơng may là, trình duyệt cung cấp dẫn khơng nhìn thấy lỗi xảy ra, bạn phải giữ bàn điểu khiển Console mở so khớp cho lỗi script bạn thực thi http://vietjack.com/ Trang chia sẻ học online miễn phí Page http://vietjack.com/javascript/index.jsp Copyright © vietjack.com Các khai báo lỗi (Error Notification) Error Notification mà hiển thị Console thông qua hộp thoại IE kết lỗi Syntax Error Runtime Error Những khai báo lỗi bao gồm số dòng lỗi xảy Nếu bạn sử dụng Firefox, bạn click vào lỗi có Console để tới xác dòng script mà có lỗi Cách để debug Script Có nhiều cách để debug lỗi JavaScript bạn: Sử dụng JavaScript Validator Một cách để kiểm tra code có bug lạ để chạy thơng qua chương trình mà kiểm tra để đảm bảo hợp lệ tuân theo qui tắc cú pháp thức ngơn ngữ Những chương trình gọi validating parsers validators, thường với soạn HTML JavaScript thương mại Validator tiện lợi cho JavaScript Douglas Crockford JavaScript Lint, mà có sẵn miễn phí tại: Douglas Crockford's JavaScript Lint Bạn ghé thăm trang web này, paste JavaScript code vào khu vực văn cho, nhấn nút jslint Chương trình phân tích JavaScript code bạn, đảm bảo tất định nghĩa biến hàm tuân theo cú pháp xác Nó kiểm tra lệnh JavaScript, if while, để đảm bảo chúng tuân theo định dạng xác Thêm Debugging code tới chương trình bạn Bạn sử dụng phương thức alert() document.write() chương trình bạn để debug Ví dụ, bạn viết sau: var debugging = true; var whichImage = "widget"; if( debugging ) alert( "Calls swapImage() with argument: " + whichImage ); var swapStatus = swapImage( whichImage ); if( debugging ) http://vietjack.com/ Trang chia sẻ học online miễn phí Page http://vietjack.com/javascript/index.jsp Copyright © vietjack.com alert( "Exits swapImage() with swapStatus=" + swapStatus ); Bằng việc kiểm tra nội dung trình tự alert() chúng xuất hiện, bạn kiểm tra chương trình bạn dễ dàng Sử dụng JavaScript Debugger Một Debugger ứng dụng mà đặt tất khía cạnh việc thực thi script điều khiển nhà lập trình Debugger cung cấp điều khiển Fine-Grained (Điều khiển phân định tinh tế) qua trạng thái script thông qua giao diện mà cho phép bạn kiểm tra thiết lập giá trị điều khiển luồng việc thực thi Một script tải vào debugger, chạy dòng thời điểm dẫn để dừng điểm dừng (Breakpoint) Khi việc thực thi bị dừng, nhà lập trình kiểm tra trạng thái script biến để định làm điều có bị lỗi Bạn quan sát biến với thay đổi giá trị chúng Phiên Mozilla JavaScript Debugger (tên Venkman) cho trình duyệt Mozilla Netscape tại: http://www.hacksrus.com/~ginda/venkman Chỉ dẫn hữu ích cho nhà lập trình Bạn nên nhớ tip sau để giảm số lượng lỗi script bạn làm đơn giản hóa tiến trình debug Sử dụng nhiều comments Các comment cho bạn khả giải thích bạn viết script, cách bạn thực để giải thích khu vực cụ thể phức tạp code Luôn sử dụng indentation (sự thụt code) để làm code bạn dễ dàng đọc Các lệnh thụt vào làm dễ với bạn để so khớp thẻ bắt đầu kết thúc, dấu ngoặc, phần tử HTML script khác Viết modular code Bất có thể, nhóm lệnh vào hàm Các hàm giúp bạn tạo nhóm lệnh liên quan nhau, kiểm tra tái sử dụng phần code mà không nhiều công sức Nhất quán cách đặt tên biến hàm Nói cách khác, giữ tất chúng dạng chữ thường chữ hoa; bạn ưa thích Camel-Back Notation, sử dụng cách quán http://vietjack.com/ Trang chia sẻ học online miễn phí Page http://vietjack.com/javascript/index.jsp Copyright © vietjack.com Sử dụng tên biến đủ dài có ý nghĩa mà miêu tả nội dung hàm biến Kiểm tra script dài Modular Fashion Nghĩa là, đừng cố gắng viết toàn script trước kiểm tra phần Viết phần thực thi trước thêm phần tới vào code Sử dụng tên biến hàm có tính miêu tả cao tránh sử dụng tên đơn ký tự Quan sát dấu trích dẫn Nhớ dấu trích dẫn sử dụng cặp bao quanh chuỗi phải sử dụng kiểu giống (hoặc đơn kép) Kiểm tra dấu Bạn không nên sử dụng dấu đơn (=) cho mục đích so sánh Khai báo biến cách rõ ràng sử dụng từ khóa var http://vietjack.com/ Trang chia sẻ học online miễn phí Page ... HTML JavaScript thương mại Validator tiện lợi cho JavaScript Douglas Crockford JavaScript Lint, mà có sẵn miễn phí tại: Douglas Crockford's JavaScript Lint Bạn ghé thăm trang web này, paste JavaScript. .. ); var swapStatus = swapImage( whichImage ); if( debugging ) http://vietjack.com/ Trang chia sẻ học online miễn phí Page http://vietjack.com /javascript/ index.jsp Copyright © vietjack.com alert(... mở so khớp cho lỗi script bạn thực thi http://vietjack.com/ Trang chia sẻ học online miễn phí Page http://vietjack.com /javascript/ index.jsp Copyright © vietjack.com Các khai báo lỗi (Error Notification)