Saturday, September 20, 2014

Những kiến thức sơ đăng về Javascript

By
1 Giới thiệu chung về Javascript :
Javascript là một ngữ lập trình kịch bản (A scripting language) được phát triển theo cú pháp của ngôn ngữ C. Rất nhiều trang web sử dụng JavaScript để thiết kế trang web động , kiểm tra dữ liệu, tạo một số hiệu ứng hình ảnh, các hiệu ứng hoạt hình thậm chí là viết game chạy trên trình duyệt (Bạn có thể tải và chơi thử các game này trên trình duyệt Chorme)… những thứ mà chỉ sử dụng HTML/CSS không thể làm được hết.
Javascript là một Client Script chỉ thực thi trên máy của người dùng, khác với các ngôn ngữ Server Script khác như ASP.NET, PHP, JSP. Tuy nhiên cũng giống như các ngôn ngữ trên bạn có thể viết xem kẽ các dùng lệnh Javascript trong nội dung của trang HTML.
Cùng với sự ra đời của HTML5 và CSS3 , Javascript được kỳ vọng tiến tới xoá bỏ toàn bộ các ứng dụng chạy bằng Flash. Hiện nay trên các thiết di động của Apple như iPhone, iPad đã không còn hỗ trợ Flash nữa. Các trình duyệt hiện đại như IE9/ IE10, Firefox, Chorme cũng dần hỗ trợ đầy đủ HTML5/CSS3 và Javascript theo chuẩn W3C, do đó công việc lập trình cũng trở nên dễ dàng và thuận tiện hơn.
Ngoài ra hiện nay cũng có rất nhiều thư viện Javascript được xây dựng sẵn, hầu hết các chức năng quen thuộc điều có sẵn, giúp các nhà phát triển Web tiết kiệm rất nhiều thời gian, đình đám hiện nay phải kể đến bộ thư viện JQuery, Threejs hay Raphaël. Các thư viện trên thực tế cũng là Javascript được chuẩn hoá lại và hiện thực sẵn rất nhiều function rất hữu ít, tuy nhiên thỉnh thoảng cũng rất nhiều hạn chế. Nắm vững về Javascript sẽ giúp bạn hiểu và sử dụng các thư viện trên dễ dàng và hiệu quả hơn, cũng như khi cần thiết chúng ta có thể tự phát triển thêm những thứ riêng cho công việc của bạn. Rất nhiều app, game chạy trên iPad hay iPhone được viết hoàn toàn bằng Javascript. Hơn nữa gần đây với sự ra đời của Node JS, một thư viện Javascript Server hứa hẹn bạn có thể lập trình một trang Web hoàn chỉnh chỉ hoàn toàn với HTML/CSS/Javascript mà không cần dùng đến PHP hay ASP.
Cuối cùng, Javascript là một ngôn ngữ lập trình rất thú vị và sinh động, nếu bạn nghiên cứu đến nơi đến chốn, tôi tin rằng bạn sẽ cảm thấy rất ngạc nhiên và thú vị giống như tôi đã từng cảm nhận. Không chỉ là những hàm ghi, kiểm tra cookie , hay kiểm tra dữ liệu liệu nhàm chán, hay những dạng hiệu ứng hình ảnh đã quá quen của jQuery mà bạn có thể thấy ở bất cứ Website nào. Javascript còn làm tốt và nhiều hơn thế nữa.
2 Cách nhúng Javascript vào trang HTML: Có 2 cách để nhúng Javascript vào một trang HTML : 
- Cách thứ nhất là bạn viết một file có đuôi là js để ở đâu đó. Rồi dùng lệnh sau để nhúng vào trang HTML :
- Cách thứ hai là bạn viết xen kẽ các dòng lệnh javascript vào trang HTML của bạn. Ví dụ :
Chú ý rằng trang HTML của bạn sẽ được trình duyệt biên dịch từ trên xuống dưới. Giả sử khi chạy đến dòng lệnh Javascript ở trên, mà trước đó bạn không có tạo ra một đối tượng DOM nào có ID là : wrapper thì câu lệnh trên sẽ bị báo lỗi.
3 Cách dùng trình duyệt để chạy Debug Javascript:
Trong quá trình lậo trình, việc bị lỗi là chuyện rất bình thường. Do đó một việc rất quan trọng đó là phải biết chạy Debug, chạy từng dòng lệnh và tìm ra lỗi. Trên hầu hết các trình duyệt hiện nay điều có tích hợp chương trình chạy Degbug và gỡ rối Javascript khá là tiện lợi. Trên Firefox thì chương trình này có giao diện khá là rối rắm bất tiện, thông thường thì bạn nên cài plugin Firebug để làm việc dễ dàng hơn. Còn trên Chorme và Safari thì tích hợp sẵn (riêng Safari mặc định thì chức năng này bị tắt bạn phải bật nó lên).
Quá trình để Debug chương trình Javascript trên Chorme có thể tóm tắt như sau (trên các trình duyệt khác hoàn toàn tương tự) :
- Bước 1: Bạn chạy file HTML có chứ đoạn Javascript bị lỗi. Trên cửa sỗ của trang Web bạn click chuột phải vào chọn : Inspect Element (Xem hình 1)

- Bước 2 : Chọn tab Sources và chọn file js mà bạn muốn Debug (ở đây mình viết mã Javascript trong một file riêng). Nhấp vào dòng lệnh bạn muốn kiểm tra (Hình 2). Khung bên phải có cửa sổ Watch Expressions để thêm biến hay biểu thức mà bạn muốn kiểm tra.


- Bước 3 : Reload lại trang web để bắt đầu chạy Debug. Bạn ấn F10 để chạy từng dòng. Ấn F11 để nhảy vào một Function con, vài ấn Shift + F11 để thoát khỏi chương trình con. (Hình 3)


Ngoài ra trong quá trình Debug bạn có thể vào tab Console để đánh thử một vài biểu thức, hay vài dòng mã Javascript để kiểm tra xem các biến các hàm của bạn viết có trả về giá trị như bạn mong muốn hay không (Hình 4)



0 comments:

Post a Comment