JavaScript là gì? Kiến thức cơ bản về ngôn ngữ lập trình JS

Vinh Phạm

2048

23-11-2018

Javascript có thể ứng dụng cùng với các ngôn ngữ thiết kế khác như HTML, CSS giúp tạo thiết kế website động. Vậy Javascript là gì?. Cùng tìm hiểu thông tin trong bài viết dưới đây nhé. 

JavaScript là gì? 

Javascript là một ngôn ngữ lập trình thông dịch được sử dụng ở phía máy khách và phía máy chủ, cho phép tạo các trang web có các hình động chuyên nghiệp. JavaScript được hỗ trợ bởi hầu hết các trình duyệt web: Chrome, Firefox, Safari, Internet Explorer, Edge, Opera,... Hầu hết các trình duyệt di động cho điện thoại thông minh đều hỗ trợ JavaScript. 

JavaScript chủ yếu được sử dụng cho các website nhằm cung cấp cho người dùng trải nghiệm thân thiện hơn, bao gồm các chức năng: tự động cập nhật các trang web, cải tiến giao diện người dùng như menu và hộp thoại, animations, đồ họa 2D và 3D, bản đồ tương tác, trình phát video... Chế độ sử dụng JavaScript này trong trình duyệt web cũng được gọi là javascript phía máy khách.

Bộ ba trang web

Các thành phần tạo nên một trang web bao gồm bộ ba JavaScript, HTML và CSS. 

• HTML mô tả trang, bao gồm văn bản, đồ họa. 
• CSS được sử dụng để kiểm soát và tùy chỉnh giao diện của trang web, bao gồm màu sắc, phông chữ... 
• JavaScript được sử dụng để thêm thành phần động vào trang web và tạo nên các yếu tố có thể lập trình được.

Lịch sử JavaScript

JavaScript được bắt đầu vào năm 1995 tại Netscape Communications. Vào thời gian này, các nhà sản xuất Netscape browser nhận ra rằng, việc thêm một "glue language" để nâng cao trải nghiệm người dùng sẽ làm tăng sự tiêu thụ nội dung của người dùng. Vì vậy, họ đã đưa Brendan Eich nhúng vào Scheme Programming language. Tuy nhiên, tại thời điểm đó, Java hiện là một ngôn ngữ mới, nóng hổi của website, nên họ đã quyết định làm cho ngôn ngữ này gần gũi với cú pháp của Java. Kết quả đem lại chính là JavaScript, với các tính năng của Scheme, định hướng đối tượng của SmallTalk và cú pháp của Java. Phiên bản đầu tiên của ngôn ngữ này được đặt tên là Mocha vào tháng 5 năm 1995, đổi tên thành LiveScript vào tháng 9 năm 1995, và được đổi tên thành JavaScript vào tháng 12 năm 1995.

Năm 1996, JavaScript đã được gửi đến ECMA International để hoàn thiện trở thành, một đặc tính kỹ thuật tiêu chuẩn. Vào tháng 6 năm 1997, đặc tính kỹ thuật chính thức đầu tiên cho ngôn ngữ được phát hành là ECMA-262. Phiên bản mới nhất của ngôn ngữ là ECMAScript 2017 được phát hành vào tháng 6 năm 2017.

Bạn có thể làm gì với JavaScript?

JavaScript là một trình thông dịch ngôn ngữ lập trình chính thức được nhúng bên trong trình duyệt web. Bạn có thể thực hiện bất cứ điều gì trong JavaScript mà một ngôn ngữ thông thường như Java cho phép. Bao gồm:

• Khai báo biến
• Lưu trữ và truy vấn giá trị
• Xác định và gọi hàm
• Xác định các classes của riêng bạn
• Tải và sử dụng các mô-đun bên ngoài
• Viết trình xử lý sự kiện trả lời người dùng và các sự kiện khác

Web browser tải một web page, phân tích cú pháp HTML và tạo ra Document Object Model (DOM) từ content. DOM hiển thị chế độ xem trực tiếp của trang web với mã JavaScript. Sau đó, code có thể thực hiện các cập nhật cho DOM và hiển thị ngay lập tức cho người dùng. Browser cho phép bạn đăng ký code để được thông báo về các user interface events như di chuyển chuột, nhấp nút... Sử dụng tất cả các tiện ích này, bạn có thể xây dựng các ứng dụng để phục vụ bất kỳ mục đích nào theo nhu cầu.

