programming php

Giải thích bao đóng trong php là gì và tại sao nó lại sử dụng mã định danh “sử dụng”?

Kể từ khi được phát hành vào ngày 4 tháng 12 năm 1995 [sáu tháng sau Java, được phát hành vào ngày 23 tháng 5 năm 1995], JavaScript đã trải qua nhiều thay đổi. JavaScript bắt đầu là ngôn ngữ lập trình phía máy khách [chạy bên trong trình duyệt web thông qua công cụ JavaScript tích hợp] để thêm nội dung tương tác vào trang web. Nó trở nên mạnh mẽ hơn với DHTML [1997] và Ajax [1999]. với nút. js [phát hành vào ngày 27 tháng 5 năm 2009], JavaScript có thể được sử dụng để lập trình phía máy chủ và xây dựng các ứng dụng web đầy đủ, cũng như các tập lệnh tiện ích độc lập. Vào năm 2015, ECMAScript 6 [ES6 hoặc ES2015] giới thiệu bản cập nhật lớn cho ngôn ngữ, chẳng hạn như các lớp và mô-đun, đồng thời biến JavaScript thành ngôn ngữ lập trình đa năng có khả năng thực hiện các tác vụ phần mềm phức tạp

Giới thiệu

Nó bắt đầu dưới dạng Ngôn ngữ lập trình phía máy khách chạy bên trong trình duyệt web thông qua Công cụ JavaScript tích hợp

JavaScript là ngôn ngữ lập trình phía máy khách được sử dụng rộng rãi nhất cho phép bạn nâng cấp HTML của mình bằng tính tương tác, hoạt ảnh và hiệu ứng hình ảnh động để có Giao diện người dùng và Trải nghiệm người dùng [UI/UX] tốt hơn. Nó là

một ngôn ngữ kịch bản nhỏ, nhẹ, hướng đối tượng, đa nền tảng, có mục đích đặc biệt được chạy trong môi trường máy chủ [thường là trình duyệt web]
ngôn ngữ kịch bản phía máy khách để làm phong phú thêm giao diện người dùng web và tạo các trang web động [e. g. , vì. xác thực đầu vào và phản hồi ngay lập tức cho hành động của người dùng]
công cụ hỗ trợ AJAX [JavaScript và XML không đồng bộ - có thể được sử dụng để cập nhật một phần của trang web một cách không đồng bộ], tạo ra sự quan tâm mới đối với JavaScript

JavaScript hoạt động cùng với HTML/CSS. HTML cung cấp nội dung; . Cùng nhau, chúng làm phong phú UI/UX của người dùng web

JavaScript hiện có ở mọi nơi với Node. js

JavaScript đã phát triển vượt ra ngoài lập trình phía máy khách. Với sự ra đời của Node. js vào năm 2009 [môi trường thời gian chạy JavaScript đa nền tảng, mã nguồn mở], bạn có thể chạy JavaScript độc lập hoặc bên trong máy chủ [thay vì trình duyệt]. Điều này cho phép bạn sử dụng một ngôn ngữ duy nhất cho cả lập trình phía máy chủ và phía máy khách

Lịch sử và Phiên bản

JavaScript, ban đầu được gọi là LiveScript, được tạo bởi Brendan Eich tại Netscape vào năm 1995. Ngay sau đó, Microsoft đã tung ra phiên bản JavaScript của riêng mình có tên là JScript. Sau đó, Netscape gửi nó lên ECMA [trước đây là "Hiệp hội các nhà sản xuất máy tính châu Âu", nay là "Ecma International - hiệp hội tiêu chuẩn hóa hệ thống thông tin và truyền thông châu Âu"] để chuẩn hóa, cùng với JScript của Microsoft.

Đặc tả ECMA được gọi là "Đặc tả ngôn ngữ ECMA-262 ECMAScript" @ http. //www. ecma-quốc tế. org/ấn phẩm/tiêu chuẩn/Ecma-262. htm [cũng được phê duyệt là "ISO/IEC 16262"]

ECMA-262 phiên bản 1 [tháng 6 năm 1997]. Ấn bản đầu tiên
ECMA-262 phiên bản 2 [tháng 8 năm 1998]
ECMA-262 phiên bản 3 [12/1999]. Đã thêm biểu thức chính quy, thử/bắt, chuyển đổi, do-while, v.v.
ECMA-262 phiên bản 4 - Bị bỏ rơi do sự khác biệt về chính trị. Vào năm 2007, TC-39 [ủy ban chịu trách nhiệm về ECMAScript] đã đưa ra một đặc điểm kỹ thuật dự thảo cho ECMAScript 4, có quy mô lớn và giới thiệu nhiều cú pháp và tính năng mới. Nhưng một nhóm các nhà phát triển từ Yahoo, Google và Microsoft cảm thấy như vậy là quá nhiều và đã tạo ra một đề xuất thay thế có tên là ECMAScript 3. 1. ECMAScript 4 chưa bao giờ được hoàn thiện
ECMA-262 phiên bản 5 và 5. 1 [tháng 6 năm 2011]. ECMAScript 3. 1 cuối cùng đã được chuẩn hóa thành ECMAScript 5. Đã thêm "chế độ nghiêm ngặt", phương thức lặp JSON, Array, v.v.
ECMA-262 2015. phổ biến nhất được gọi là ECMAScript 6 hoặc ES6
Phiên bản này đã thêm cú pháp mới quan trọng để viết ứng dụng phức tạp, bao gồm khai báo lớp,
```
if [ condition-1 ] {
   block-1 ;
} else if [ condition-2 ] {
   block-2 ;
} else if [ condition-3 ] {
   block-3 ;
......
......
} else {
   block-n ;
}
```
7 cho khai báo cục bộ,
```
if [ condition-1 ] {
   block-1 ;
} else if [ condition-2 ] {
   block-2 ;
} else if [ condition-3 ] {
   block-3 ;
......
......
} else {
   block-n ;
}
```
8 cho khai báo hằng cục bộ, giá trị tham số mặc định, bộ lặp và cho. vòng lặp, trình tạo kiểu Python, biểu thức hàm mũi tên [_______0_______9], dữ liệu nhị phân, mảng đã nhập, bộ sưu tập mới [bản đồ, tập hợp và Bản đồ yếu], lời hứa, sự phản chiếu, proxy, chữ mẫu cho chuỗi, v.v.
ECMAScript 2016 [ES7]. Kể từ ES6, các tiêu chuẩn ECMAScript sẽ có chu kỳ phát hành hàng năm vào tháng 6
Phiên bản này đã thêm toán tử hàm mũ [
```
  
  JavaScript Example: Loop


  Testing Loop
  
```
0], phạm vi khối của các biến và hàm, từ khóa
```
  
  JavaScript Example: Loop


  Testing Loop
  
```
1 và
```
  
  JavaScript Example: Loop


  Testing Loop
  
```
2 cho lập trình không đồng bộ, v.v.
ECMAScript 2017 [ES8]. Đã thêm phần đệm chuỗi, các hàm không đồng bộ sử dụng trình tạo và lời hứa,
```
  
  JavaScript Example: Loop


  Testing Loop
  
```
3,
```
  
  JavaScript Example: Loop


  Testing Loop
  
```
4 để thao tác đối tượng dễ dàng, v.v.
ECMAScript 2018 [ES9]. Đã thêm tham số phần còn lại [
```
  
  JavaScript Example: Loop


  Testing Loop
  
```
5], toán tử trải rộng, phép lặp không đồng bộ, bổ sung cho biểu thức chính quy

