Bài giảng Thiết kế Web: Chương 14 - Từ Thị Xuân Hiền

Bài giảng Thiết kế Web - Chương 14 giới thiệu tổng quan về javascript với một số nội dung như: Đặc điểm của Javascript, các đối tượng trong JavaScript, cấu trúc của đoạn Javascript, cú pháp cơ bản của lệnh, biến và dữ liệu trong Javascript. Mời các bạn cùng tham khảo.

CH ƯƠ NG XIV

I GI I THI U V  JAVASCRIPT Ớ Ệ Ề  

 Javascript ra đ i v i tên g i LiveScript, sau đó Nescape đ i  ờ ớ ọ ổ

tên thành Javascript. Tuy nhiên gi a Java và Javascript có r t ít  ữ ấ các đi m chung dù r ng cú pháp c a chúng có th  có nh ng   ể ằ ủ ể ữ

đi m gi ng nhau ể ố

 Ngôn ng  Javascript đ ữ ượ ạ c t o b i Nescape vào năm 1996  và  ở

đ ượ c đ a vào trong trình duy t Nescape Navigator 2.0 c a h   ư ệ ủ ọ thông qua trình biên d ch đ  đ c và th c hi n các mã l nh  ị ể ọ ự ệ ệ

Javascript đ ượ c kèm theo trong các trang HTML

 Javascript là m t ngôn ng  k ch b n (script) đ  vi t k ch b n  ộ ữ ị ả ể ế ị ả

cho phía client. Client side là nh ng yêu c u c a ng ữ ầ ủ ườ ử i s  

d ng đ ụ ượ c x  lý t i máy khách. Thông th ử ạ ườ ng nh ng yêu  ữ

c u này là tính tóan, ki m tra tính h p l  c a d  li u hay các  ầ ể ợ ệ ủ ữ ệ

hi u  ng, các yêu c u này th ệ ứ ầ ườ ng không liên quan đ n ngu n  ế ồ

c  s  d  li u trên server ơ ở ữ ệ

1. Đ c đi m c a JAVASCRIPTặ ể ủ :

a) Javascript là m t ngôn ng  k ch b n độ ữ ị ả ược vi t ế

chung v i HTML. ớb) Javascript là trình thông d ch.ị

c) Javascript là ngôn ng  đ ng vì các đ i tữ ộ ố ựơng có 

kh  năng tả ương tác v i nhau thông qua ngớ ườ ửi s  

d ng ho c các s  ki n. ụ ặ ự ệd) Là ngôn ng  hữ ướng đ i tố ượng. Phân bi t ch  ệ ữ

hoa, ch  thữ ường e) Được h  tr  b i t t c  các trình duy t nh  ỗ ợ ở ấ ả ệ ư

Nescape và Internet Explorerf) JavaScript có kh  năng t o và s  d ng các đ i ả ạ ử ụ ố

tượng(Object)

2. Các đ i tố ượng trong JavaScript g m 2 nhómồ :

a) Các object có s n trong JavaScriptẳ  

JavaScript cung c p m t b  các Built–in Object ấ ộ ộ

đ  cung c p các thông tin v  s  hi n hành c a ể ấ ề ự ệ ủcác đ i tố ượng được load trong trang Web và n i ộdung c a nó, các đ i tủ ố ượng này g m phồ ương 

th c (method) làm vi c v i các thu c tính ứ ệ ớ ộ(properties) c a nó.ủ

b) Các Object do ngườ ậi l p trình xây d ngự :

Đ nh nghĩa thu c tính, phị ộ ương th c c a đ i ứ ủ ố

tượng:

Cú pháp:

II C U TRÚC C A ĐO N JAVASCRIPT Ấ Ủ Ạ

L u ýư : trong th  JavaScript ta có th  b  thu c tính ẻ ể ỏ ộ SRC 

và Language, khi đó ngôn ng  m c đ nh là ữ ặ ị

JavaScript 

3. Môi trường vi t JAVASCRIPT:ế

FrontpageNotepadVisual InterDevDreamweaver  đ  vi t mã Javascript, ể ếDreamweaver h  tr  phân bi t t  khóa b ng màu ổ ợ ệ ừ ằ

ch , h  tr  các hàm, thu c tính c a các tag, giúp ữ ổ ợ ộ ủ

ngườ ử ụi s  d ng thu n tiên trong vi c thi t k  và ậ ệ ế ế

vi t chế ương trình

III CÚ PHÁP C  B N C A L NH Ơ Ả Ủ Ệ

1. L nh đ n và kh i l nh:ệ ơ ố ệ

 L nh đ n ệ ơ : là m t câu l nh độ ệ ược k t thúc b ng ế ằ

d u ch m ph yấ ấ ẩ (;). Trong JavaScript cu i m i câu ố ỗ

l nh ta có th  dùng d u (;) ho c không dùng d u ệ ể ấ ặ ấ

gì c  .ả

 Kh i l nh ố ệ : là t p h p nhi u câu l nh đ n đậ ợ ề ệ ơ ược 

bao b c b i c p d u ọ ở ặ ấ {}

1. L i chú thích trong chờ ương trình: trình duy t s  ệ ẽ

b  qua khi thông d ch chỏ ị ương trình. JavaScript h  tr  ổ ợ

2 lo i chú thích:ạ

