tek4

Giới thiệu về JavaScript

by - September. 26, 2021
Học
Kiến thức
<p><img class="aligncenter wp-image-8156 size-full" src="https://tek4.vn/wp-content/uploads/2021/02/Capture-37.png" alt="Giới thiệu về JavaScript" width="747" height="441" /></p> <p>B&agrave;i viết n&agrave;y sẽ giới thiệu về JavaScript, b&ecirc;n cạnh đ&oacute; ta sẽ c&ugrave;ng t&igrave;m hiểu về c&aacute;c c&aacute;ch kh&aacute;c nhau để thực thi đoạn m&atilde; viết bằng JavaScript tr&ecirc;n m&aacute;y t&iacute;nh của m&igrave;nh.</p> <h1>JavaScript</h1> <p>JavaScript l&agrave; một ng&ocirc;n ngữ kịch bản hướng đối tượng, đa nền tảng, được sử dụng để gi&uacute;p cho c&aacute;c trang Web c&oacute; t&iacute;nh tương t&aacute;c với người d&ugrave;ng. Ngo&agrave;i ra c&ograve;n c&oacute; c&aacute;c phi&ecirc;n bản JavaScript ph&iacute;a m&aacute;y chủ n&acirc;ng cao hơn như Node.js, cho ph&eacute;p th&ecirc;m nhiều chức năng v&agrave;o trang Web hơn. JavaScript l&agrave; một ng&ocirc;n ngữ lập tr&igrave;nh phổ biến c&oacute; t&iacute;nh ứng dụng cao. Ng&agrave;y nay, JavaScript được sử dụng trong nhiều lĩnh vực kh&aacute;c như ph&aacute;t triển ph&iacute;a m&aacute;y chủ, ph&aacute;t triển ứng dụng di động,....</p> <p>Ta c&oacute; thể thực hiện chạy c&aacute;c đoạn m&atilde; được viết bằng ng&ocirc;n ngữ JavaScript theo c&aacute;c c&aacute;ch sau:</p> <ol> <li>Sử dụng tab bảng điều khiển của tr&igrave;nh duyệt web.</li> <li>Sử dụng Node.js.</li> <li>Tạo c&aacute;c trang web.</li> </ol> <h2>1. Sử dụng tab Console của tr&igrave;nh duyệt Web</h2> <p>Tất cả c&aacute;c tr&igrave;nh duyệt Web hiện nay đều c&oacute; c&ocirc;ng cụ JavaScript được t&iacute;ch hợp sẵn. Do đ&oacute;, ta c&oacute; thể chạy đoạn m&atilde; JavaScript tr&ecirc;n tr&igrave;nh duyệt. Để chạy JavaScript tr&ecirc;n tr&igrave;nh duyệt,</p> <p><em>Bước 1: C&aacute;c bạn h&atilde;y mở tr&igrave;nh duyệt ở tr&ecirc;n m&aacute;y t&iacute;nh của m&igrave;nh (ở đ&acirc;y ch&uacute;ng ta sẽ sử dụng Google Chrome). Sau đ&oacute;, c&aacute;c bạn h&atilde;y nhấn ph&iacute;m tắt: F12.</em></p> <p><em>Bước 2: Tr&ecirc;n c&aacute;c c&ocirc;ng cụ d&agrave;nh cho nh&agrave; ph&aacute;t triển, ta sẽ chuyển đến tab bảng điều khiển l&agrave; Console. Sau đ&oacute;, viết đoạn m&atilde; JavaScript v&agrave; nhấn enter để thực thi đoạn m&atilde;.</em></p> <p><img class="aligncenter wp-image-8069 size-full" src="https://tek4.vn/wp-content/uploads/2021/02/Capture-15.png" alt="Giới thiệu về Javascript" width="1591" height="436" /></p> <h2>2. Sử dụng Node.js</h2> <p>Node l&agrave; một m&ocirc;i trường thời gian chạy để thực thi đoạn m&atilde; viết bằng JavaScript. Để chạy đoạn m&atilde; viết bằng JavaScript bằng Node.js, ta sẽ l&agrave;m theo c&aacute;c bước sau:</p> <p><em>Bước 1: C&agrave;i đặt phi&ecirc;n bản mới nhất của Node.js.</em></p> <p><em>Bước 2: C&agrave;i đặt IDE hoặc Text Editor như Visual Studio Code. Trong Visual Studio Code, c&aacute;c bạn h&atilde;y tạo một tệp v&agrave; viết đoạn m&atilde; JavaScript. Sau đ&oacute;, lưu n&oacute; với phần mở rộng .js.</em></p> <p><em>Bước 3: C&aacute;c bạn h&atilde;y mở terminal hoặc cửa sổ d&ograve;ng lệnh (Command prompt) v&agrave; điều hướng đến vị tr&iacute; nơi lưu trữ tệp, nhập t&ecirc;n file với đu&ocirc;i mở rộng l&agrave; .js m&agrave; bạn vừa tạo, sau đ&oacute; nhấn enter để thực thi đoạn m&atilde;.</em></p> <h2>3. Tạo c&aacute;c trang Web</h2> <p>Ban đầu, JavaScript được tạo ra để l&agrave;m cho c&aacute;c trang Web c&oacute; t&iacute;nh tương t&aacute;c, đ&oacute; l&agrave; l&yacute; do tại sao JavaScript v&agrave; HTML thường được sử dụng với nhau. Để chạy đoạn m&atilde; JavaScript từ một trang Web, ta sẽ l&agrave;m theo c&aacute;c bước sau:</p> <p><em>Bước 1: Mở Visual Studio Code, tạo một tệp mới v&agrave; lưu n&oacute; với phần mở rộng l&agrave; .html.</em></p> <p>V&iacute; dụ, ta sẽ tạo một file l&agrave; index.html. Sau đ&oacute;, ta sẽ sao ch&eacute;p đoạn m&atilde; HTML hợp lệ tối thiểu v&agrave; lưu v&agrave;o tệp.</p> <pre class="lang:default decode:true EnlighterJSRAW">&lt;!doctype html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;/head&gt; &lt;body&gt; &lt;script src=""&gt;//Đoạn m&atilde; JavaScript thực thi ở đ&acirc;y&lt;/script&gt; &lt;/body&gt; &lt;/html&gt;</pre> <p><em>Bước 2: Ch&egrave;n đoạn m&atilde; JavaScript</em></p> <p>C&aacute;ch thứ nhất, ta c&oacute; thể viết đoạn m&atilde; JavaScript trực tiếp v&agrave;o trong file với đu&ocirc;i mở rộng l&agrave; .html, v&agrave; đặt đoạn m&atilde; JS v&agrave;o trong thẻ <strong>&lt;script&gt;.&nbsp;</strong>V&iacute; dụ:</p> <pre class="lang:default decode:true EnlighterJSRAW">&lt;!doctype html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;/head&gt; &lt;body&gt; &lt;script&gt; console.log("JavaScript"); &lt;/script&gt; &lt;/body&gt; &lt;/html&gt;</pre> <p>Hoặc c&aacute;ch thứ hai l&agrave; tạo một tệp JavaScript với phần mở rộng l&agrave; .js, viết đoạn m&atilde; JavaScript v&agrave; lưu n&oacute; với phần mở rộng .js như index.js. File index.js c&oacute; nội dung như sau:</p> <pre class="EnlighterJSRAW" data-enlighter-language="js">console.log("JavaScript");</pre> <p>Từ b&ecirc;n trong tệp HTML, ch&uacute;ng ta sẽ li&ecirc;n kết File index.js để sử dụng đoạn m&atilde; viết bằng JavaScript. Ta c&oacute; thể th&ecirc;m đoạn m&atilde; sau v&agrave;o File index.html.</p> <pre class="lang:default decode:true EnlighterJSRAW">&lt;script src="index.js"&gt;&lt;/script&gt;</pre> <p>Tiếp theo, mở tệp index.html bằng tr&igrave;nh duyệt (Ở đ&acirc;y, ta sử dụng tr&igrave;nh duyệt Chrome). Để kiểm tra xem đoạn m&atilde; được viết bằng JavaScript của m&igrave;nh đ&atilde; chạy hay chưa, ta sẽ nhấn ph&iacute;m tắt F12, chọn v&agrave;o tab Console tr&ecirc;n tr&igrave;nh duyệt để xem kết quả.</p> <p><img class="aligncenter wp-image-8070 size-full" src="https://tek4.vn/wp-content/uploads/2021/02/Capture-16.png" alt="Giới thiệu về Javascript" width="1201" height="320" /></p> <p>Như vậy, lệnh console.log("JavaScript") sẽ in ra chuỗi k&yacute; tự l&agrave; "JavaScript" tr&ecirc;n m&agrave;n h&igrave;nh Console của tr&igrave;nh duyệt.</p> <p>B&acirc;y giờ ta đ&atilde; biết c&aacute;ch thực thi đoạn m&atilde; được viết bằng ng&ocirc;n ngữ JavaScript, ta sẽ c&ugrave;ng bắt đầu t&igrave;m hiểu c&aacute;c nguy&ecirc;n tắc cơ bản của JavaScript trong c&aacute;c b&agrave;i viết tiếp theo.</p> <p>Tr&ecirc;n đ&acirc;y l&agrave; c&aacute;c kh&aacute;i niệm cơ bản giới thiệu về JavaScript. Hy vọng mọi người c&oacute; thể &aacute;p dụng v&agrave;o trong chương tr&igrave;nh của m&igrave;nh. Mọi người h&atilde;y tiếp tục theo d&otilde;i c&aacute;c b&agrave;i tiếp theo v&agrave; cập nhật c&aacute;c b&agrave;i tiếp theo về lập tr&igrave;nh JavaScript tr&ecirc;n <a href="http://tek4.vn">tek4</a> nh&eacute;!</p> <p>P/s: Cảm ơn mọi người đ&atilde; tin tưởng tek4!</p>