ECMAScript 2019 [ES10]. Đã thêm





  
  JavaScript Example: Loop


  Testing Loop





  
  JavaScript Example: Loop


  Testing Loop

7, thay đổi





  
  JavaScript Example: Loop


  Testing Loop

8 và





  
  JavaScript Example: Loop


  Testing Loop

9, ràng buộc bắt trở thành tùy chọn, v.v.

ECMAScript 2020 [ES11]. giới thiệu một kiểu nguyên thủy

for [ initialization ; test ; post-processing ] {
   body ;
}

0 cho các số nguyên có kích thước tùy ý, toán tử kết hợp nullish [

for [ initialization ; test ; post-processing ] {
   body ;
}

1] và đối tượng

for [ initialization ; test ; post-processing ] {
   body ;
}

ECMAScript 2021 [ES12]. Đã thêm tính năng nâng cao cho chuỗi [

for [ initialization ; test ; post-processing ] {
   body ;
}

3], lời hứa [

for [ initialization ; test ; post-processing ] {
   body ;
}

4] và tham chiếu đối tượng. Toán tử gán logic [

for [ initialization ; test ; post-processing ] {
   body ;
}

for [ initialization ; test ; post-processing ] {
   body ;
}

for [ initialization ; test ; post-processing ] {
   body ;
}

7,]

JavaScript so với. Java

Java là một ngôn ngữ lập trình đa năng chính thức. Nó được tạo ra bởi James Gosling tại Sun Microsystems [nay là một phần của Oracle] và phát hành vào tháng 8 năm 1995

JavaScript được tạo bởi Brendan Eich tại Netscape, cũng vào năm 1995. Ban đầu được gọi là LiveScript, nó là một ngôn ngữ chuyên dụng nhỏ và nhẹ để viết chương trình phía máy khách chạy bên trong trình duyệt để tạo giao diện người dùng hoạt động và tạo các trang web động. Nó được đổi tên thành JavaScript trong một quyết định tiếp thị tồi tệ nhằm cố gắng tận dụng sự phổ biến của ngôn ngữ Java, khi Netscape phát hành Navigator 2 vào năm 1996

Java và JavaScript là các ngôn ngữ hoàn toàn khác nhau cho các mục đích lập trình khác nhau. Tuy nhiên, trong những ngày đầu, một số nỗ lực đã được thực hiện để áp dụng cú pháp và quy ước của Java vào JavaScript, vì vậy JavaScript dường như là một tập hợp con của Java. Trên thực tế, chúng có rất ít điểm chung

JavaScript phía máy khách KHÔNG THỂ làm gì?

Hãy nhớ rằng JavaScript là chương trình phía máy khách mà bạn đã tải xuống từ máy chủ và chạy bên trong trình duyệt của máy [máy khách] của bạn. Làm gì để ngăn ai đó viết JavaScript xóa sạch đĩa cứng của bạn hoặc kích hoạt một cuộc tấn công từ chối dịch vụ tới một máy chủ khác?

Nó không thể đọc tệp từ máy của khách hàng
Nó chỉ có thể kết nối với máy chủ mà nó đến từ đó. Nó có thể đọc tệp từ máy chủ mà nó đến từ. Nó không thể ghi tập tin vào máy chủ
Nó không thể kết nối với máy chủ khác
Nó không thể đóng một cửa sổ mà nó không mở

jQuery

jQuery là một thư viện JavaScript đa trình duyệt phổ biến. jQuery là JavaScript [nhưng có cú pháp mở rộng riêng], do đó, bạn cần hiểu JavaScript. Tôi khuyên bạn nên đọc qua cú pháp JavaScript [và đặc biệt chú ý đến các đối tượng], sau đó chuyển sang jQuery để sản xuất. Đọc "Thông tin cơ bản về jQuery"

JavaScript độc lập và phía máy chủ với nút. Công cụ JavaScript js

[LÀM]

Trình chỉnh sửa mã nguồn JavaScript và IDE

Bạn cần một trình soạn thảo văn bản để viết JavaScript của mình. Bạn có thể sử dụng trình soạn thảo văn bản thuần túy như NotePad của Windows hoặc TextEdit của macOS [KHÔNG được khuyến nghị nghiêm ngặt vì chúng không thể tô sáng cú pháp]. Để cải thiện năng suất của bạn, một trình chỉnh sửa mã nguồn tốt [cung cấp tính năng đánh dấu cú pháp, tự động hoàn tất mã, đoạn mã, tài liệu, điều hướng biểu tượng, tái cấu trúc, v.v. ] là điều cần thiết. Có rất nhiều phần mềm miễn phí/phần mềm chia sẻ, chẳng hạn như Visual Studio Code [VS Code], Sublime Text, Atom, Brackets, Komodo Edit, Emacs, Vim, BBEdit, TextMate, NotePad++ [Windows], v.v. Bạn cũng có thể sử dụng IDE quy mô đầy đủ như Eclipse, NetBeans, IntelliJ IDEA. Ngoài ra còn có nhiều trình soạn thảo và trình biên dịch "trực tuyến" [e. g. , Programiz, JSFiddle, Playcode], nhưng tôi nghĩ rằng bạn nên cài đặt của riêng mình

Ví dụ JavaScript phía máy khách

Tôi sẽ cho rằng bạn biết HTML và CSS [hãy đọc các bài viết về HTML/CSS của tôi nếu không]. Tôi cũng sẽ giả định rằng bạn hiểu một số điều cơ bản về lập trình [tư duy tính toán] chẳng hạn như biến, cấu trúc if-else và vòng lặp for

JavaScript phía máy khách chạy bên trong trình duyệt thông qua công cụ JavaScript tích hợp. Có các tiêu chuẩn về JavaScript. Nhưng Big-5 [Chrome, Firefox, IE/Edge, Safari và Opera], đặc biệt là IE, không tuân thủ nghiêm ngặt tất cả các tiêu chuẩn. Hơn nữa, họ tạo tiện ích mở rộng của riêng mình. Do đó, hành vi của JavaScript có thể khác nhau trong các trình duyệt khác nhau. Bạn có thể cần kiểm tra JavaScript của mình trên nhiều trình duyệt