Chú thích trên m t dòng: dùng c p d u //ộ ặ ấChú thích trên nhi u dòng: dùng c p d u   /*…*/ề ặ ấ

3. Xu t d  li u ra trang Web: ấ ữ ệ JavaScript h  tr  2 ỗ ợ

phương th c hi n th  d  li u ra trang Web là: ứ ể ị ữ ệ

+ document.write() + document.writeln()

N u d  li u là chu i ph i đế ữ ệ ổ ả ược đ t trong c p ặ ặnháy kép. 

N u xu t giá tr  c a bi n th  không c n đ t trong ế ấ ị ủ ế ị ầ ặnháy

Có th  dùng d u + đ  n i các chu i và bi nể ấ ể ố ổ ế

document.write(“String ” + variable );

N u xu t tag HTML thì c p tag đó cũng ph i đ t ế ấ ặ ả ặtrong c p d u nháy képặ ấ

</pre>

</body>

IV BI N VÀ D  LI U TRONG JAVASCRIPT Ế Ữ Ệ

Bi n là tên c a m t ph n t  trong chế ủ ộ ầ ử ương trình, 

đượ ử ục s  d ng đ  l u tr  thông tin do ngể ư ữ ười dùng 

nh p vào ho c k t qu  trung gian c a quá trình ậ ặ ế ả ủtính toán

Trong Javascript khi khai báo bi n không c n xác ế ầ

đ nh ki u d  li u cho bi n, do đó khi m t bi n ị ể ữ ệ ế ộ ế

được khai báo thì nó có th  ch a b t k  ki u d  ể ứ ấ ỳ ể ữ

li u nào.ệ

a) Cách khai báo bi nế : Trong JavaScript, đ  khai báo ể

bi n dùng t  khoá ế ừ var, cũng có th  b  qua t  khóa ể ỏ ừvar

M t bi n có th  ch a b t k  ki u d  li u nào, ộ ế ể ứ ấ ỳ ể ữ ệgiá tr  c a bi n có tác d ng t  v  trí khai báo tr  ị ủ ế ụ ừ ị ởđi

c) Quy t c đ t tên bi n:ắ ặ ế  

Tên bi n g m các ch  cái và s , không dùng các ký ế ồ ữ ố

t  đ c bi t nh : ( , [ , { , # , & …. theo nguyên t c ự ặ ệ ư ắsau:

a) Tên bi n ph i b t đ u b ng ký t  ho c ký t  ế ả ắ ầ ằ ự ặ ự

g ch dạ ưới( _ )b) Không b t đ u b ng ký t  s ắ ầ ằ ự ố

c) Không ch a kho ng tr ng, tên bi n ph i g i nhứ ả ắ ế ả ợ ớd) Không trùng v i t  khoá c a JavaScript ớ ừ ủ

d) Các t  khoá trong JavaScriptừ  

abstract extends Int super

e) T m v c c a bi nầ ự ủ ế : là t m  nh hầ ả ưởng c a bi n ủ ế

trong chương trình. Có 2 lo i bi n:ạ ế

 Bi n toàn c cế ụ  : được khai báo ngoài các hàm. 

Ph m vi ho t đ ng c a bi n là t  v  trí khai báo ạ ạ ộ ủ ế ừ ị

tr  v  sau trong chở ề ương trình

 Bi n c c bế ụ ộ: được khai báo trong chương trình 

con. Ph m vi ho t đ ng c a bi n là t  v  trí khai ạ ạ ộ ủ ế ừ ịbáo đ n k t thúc chế ế ương trình con

L u ý: N u tên bi n toàn c c và c c b  trùng nhau ư ế ế ụ ụ ộthì biên đượ ử ục s  d ng trong hàm là bi n c c b ế ụ ộ

2. D  li u ữ ệ : Có 4 lo i d  li uạ ữ ệ

a) Ki u s ể ố: m t bi n ki u s  ch a b t k  giá tr  s  ộ ế ể ố ứ ấ ỳ ị ố

nào: s  th p phân, s  nguyên, s  d ng ch m ố ậ ố ố ạ ấ

ph y đ ng.ẩ ộ

b) Ki u chu i ể ổ : m t bi n ki u chu i có th  ch a ộ ế ể ổ ể ứ

m t nhóm ký t  (Ch  cái, ký t  s , kho ng tr ng, ộ ự ữ ự ố ả ắcác ký t  đ c bi t, …). Giá tr  chu i ph i đ t ự ặ ệ ị ổ ả ặ

trong c p d u nháy đôi (“ “) ho c đ n (‘ ‘) ặ ấ ặ ơ

Ví d : ụvar  s1, s2, s3 ;s1=”Hello  World” ;s2=’Hello World ‘ ;

c) Ki u Boolean ể : Là d  li u ch  có 2 giá tr  False ữ ệ ỉ ị

ho c True thặ ường dùng trong trường h p bi n ợ ế

Tóan Tử Ch c Năngứ Ví dụ K t quế ả

Tóan Tử Ví dụ Tương đương

e) Toán t  chu i ử ỗ

Ký hi u: + : Là phép toán n i hai chu i  ệ ố ỗ

f) Tóan t  Đi u ki nử ề ệ : 

Cú pháp: (Đi u ki n) ? value1: value2ề ệ

N u bi u th c đi u ki n đúng thì tr  v  giá tr  value ế ể ứ ề ệ ả ề ị