Lưu ý: JavaScript là một ngôn ngữ rất mạnh mẽ, nên bạn cũng có thể dùng nó để viết malware, viruses, browser hijackers và các lỗi khác gây ảnh hưởng tới người dùng từ ăn cắp cookie trình duyệt, mật khẩu, thẻ tín dụng, tải virus vào máy tính…

JavaScript hoạt động như thế nào?

Khi web browser tải một web page, HTML parser bắt đầu phân tích cú pháp HTML code và tạo DOM. Bất cứ khi nào trình phân tích cú pháp gặp một chỉ thị CSS hoặc JavaScript (inline hoặc externally loaded), nó sẽ được chuyển giao cho CSS parser hoặc JavaScript engine theo yêu cầu. 

JavaScript engine tải các tệp JavaScript bên ngoài và inline code, nhưng không chạy mã ngay lập tức, mà đợi HTML và CSS phân tích hoàn tất. Khi điều này được thực hiện, JavaScript được thực thi theo thứ tự chúng được tìm thấy trên trang web: các biến và hàm được xác định, các lời gọi hàm được thực thi, trình xử lý sự kiện được kích hoạt,... Các hoạt động này dẫn đến việc DOM được cập nhật bởi JavaScript và được hiển thị ngay lập tức bởi trình duyệt.

Hướng dẫn tải một tệp javascript

Tải JavaScript trong trang web

Cách phổ biến nhất để tải JavaScript trong web page là sử dụng script HTML tag. Tùy thuộc vào nhu cầu, bạn có thể sử dụng một trong các phương pháp sau.

Tải một tệp javascript bên ngoài vào một trang web như sau:

<script type="text/javascript" src="/path/to/javascript"></script>

Bạn có thể chỉ định URL đầy đủ nếu javascript từ một tên miền khác từ trang web như sau:

<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>

JavaScript có thể được nhúng trực tiếp vào HTML. Điều sau đây làm cho trang web popup một alert box khi nó được tải.

<script type="text/javascript">

alert("Page is loaded");

</script>

Ngoài các phương thức này, có nhiều cách để tải mã JavaScript theo yêu cầu. Trên thực tế, có toàn bộ frameworks dành riêng cho việc tải và chạy các mô-đun JavaScript với các phụ thuộc thích hợp được giải quyết trong thời gian chạy.

Một số đoạn mã JavaScript mẫu

Dưới đây là một số mẫu mã JavaScript đơn giản để minh họa mức độ dễ sử dụng trên trang web của bạn.

Chọn tất cả các phần tử in đậm trong tài liệu và đặt màu của phần tử đầu tiên thành màu đỏ.

var elems = document.getElementsByTagName('b');

elems[0].style.color = 'red';

Bạn muốn thay đổi hình ảnh trong img tag? Hãy liên kết event handler cho click event của một nút.

<img id="myImg" src="prev-image.png">

<button Image</button>

Cập nhật text content của paragraph (p) element? Đặt thuộc tính innerHTML của phần tử như sau:

<p id="first-para">Hello World</p>

<button = "Welcome to JavaScript!"'>Click me</button>

Các mẫu code này chỉ cung cấp một cái nhìn tổng quan về những gì bạn có thể làm bằng cách sử dụng JavaScript trên trang web.

Ưu, nhược điểm nổi bật của JavaScript

Không có ngôn ngữ lập trình nào là hoàn hảo. Đó là lý do tại sao một ngôn ngữ mới lại trở nên phổ biến vài năm một lần để đáp ứng nhu cầu của thời đại đó. Giống như mọi ngôn ngữ lập trình khác, JavaScript cũng có những ưu điểm và nhược điểm riêng dưới đây:

1. Ưu điểm của JavaScript