JavaScript cũng chạy độc lập [và trong máy chủ]. Để chạy JavaScript độc lập, bạn cần cài đặt Node. js, một công cụ JavaScript. Tôi sẽ trình bày các ví dụ trong phần tiếp theo

JS phía máy khách EG 1. Hàm

for [ initialization ; test ; post-processing ] {
   body ;
}

8 và

for [ initialization ; test ; post-processing ] {
   body ;
}

Hãy để chúng tôi viết JavaScript phía máy khách đầu tiên của chúng tôi để in thông báo "Xin chào, thế giới"

Bắt đầu với một tệp mới và nhập các mã sau. Không nhập số dòng, được sử dụng để hỗ trợ giải thích. lưu ý rằng

JavaScript phân biệt chữ hoa chữ thường. Một





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

0 KHÔNG phải là một





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

1 và KHÔNG phải là một





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

Khoảng trắng "thêm" [khoảng trống, tab và dòng mới] bị bỏ qua. Nghĩa là, nhiều khoảng trắng được coi là một ký tự trống. Bạn có thể sử dụng chúng một cách tự do để làm cho chương trình của bạn dễ đọc hơn

Lưu tệp dưới dạng "





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

3" [hoặc bất kỳ tên tệp nào bạn thích, với phần mở rộng tệp là "





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

4" hoặc "





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

5"]. Chạy tập lệnh bằng cách tải tệp HTML vào trình duyệt hỗ trợ JavaScript [e. g. , Một trong BIG FIVE - Chrome, Firefox, Internet Explorer/Edge, Safari hoặc Opera]





  
  JavaScript Example: Functions alert[] and document.write[]
  


  My first JavaScript says:

Làm thế nào nó hoạt động?

JavaScript là mã lập trình được nhúng bên trong tài liệu HTML. Các mã được chứa giữa một cặp thẻ





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

6, như sau. GHI CHÚ. Trong HTML4/XHTML, bạn cần thêm thuộc tính





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

7 vào phần tử





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

6. Dòng 7-9 và Dòng 13-17 là hai đoạn mã JavaScript, được đặt lần lượt trong phần





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

9 và





  
  JavaScript Example: Events onload, onmouseover and onmouseout
  


  "Hello" alert Box appears after the page is loaded.
  Point your mouse pointer here!!!

Các câu lệnh JavaScript được kết thúc bằng dấu chấm phẩy





  
  JavaScript Example: Events onload, onmouseover and onmouseout
  


  "Hello" alert Box appears after the page is loaded.
  Point your mouse pointer here!!!

1 [như Java/C/C++/C#]

Hàm





  
  JavaScript Example: Events onload, onmouseover and onmouseout
  


  "Hello" alert Box appears after the page is loaded.
  Point your mouse pointer here!!!

2 [Dòng 8] bật ra một hộp thoại hiển thị





  
  JavaScript Example: Events onload, onmouseover and onmouseout
  


  "Hello" alert Box appears after the page is loaded.
  Point your mouse pointer here!!!

3 và một nút OK. Các chuỗi được đặt trong cặp dấu nháy kép hoặc nháy đơn, e. g. ,





  
  JavaScript Example: Events onload, onmouseover and onmouseout
  


  "Hello" alert Box appears after the page is loaded.
  Point your mouse pointer here!!!

4 hoặc





  
  JavaScript Example: Events onload, onmouseover and onmouseout
  


  "Hello" alert Box appears after the page is loaded.
  Point your mouse pointer here!!!

Trang web hiện tại được đại diện bởi cái gọi là đối tượng





  
  JavaScript Example: Events onload, onmouseover and onmouseout
  


  "Hello" alert Box appears after the page is loaded.
  Point your mouse pointer here!!!

6 trong JavaScript. Thuộc tính





  
  JavaScript Example: Events onload, onmouseover and onmouseout
  


  "Hello" alert Box appears after the page is loaded.
  Point your mouse pointer here!!!

7 [Dòng 16] lưu trữ ngày sửa đổi cuối cùng của tài liệu hiện tại. Hàm





  
  JavaScript Example: Events onload, onmouseover and onmouseout
  


  "Hello" alert Box appears after the page is loaded.
  Point your mouse pointer here!!!

8 [Dòng 14 đến 16] có thể được sử dụng để ghi





  
  JavaScript Example: Events onload, onmouseover and onmouseout
  


  "Hello" alert Box appears after the page is loaded.
  Point your mouse pointer here!!!

3 đã chỉ định vào tài liệu hiện tại, như một phần của tài liệu HTML hiện tại

Toán tử

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

00 [Dòng 16] có thể được sử dụng để nối hai chuỗi [như Java]

Theo kết quả của

for [ initialization ; test ; post-processing ] {
   body ;
}

9, phần





  
  JavaScript Example: Events onload, onmouseover and onmouseout
  


  "Hello" alert Box appears after the page is loaded.
  Point your mouse pointer here!!!

0 của tài liệu này chứa.

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.





  
  JavaScript Example: Events onload, onmouseover and onmouseout
  


  "Hello" alert Box appears after the page is loaded.
  Point your mouse pointer here!!!

2 và





  
  JavaScript Example: Events onload, onmouseover and onmouseout
  


  "Hello" alert Box appears after the page is loaded.
  Point your mouse pointer here!!!

8 là một số hàm tích hợp thường được sử dụng được cung cấp trong JavaScript

THỬ. In tiêu đề của tài liệu và vị trí URL. [Gợi ý. sử dụng thuộc tính

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

05 và

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

06. ]

Không bị bộ nhớ cache bắt - Thực hiện Control-Refresh [hoặc Control-F5]

Nếu bạn sửa đổi mã và tải lại trang web, mã mới có thể không được thực thi vì trình duyệt lưu phiên bản đã tải trước đó vào bộ đệm. Bạn có thể sử dụng Control-F5 [Control-Refresh] để yêu cầu trình duyệt loại bỏ bộ đệm và tìm nạp một trang mới

Không sử dụng

for [ initialization ; test ; post-processing ] {
   body ;
}

Bởi vì không ai thích nó

"Việc sử dụng cảnh báo thường không được khuyến khích để ủng hộ các phương pháp khác không chặn người dùng tương tác với trang - nhằm tạo trải nghiệm người dùng tốt hơn. Tuy nhiên, nó có thể hữu ích để gỡ lỗi. "

for [ initialization ; test ; post-processing ] {
   body ;
}

8 về mặt kỹ thuật là tài sản của đối tượng

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

09 và sẽ được gọi là

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

10. Nhưng vì

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

09 là một đối tượng toàn cục nên tất cả các biến của nó đều là biến toàn cục và có thể được tham chiếu mà không cần tên đối tượng

Công cụ gỡ lỗi và công cụ phát triển web F12 của trình duyệt

Trước khi chúng tôi chuyển sang ví dụ tiếp theo, bạn nên dùng thử Công cụ phát triển web, có sẵn trong hầu hết các trình duyệt để gỡ lỗi HTML/CSS/JavaScript/ứng dụng web

Khởi chạy trình duyệt của bạn và nhấn F12 để kích hoạt Công cụ phát triển web [Tôi đã thử trên Firefox, Chrome, Edge]
Chọn ngăn "Bảng điều khiển". Bạn có thể nhập các câu lệnh JavaScript trong bảng điều khiển. Ví dụ: nhập từng câu lệnh JavaScript sau và quan sát kết quả.
```
alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']
```

ghi chú.

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

12 ghi thông điệp vào bảng điều khiển, thường được sử dụng để gỡ lỗi [như

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

13 trong Java hoặc

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

14 trong C]

Các thông báo lỗi ở đâu?

Nếu bạn mắc bất kỳ lỗi cú pháp nào trong ví dụ trước, bạn sẽ không thấy bất kỳ thông báo lỗi nào xuất hiện trên trình duyệt mà chỉ đơn giản là tập lệnh không chạy. Không thể gỡ lỗi chương trình mà không có thông báo lỗi. Rất may, bạn thực sự có thể tìm thấy các thông báo lỗi trong bảng điều khiển. Thực hiện một số lỗi và làm mới trình duyệt

JS phía máy khách EG 2. Biến và Hàm

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

15,

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

Tập lệnh này nhắc người dùng nhập tên của họ, xác nhận tên và in thông báo chào mừng

Có ba loại hộp thoại bật lên để tương tác với người dùng

Hàm





  
  JavaScript Example: Events onload, onmouseover and onmouseout
  


  "Hello" alert Box appears after the page is loaded.
  Point your mouse pointer here!!!

2 đặt





  
  JavaScript Example: Events onload, onmouseover and onmouseout
  


  "Hello" alert Box appears after the page is loaded.
  Point your mouse pointer here!!!

3 trên hộp bật lên có nút OK. Người dùng cần nhấp vào nút OK để tiếp tục

Hàm

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

19 hiển thị hộp bật lên đầu vào với

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

20 với các nút OK và Hủy. Nó trả về đầu vào do người dùng nhập dưới dạng một chuỗi; . Tham số tùy chọn

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

22 chỉ định chuỗi ban đầu sẽ được hiển thị. Trong bài viết này mình sẽ chỉ ra các tham số chức năng tùy chọn có đuôi

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

23 cho gọn

Hàm

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

24 đặt

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

25 trên hộp bật lên có các nút OK và Hủy. Nó trả về

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

26 nếu người dùng nhấn nút OK;





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

Làm thế nào nó hoạt động?

Dòng 8 khai báo một biến toàn cục có tên là
```
My First JavaScript says
Hello world, again!
This document was last modified on mm/dd/yyyy hh:mm:ss.
```
28, thông qua từ khóa
```
My First JavaScript says
Hello world, again!
This document was last modified on mm/dd/yyyy hh:mm:ss.
```
29. Một biến là một vị trí lưu trữ được đặt tên chứa một giá trị. Sau khi khai báo biến, bạn có thể gán [và gán lại] giá trị cho biến đó, thông qua toán tử gán
```
My First JavaScript says
Hello world, again!
This document was last modified on mm/dd/yyyy hh:mm:ss.
```
30 [Dòng 9]

Dòng 9 gọi hàm

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

19 để bật ra một hộp thoại và đọc chuỗi do người dùng nhập vào. Chuỗi đọc được gán cho biến

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

28. Hàm

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

15 tương tự như hàm

for [ initialization ; test ; post-processing ] {
   body ;
}

8, nhưng nó chấp nhận đầu vào của người dùng

Ở Dòng 10, hàm

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

24 hiển thị thông báo và trả về

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

26 hoặc

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

27, tùy thuộc vào việc người dùng nhấn nút OK hay Cancel

Nếu kết quả là

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

26, Dòng 11 in ra

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

39. Nếu không, Dòng 13 in ra _______44_______40

THỬ. Thay vì in tin nhắn chúc mừng bằng cách sử dụng

for [ initialization ; test ; post-processing ] {
   body ;
}

9, hãy thực hiện điều đó thông qua một

for [ initialization ; test ; post-processing ] {
   body ;
}

JS phía máy khách EG 3. Đối tượng

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

Tập lệnh sau tạo một đối tượng

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

43 biểu thị ngày giờ hiện tại và in thời gian hiện tại





  
  JavaScript Example: The Date object

Làm thế nào nó hoạt động?

Dòng 8 khai báo một biến có tên là

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

45. Nó cũng tạo một đối tượng

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

43 [thông qua toán tử

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

47], chứa dấu ngày-giờ hiện tại và gán nó cho

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

"______44_______49" bắt đầu chú thích cuối dòng [Dòng 8 và 9]. Nhận xét bị công cụ JavaScript bỏ qua nhưng quan trọng trong việc giải thích mã của bạn cho người khác [và cho chính bạn ba ngày sau]

50. Dòng 9 và 10, tương tự, xử lý phút và giây

Dòng 12 đến 14 sử dụng

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

56 để ghi vào tài liệu hiện tại.

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

57 [write-line] viết một dòng mới [

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

58] sau chuỗi đã cho. Hãy lưu ý rằng trình duyệt bỏ qua khoảng trắng thừa [dòng mới, khoảng trống, tab] trong tài liệu HTML;

Dòng 16-20 chứa câu lệnh if-then-else có điều kiện. Tùy thuộc vào giá trị của
```
My First JavaScript says
Hello world, again!
This document was last modified on mm/dd/yyyy hh:mm:ss.
```
50, một trong các thông báo sẽ được hiển thị

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

71 construct as follow. ]

if [ condition-1 ] {
   block-1 ;
} else if [ condition-2 ] {
   block-2 ;
} else if [ condition-3 ] {
   block-3 ;
......
......
} else {
   block-n ;
}

Client-Side JS EG 4. Loops

The following script prompts the user for a multiplier, and prints the multiples of 1 to 100 using a for-loop





  
  JavaScript Example: Loop


  Testing Loop

Làm thế nào nó hoạt động?

Line 11 prompts the user for a number, and assigns it to the variable

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