• Tốc độ - JavaScript là một ngôn ngữ thông dịch, nó cắt giảm thời gian cần thiết để biên dịch trong các ngôn ngữ lập trình khác. Ngoài ra, tất cả các trình duyệt đều hỗ trợ JIT compiler cho JavaScript, có nghĩa là không cần phải biên dịch mã trước khi chạy JavaScript.
• Tính đơn giản - JavaScript có cấu trúc đơn giản, rất dễ hiểu và dễ triển khai. Cấu trúc của JavaScript được lấy cảm hứng từ Java và tương đối dễ học so với các ngôn ngữ khác như C ++.
• Tính phổ biến - Có vô số tài nguyên để học JavaScript. Cả StackOverflow và GitHub đều cho thấy số lượng project sử dụng JavaScript ngày càng tăng và sức hút của nó dự kiến sẽ tăng lên trong những năm tới.
• Khả năng tương tác - Không giống như PHP hoặc các ngôn ngữ Script khác, JavaScript có thể được chèn vào bất kỳ trang web nào. JavaScript có thể được sử dụng trong nhiều loại ứng dụng khác nhau vì hỗ trợ các ngôn ngữ khác như Pearl và PHP.
• Server Load - JavaScript là ngôn ngữ client-side, bất kể JavaScript được lưu trữ ở đâu, nó luôn được chạy trong môi trường máy khách để giảm sử dụng băng thông và tăng tốc độ thực thi; các ứng dụng đơn giản có thể không cần máy chủ.
• Giao diện phong phú - JavaScript có thể được sử dụng để tạo các tính năng như kéo thả và các thành phần như slider, tất cả đều cải thiện đáng kể giao diện người dùng và trải nghiệm của một trang web.
• Chức năng mở rộng - Các nhà phát triển có thể mở rộng chức năng của các trang web bằng cách viết các đoạn code JavaScript cho các tiện ích bổ sung của bên thứ ba.
• Tính linh hoạt - Có nhiều cách để sử dụng JavaScript thông qua máy chủ Node.js. Nếu bạn khởi động Node.js bằng Express, sử dụng document database như MongoDB và sử dụng JavaScript trên giao diện người dùng cho client, bạn có thể phát triển toàn bộ ứng dụng JavaScript từ back-end đến front-end chỉ bằng JavaScript.
• Cập nhật liên tục - Kể từ khi ECMAScript 5 ra đời, ECMA International đã ưu tiên cập nhật JavaScript hàng năm. Cho đến nay, chúng ta đã nhận được hỗ trợ trình duyệt cho ES6 vào năm 2017 và ES7 sẽ được hỗ trợ trong tương lai.

2. Nhược điểm của JavaScript 

• Vấn đề bảo mật phía máy khách - Vì code JavaScript được thực thi ở phía máy khách, các lỗi và thông tin chi tiết đôi khi có thể bị khai thác cho các mục đích xấu.
• Vấn đề hỗ trợ trình duyệt - Trong khi các server-side scripts luôn tạo ra cùng một output, các trình duyệt khác nhau đôi khi thông dịch code JavaScript khác nhau. Do đó, trước khi xuất bản, code cần chạy trên nhiều nền tảng khác nhau. Cần kiểm tra các trình duyệt cũ hơn vì một số chức năng mới không được hỗ trợ.
• Kế thừa - JavaScript không hỗ trợ đa kế thừa; chỉ một thừa kế được hỗ trợ.
• Không thể debug - Mặc dù một số HTML editor cho phép debug, nhưng C hoặc C ++ lại không hỗ trợ. Ngoài ra, nhà phát triển gặp khó khăn trong việc tìm ra vấn đề vì trình duyệt không hiển thị bất kỳ lỗi nào.
• Dừng hiển thị bất ngờ - Toàn bộ code JavaScript của trang web có thể ngừng hiển thị do một lỗi duy nhất trong code.

So sánh JavaScript với các ngôn ngữ lập trình khác

Dưới đây là bảng nhanh để so sánh các ngôn ngữ lập trình khác nhau và đặc điểm của chúng.

Bạn có thể thấy:

• C# được sử dụng cho backend trang web và cách học không hề đơn giản
• Python chủ yếu được sử dụng cho Khoa học dữ liệu và backend trang web
• Ruby được sử dụng cho các tập lệnh và backend trang web
• JavaScript được sử dụng trong các ứng dụng Web Front-End, Back-End, Mobile app, desktop app và thậm chí cả TV app.

Kết luận

Hy vọng rằng, phần giới thiệu này đã mang lại một số hiểu biết về JavaScript và giúp bạn hứng thú hơn với lập trình web nói chung và JavaScript nói riêng.

Bạn đang sử dụng (hoặc lập kế hoạch sử dụng) JavaScript trên trang web của bạn như thế nào?

Theo Bizfly Cloud chia sẻ