Lines 12-14 contain a for-loop. A for-loop takes the following syntax.
```
for [ initialization ; test ; post-processing ] {
   body ;
}
```
There are four parts in a for-loop. Three of them, initialization, test and post-processing, are enclosed in brackets
```
My First JavaScript says
Hello world, again!
This document was last modified on mm/dd/yyyy hh:mm:ss.
```
73 and separated by 2 semicolons. The body contains the repetitive task to be performed. The initialization statement is first executed. The test is then evaluated. If the test returns true, the body is executed; followed by the post-processing statement. The test is evaluated again and the process repeats until the test returns false. When the test is false, the for-loop completes and program execution continues to the next statement after the for-loop. The following flow chart illustrates the for-loop process.
In this example, the variable
```
My First JavaScript says
Hello world, again!
This document was last modified on mm/dd/yyyy hh:mm:ss.
```
74 is initialized to 1. If
```
My First JavaScript says
Hello world, again!
This document was last modified on mm/dd/yyyy hh:mm:ss.
```
74 is less than or equal to 100, the body of the loop executes, followed by the post-processing statement, which increment the value of
```
My First JavaScript says
Hello world, again!
This document was last modified on mm/dd/yyyy hh:mm:ss.
```
74 by 1. The loop repeats until the value of
```
My First JavaScript says
Hello world, again!
This document was last modified on mm/dd/yyyy hh:mm:ss.
```
74 is NOT less than or equal to 100 [i. e. , more than 100]

TRY

Modify the above script to prompt the user for the multiplier as well as the number of multiples to be printed [in two
```
My First JavaScript says
Hello world, again!
This document was last modified on mm/dd/yyyy hh:mm:ss.
```
15 statements]

Modify the above script to print only multiples that are odd number. [Hint. The modulo operator "

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

79" can be used to compute the remainder, e. g. ,

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

80 computes the remainder of

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

81 divides by 2, which results in either 0 or 1. ]

Client-Side JS EG 5. User-defined Functions and

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

82 Event Handler

Besides the JavaScript built-in functions such as

for [ initialization ; test ; post-processing ] {
   body ;
}

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

15,

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

85, and

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

57, you can define your own functions. A function has a name and a body consisting of a set of JavaScript statements that collectively performs a certain task. It may take zero or more argument[s] from the caller and return zero or one value back to the caller





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

Làm thế nào nó hoạt động?

Lines 8-10 define a function called

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

87, via the keyword

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

88. The function invokes the built-in function

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

89, which opens a new browser window [or tab] and loads the page "

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

90"

Lines 15-16 create an HTML button. Clicking the button triggers the

My First JavaScript says

This document was last modified on mm/dd/yyyy hh:mm:ss.

94,

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

95 and

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

JavaScript can be used to handle many types of events, in response to a user's action or browser's action. For example,

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

94. fires after browser loaded the page

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

95 and

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

96. fires when the user points the mouse pointer at/away from the HTML element





  
  JavaScript Example: Events onload, onmouseover and onmouseout
  


  "Hello" alert Box appears after the page is loaded.
  Point your mouse pointer here!!!

Dissecting the Program

Line 8 defines a variable

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

00, which holds the strings to be displayed in the

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

94 event handlers

In the opening tag [Line 12], we define the

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

94 event handler for the

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

03 event. It invokes

for [ initialization ; test ; post-processing ] {
   body ;
}

8 with the message defined earlier

Dòng 13 và 14 xác định trình xử lý sự kiện

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

95 và

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

96 cho phần tử HTML

The text's color will be changed to red when the user points the mouse pointer at the element [by setting the CSS style property

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

07 to red], and revert back to its original color when the mouse pointer is moved away [by resetting the CSS style property

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

07 to an empty string]. The special keyword

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

09 refer to this object

Client-Side JS EG 7. Separating HTML, CSS and JavaScript

The previous example works fine. You will find many such example in textbooks, especially the older textbooks. However, it has a big problem. All the HTML contents, CSS presentation styles and JavaScript programming codes are placed in a single file. For a small toy program, the problem is not serious. But when your program grows and if the HTML, CSS and JavaScript are written by different people, you will have a real challenge in maintaining the program. Remember that HTML is for the contents, CSS for presentation and JavaScript for the behavior

Let's rewrite the example to place the HTML, CSS and JavaScript in three different files

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

2Làm thế nào nó hoạt động?

Placing the scripting codes inside the HTML page is not a good software engineering practice. Instead, the now-preferred approach is to place the scripts, as well as CSS styles, in external files, which can then uniformly applied to all pages in your website

Let's begin with the HTML file. Now, the HTML file keeps only the contents, no presentation style and nor programming logic

The CSS style sheet is kept in an external file, referenced via the above





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

6 tag
Note. In HTML4/XHTML1. 0 you need to include attribute

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

11 in the





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

6 opening tag

Also, the JavaScript programming code is kept in an external file, referenced via the above





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

6 is needed, although there is no content
Ghi chú. Trong HTML4/XHTML1. 0, bạn cần bao gồm thuộc tính





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

7 trong





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

3Làm thế nào nó hoạt động?

Tài liệu HTML này chứa một phần tử với một

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

16 duy nhất, hai

yếu tố, ba

phần tử với

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

17 và ba phần tử





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

6 với phần tử duy nhất là

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

Trong hàm do người dùng xác định

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

20, chúng tôi sử dụng

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

21 để chọn phần tử, sau đó sửa đổi thuộc tính

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

22 của nó

Trong hàm

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

23, chúng tôi sử dụng

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

24 để chọn tất cả

các phần tử trong một mảng

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

25. We then use a for-loop to iterate through all the elements in the array. Thuộc tính

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

26 giữ độ dài của mảng

Trong hàm

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

27, chúng tôi sử dụng

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

28 để chọn tất cả

yếu tố. Chúng tôi sử dụng vòng lặp

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

29 của JavaScript để lặp qua tất cả các phần tử. Chúng tôi sử dụng biến

if [ condition-1 ] {
   block-1 ;
} else if [ condition-2 ] {
   block-2 ;
} else if [ condition-3 ] {
   block-3 ;
......
......
} else {
   block-n ;
}

8 an toàn nhất, vì vòng lặp

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

29 tạo một biến phạm vi khối mới cho mỗi lần lặp;

Trang chứa ba nút để kích hoạt các chức năng được xác định
để thao tác các phần tử trong DOM bằng JavaScript, mã JavaScript phải được chạy sau khi phần tử liên quan đã được tạo trong tài liệu. Điều này có thể được thực hiện bằng cách đặt JavaScript ngay trước thẻ kết thúc

Tập lệnh chứa một hàm

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

33, được chỉ định làm trình xử lý

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

94 thông qua

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

35. Tức là,

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

33 sẽ được kích hoạt sau khi trang được tải. The

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

33 function assigns

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

82 event handlers to the buttons, selected via

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

39 using the unique buttons'

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

Instead of
```
alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']
```
22 property, older versions of JavaScript use
```
alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']
```
42 [which includes both texts and markups] to modify the content of the selected element. According to MDN. "
```
alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']
```
22 should be used instead. Because the text is not parsed as HTML, it's likely to have better performance. Moreover, this avoids an XSS [Cross-Site Scripting] attack vector. "

Client-Side JS EG 9. Intercepting a Hyperlink

This example uses a script to intercept a hyperlink to put up a warning message, then proceed to the link

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

5Làm thế nào nó hoạt động?

The HTML page has an hyperlink





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

6with an unique

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

The

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

33 function assigns an

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

82 handler to the hyperlink, selected via

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

When the hyperlink is clicked, the

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

82 handler

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

50 triggered. If

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

16 returns true, the new page will be loaded; otherwise, the current page remains

More Advanced JavaScript Examples

More "Advanced JavaScript Examples"

Debugging JavaScripts

A graphic debugger is a MUST in programming. Programming in JavaScript, in particular, requires a good debugger. It is because JavaScripts are interpreted and does not need to be compiled. Hence, there is no compiler to show you the syntax errors. A simple and trivial syntax error [e. g. , missing bracket, mis-spelling] will render the entire script not workable. Worst still, you would not see any error message when the script did not work. Can you debug without any error message or clue?

Without a graphic debugging, the only mean to debug JavaScript is to insert

for [ initialization ; test ; post-processing ] {
   body ;
}

8 at strategic locations to print out selected data

After modifying a JavaScript, I recommend that you use Ctrl-F5 to refresh the page, which shall load a fresh copy instead of loading from the cache. You might need to clear the browser's cache or re-start the browser, if you modification does not take effect

F12 Web Developer Tools

In Chrome and Firefox, you can press F12 to activate the developer Tools [hence called F12 Developer Tools]

It provides these features

Console. View the JavaScript error messages. Start the firebug and switch to the "Console" panel
Script. View and debug JavaScript. Start the firebug. Switch to the "Script" panel. "Enable" or "Reload" if necessary. You can set a breakpoint by clicking on the statement number, single step through the JavaScript statements, watch the expression, and etc
DOM. View the HTML DOM of the current document
HTML and CSS

To debug JavaScript

Launch Firebug ⇒ Choose the "Script" panel to view your JavaScript, shown with green-bold line numbers
Refresh [Ctrl-F5] the page, and check the error console [Under "Console" ⇒ "Errors"] for syntax errors. Correct all the syntax errors
To trace the program, set breakpoints at selected JavaScript statements, by clicking on the right margin [to the left of line number]. A red circle shows up denoting a breakpoint. Take note that you can only set breakpoint on statements with a green-bold line number. [If your JavaScript statements do not have a green-bold line number, there are syntax errors on these statements. Bạn cần sửa lỗi cú pháp và tải lại trang. ]
Trigger the script [via clicking button/link, or reloading the page]. The execution stops at the first breakpoint. You can then step-over the statement [or step-into function], and inspect the variables by positioning the mouse pointer on the variable; or add the variable to "watch"
You can resume the execution [via the continue button]

The

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

Instead of using

for [ initialization ; test ; post-processing ] {
   body ;
}

8 and

for [ initialization ; test ; post-processing ] {
   body ;
}

9 to show the intermediate results, you can also use

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

56, which writes the

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

57 and the value of the

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

58 to the error console. It does not interfere the appearance you web page nor your normal operations

For example, modify the JavaScript in Example 8 to print the values of innerHTML before modification. You need to turn on the console [press F12] to see the output

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

JavaScript and HTML

As seen from the previous examples, JavaScripts are embedded inside an HTML document, and executed by the browser. There are two occasions on which browser executes JavaScript instructions

JavaScripts enclosed in





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

6 runs during loading of the page

Some JavaScripts, called event handlers, run as a result of the user's or browser's action [or event]. For example, clicking a button [

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

82] or loaded a page [

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

94]

There are, therefore, two places to put your JavaScript

between





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

6 container tags; and

inside the HTML tags as the event handlers [such as

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

82,

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

95,

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

94], e. g. ,

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

The





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

6 element contains the JavaScript programming statements. For example,

In HTML4/XHTML1. 0, you need to include the attribute

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

68 in the





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

6 is needed although there is no content. ?

In HTML4/XHTML1. 0, you need to include

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

68 in the





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

6 tags, and run it under a web browser, you will need to activate the debugger [Web Developer Tools] to see the outputs. See the above section on client-side examples

[TODO] Check Limitations such as File IO, Networking etc. Compare with Shell Script and Python script for automation

Server-Side JavaScript by Examples

You can also use JavaScript to program a server-side webapp, just like Java Servlet/JSP, Microsoft ASP, PHP, Python, etc. The appeal is that you can use one single language to program both the client-side and the server-side in a webapp

See Node. js article

JavaScript Basic Syntax

Comments

Comments are ignored by the JavaScript runtime but greatly useful in explaining your codes to others [and also to yourself three days later]. You should use comments liberally to explain or document your codes

An end-of-line comment begins with

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

Take note that

HTML comments are enclosed inside

CSS supports multi-line comment

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

75, but NOT end-of-line comment

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

JavaScript supports both

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

75 and

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

49, like Java/C/C++/C#

Whitespaces [blank, tab, newline]

Like C/C++/Java, JavaScript ignores additional whitespaces [blanks, tabs, and newlines]. I strongly recommend that you use additional whitespaces to format your program to make your code easier to read and understand

Expressions

An expression is a combination of variables, literals, operators, and sub-expressions that can be evaluated to produce a single value

Statements, Semicolon and Blocks

A statement is a single programming instruction. Unlike C/C++/Java, where you need to end a statement with a semicolon [

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

Semicolons in JavaScript divide the community. Some prefer to use them always, no matter what. Others like to avoid them for brevity. I shall leave it to you

Một khối bao gồm 0 hoặc nhiều câu lệnh được đặt trong một cặp dấu ngoặc nhọn

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

Biến, chữ và kiểu

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

if [ condition-1 ] {
   block-1 ;
} else if [ condition-2 ] {
   block-2 ;
} else if [ condition-3 ] {
   block-3 ;
......
......
} else {
   block-n ;
}

if [ condition-1 ] {
   block-1 ;
} else if [ condition-2 ] {
   block-2 ;
} else if [ condition-3 ] {
   block-3 ;
......
......
} else {
   block-n ;
}

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

A variable is a named storage location that holds a value. Prior to ES6, you can only use

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

if [ condition-1 ] {
   block-1 ;
} else if [ condition-2 ] {
   block-2 ;
} else if [ condition-3 ] {
   block-3 ;
......
......
} else {
   block-n ;
}

if [ condition-1 ] {
   block-1 ;
} else if [ condition-2 ] {
   block-2 ;
} else if [ condition-3 ] {
   block-3 ;
......
......
} else {
   block-n ;
}

Bạn nên thử

if [ condition-1 ] {
   block-1 ;
} else if [ condition-2 ] {
   block-2 ;
} else if [ condition-3 ] {
   block-3 ;
......
......
} else {
   block-n ;
}

if [ condition-1 ] {
   block-1 ;
} else if [ condition-2 ] {
   block-2 ;
} else if [ condition-3 ] {
   block-3 ;
......
......
} else {
   block-n ;
}

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

You can assign [and re-assign] a value to a variable using the assignment [

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

Identifiers are names given to identify entities [such as variables and functions]. The rules for valid identifiers are

An identifier can contain letters [

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

92,

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

93], digits [

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

94], underscore [

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

95] and dollar sign [

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

96]. But it cannot begin with a digit [

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

94]

Identifiers are case-sensitive. A





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

0 is NOT a





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

2, and is NOT a





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

Identifiers cannot be keywords

Take note that hyphen [





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

01] and space are NOT allowed. Hence,





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

02,





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

03, are NOT valid identifiers. You should use underscore [

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

95] instead of hyphen [





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

01]

A literal is a fixed value, e. g. ,





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

JavaScript is object-oriented. But, It supports both primitive types and objects

Primitives are not objects and do not possess properties and methods. JavaScript supports these primitive types

string. a sequence of characters. Strings literals are enclosed in a pair of single quotes or double quotes [e. g. ,





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

08,





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

13]

number. takes both integer [e. g. ,





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

06] or floating-point [e. g. ,





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

15]

boolean. takes boolean literal of either

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

26 or

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

27 [in lowercase]

undefined. takes a special literal value called





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

18. Take note that





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

18 is both a type and a literal value

symbol [ES6]. A data type whose instances are unique and immutable
bigint [ES2020/ES11]. integers with arbitrary precision

JavaScript also supports these object types and value [we shall discuss object later]

object. for general objects
function. for function objects. Unlike Java, function is a first class object in JavaScript, e. g. , you can assign a function to a variable

null. A special literal value for unallocated [unconstructed]





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

20. Take note that

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

21 is NOT





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

22. The





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

23 is





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

20.

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

21 is meant to represent an absence of a constructed object.

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

21 is actually considered to be a primitive as it has no properties and methods

Unlike most of the general programming languages [such as Java/C/C++/C#] which are strongly type, JavaScript is loosely type [similar to most of the scripting languages such as UNIX Shell Script, Perl, Python]. You do not have to explicitly declare the type of a variable [such as





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

You can use the operator





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

For example,





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

An undeclared variable [via

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

When a variable is declared [via

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

For examples,

if [ condition-1 ] {
   block-1 ;
} else if [ condition-2 ] {
   block-2 ;
} else if [ condition-3 ] {
   block-3 ;
......
......
} else {
   block-n ;
}

You can create a read-only, named constant with the keyword

if [ condition-1 ] {
   block-1 ;
} else if [ condition-2 ] {
   block-2 ;
} else if [ condition-3 ] {
   block-3 ;
......
......
} else {
   block-n ;
}

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

The

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

74 Type, Literals & Operations

A variable of type

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

Integer literals can be expressed in

Decimal. begins with a digit





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

47 to





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

48 [not





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

49], e. g. ,





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

50 or





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

51,

Octal. begins with a digit





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

49, e. g. ,





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

53 or





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

54,

Hexadecimal. begins with





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

55 [or





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

56], e. g. ,





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

57 or





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

Binary. begins with





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

59 [or





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

60], e. g. ,





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

61 or





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

62. [Binary may not be supported in some browsers. ]

Floating-point literals can be expressed in the usual form [e. g. ,





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

JavaScript also provides some special

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

infinity. e. g. ,





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

-infinity. e. g. ,





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

NaN [Not-a-Number]. e. g. ,





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

69, or converting the string





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

70 to a number

Các phép toán số học, như được lập bảng dưới đây, có thể được áp dụng cho các số. The following results are obtained assuming that





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

In JavaScript, arithmetic operations are always performed in double-precision floating-points [NOT integers]. That is,





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Loop


  Testing Loop

ECMAScript 2016 [ES7] giới thiệu toán tử số mũ [





  
  JavaScript Example: Loop


  Testing Loop





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

Before ES7, you have to use built-in function





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

These are short-hand operators to combine two operations





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

parseInt[str], parseFloat[str]. Parse the





  
  JavaScript Example: Events onload, onmouseover and onmouseout
  


  "Hello" alert Box appears after the page is loaded.
  Point your mouse pointer here!!!

3 until the first non-digit, and return the number; or





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

Math. round[num], Math. floor[num], Math. ceil[num]
Math. random[]. Generate a random number between 0 [inclusive] and 1 [exclusive]

isNaN[str]. return true if the





  
  JavaScript Example: Events onload, onmouseover and onmouseout
  


  "Hello" alert Box appears after the page is loaded.
  Point your mouse pointer here!!!

3 is not a number. For example, It is interesting to note that JavaScript does not have counterpart functions like





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

93,





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

Number[str]. Return the number represented by

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

25, or





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

91. Take that that this function name begins with uppercase, because this is a type casting operation

toFixed[decimalPlaces]. Return this number/string to the given number of decimal places. For example,

The





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

30 Type, Literals & Operations





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: The Date object





  
  JavaScript Example: The Date object

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.





  
  JavaScript Example: The Date object





  
  JavaScript Example: The Date object





  
  JavaScript Example: The Date object





  
  JavaScript Example: The Date object





  
  JavaScript Example: The Date object

Unlike Java/C/C++, but like HTML/CSS's attributes, you can use either single quotes or double quotes for





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: The Date object





  
  JavaScript Example: The Date object





  
  JavaScript Example: The Date object

JavaScript is dynamically-type, and performs type conversion automatically. When a





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

If both the operands to a

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.





  
  JavaScript Example: The Date object





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: The Date object





  
  JavaScript Example: The Date object

To convert a numeric





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: The Date object

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

Take note that





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

You can also use the function





  
  JavaScript Example: The Date object





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: The Date object





  
  JavaScript Example: The Date object

You can construct a





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: The Date object

You can use





  
  JavaScript Example: The Date object





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

You can also convert a number to string by concatenating with an empty string, e. g. ,

length. E. g. ,





  
  JavaScript Example: The Date object

48 returns the length of the string

toUpperCase[]. returns the uppercase string
toLowerCase[]. returns the lowercase string
charAt[idx]. returns the character at the
```
  
  JavaScript Example: The Date object
  
```
49 position. Index begins from 0. Negative index can be used, which counts from the end of the string

substring[beginIdx, endIdx]. returns the substring from





  
  JavaScript Example: The Date object

50 [inclusive] to





  
  JavaScript Example: The Date object

51 [exclusive]

substr[beginIdx, length]. returns the substring from





  
  JavaScript Example: The Date object

50 of





  
  JavaScript Example: The Date object

indexOf[searchStr, fromIdx?]. Return the beginning index of the first occurrence of





  
  JavaScript Example: The Date object

54, starting from an optional





  
  JavaScript Example: The Date object

55 [default of 0]; or





  
  JavaScript Example: The Date object

56 if not found

lastIndexOf[searchStr, fromIdx?]. Return the beginning index of the last occurrence of





  
  JavaScript Example: The Date object





  
  JavaScript Example: User-defined function and  title Event Handler
  


  Example on event and user-defined function

6, starting from an optional





  
  JavaScript Example: The Date object

55 [default of





  
  JavaScript Example: The Date object

60]; or





  
  JavaScript Example: The Date object

56 if not found

slice[beginIdx, endIdx]. Return the substring from





  
  JavaScript Example: The Date object

62 [inclusive] to





  
  JavaScript Example: The Date object

63 [exclusive]

repeat[count] [ES6]. repeat the string
split[delimiter], array. join[delimiter]. returns an array by splitting the string using
```
  
  JavaScript Example: The Date object
  
```
64, e. g. ,
Searching/Modifying Strings using Regular Expression. See ""

JavaScript does not have a dedicated character type, but treats it as a one-character single. To get an individual character from a string, you can use

charAt[idx]. For example,
Array Bracket Operator []. You can treat a string as a character array, and access individual character via array bracket operator
```
  
  JavaScript Example: The Date object
  
```
65, e. g. ,

[ES6] Multi-line Back-Quoted Template String and Substitution

Prior to ES6, You can enclosed a string literal using either single or double quotes [e. g. ,





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: The Date object





  
  JavaScript Example: The Date object

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.





  
  JavaScript Example: The Date object





  
  JavaScript Example: The Date object





  
  JavaScript Example: The Date object





  
  JavaScript Example: The Date object

ES6 introduces template string, delimited by back-quotes, for example,

Không cần thoát trích dẫn đơn hoặc kép bên trong chuỗi mẫu [vì không có xung đột]. But you need to use escape sequence for back-quote, i. e. ,





  
  JavaScript Example: The Date object

Template strings support multi-line strings. All whitespaces [blank, tab, newline] within the back-quotes are part of the multi-line string. For example,





  
  JavaScript Example: The Date object

Template strings support substitution, which allow you to embed any valid JavaScript expression as part of the string in the form of





  
  JavaScript Example: The Date object

Multi-line template string with substitution provides a more convenient way to write out formatted HTML fragment. For example,

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

The





  
  JavaScript Example: The Date object

78 Type, Literals & Operations

Một biến kiểu





  
  JavaScript Example: The Date object

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

As mentioned, JavaScript performs automatic type conversion if necessary. During the type conversion, the following 6 values are converted to

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

number





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

number





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

91 [Not-a-Number],

empty string [





  
  JavaScript Example: The Date object

13,





  
  JavaScript Example: The Date object

88],





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

18 value,

boolean

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

27,

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

21 [unallocated] object

All the other values are converted to

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

You need to memorize this.





  
  JavaScript Example: The Date object

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.





  
  JavaScript Example: The Date object





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!





  
  JavaScript Example: The Date object





  
  JavaScript Example: Variables and functions prompt[] and confirm[]
  


  Welcome to JavaScript!

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

The following relational operators, which produce a





  
  JavaScript Example: The Date object

if [ condition-1 ] {
   block-1 ;
} else if [ condition-2 ] {
   block-2 ;
} else if [ condition-3 ] {
   block-3 ;
......
......
} else {
   block-n ;
}

if [ condition-1 ] {
   block-1 ;
} else if [ condition-2 ] {
   block-2 ;
} else if [ condition-3 ] {
   block-3 ;
......
......
} else {
   block-n ;
}

if [ condition-1 ] {
   block-1 ;
} else if [ condition-2 ] {
   block-2 ;
} else if [ condition-3 ] {
   block-3 ;
......
......
} else {
   block-n ;
}

if [ condition-1 ] {
   block-1 ;
} else if [ condition-2 ] {
   block-2 ;
} else if [ condition-3 ] {
   block-3 ;
......
......
} else {
   block-n ;
}

My First JavaScript says

Hello world, again!

This document was last modified on mm/dd/yyyy hh:mm:ss.

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

alert['hello, world']
document.write['hello world, again']
console.log['hello world, again and again']

Giới thiệu

Testing Loop

Testing Loop

Testing Loop

Testing Loop

Testing Loop

Testing Loop

Testing Loop

Testing Loop

Testing Loop

Testing Loop

Ví dụ JavaScript phía máy khách

JS phía máy khách EG 1. Hàm for [ initialization ; test ; post-processing ] { body ; }8 và for [ initialization ; test ; post-processing ] { body ; }9

Example on event and user-defined function

Example on event and user-defined function

Example on event and user-defined function

Example on event and user-defined function

Example on event and user-defined function

Example on event and user-defined function

Example on event and user-defined function

Example on event and user-defined function

Example on event and user-defined function

Example on event and user-defined function

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Công cụ gỡ lỗi và công cụ phát triển web F12 của trình duyệt

Hello world, again!

Hello world, again!

Hello world, again!

JS phía máy khách EG 2. Biến và Hàm My First JavaScript says Hello world, again!This document was last modified on mm/dd/yyyy hh:mm:ss.15, My First JavaScript says Hello world, again!This document was last modified on mm/dd/yyyy hh:mm:ss.16

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

JS phía máy khách EG 3. Đối tượng My First JavaScript says Hello world, again!This document was last modified on mm/dd/yyyy hh:mm:ss.43

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

Hello world, again!

JS phía máy khách EG 1. Hàm
for [ initialization ; test ; post-processing ] { body ; }
8 và
for [ initialization ; test ; post-processing ] { body ; }
9

JS phía máy khách EG 2. Biến và Hàm
My First JavaScript says
Hello world, again!
This document was last modified on mm/dd/yyyy hh:mm:ss.
15,
My First JavaScript says
Hello world, again!
This document was last modified on mm/dd/yyyy hh:mm:ss.
16

JS phía máy khách EG 3. Đối tượng
My First JavaScript says
Hello world, again!
This document was last modified on mm/dd/yyyy hh:mm:ss.
43

Client-Side JS EG 5. User-defined Functions and
My First JavaScript says
Hello world, again!
This document was last modified on mm/dd/yyyy hh:mm:ss.
82 Event Handler