/ / Javascript & Jquery / Comment (1)

Javascript cơ bản

Trước khi vào bài mới về Javascript các bạn cần có cái nhìn tổng quan về ngôn ngữ này tại đây .Trong bài này mình sẽ giới thiệu cho các bạn về cách khai báo sử dụng biến,toán tử,mảng,câu điều kiện,vòng lặp…trong javascript.Chúng ta hãy cùng đi qua từng phần một nhé.

Biến trongJavascript

Cú pháp:

var <tênbiến>;

Ví dụ:

<script type="text/javascript">
var x = 1;
var y = “javascript”;
</script>

Chú ý: Qui tắc đặt tên biến
– Tên biến phải bắt đầu bằng ký tự hoặc dấu gạch dưới ( _ ) và không có khoảng trắng.
– Tên biến phân biệt chữ hoa và chữ thường
– Tên biến không được trùng với các từ khóa.

Toán tử trong Javascript

– Hệ thống phép tính trong JavaScript:

+ : Phép cộng.
– : Phép trừ.
* : Phép nhân
/: Phép chia
% : Phép chia lấy phần dư.
++: Phép tăng một đơn vị.
–: Phép giảm một đơn vị.

– Toán tử so sánh:

== : So sánh bằng.
> : So sánh lớn hơn.
< : Nhỏ hơn. >= : So sánh lớn hơn hoặc bằng.
<= : Nhỏ hơn hoặc bằng.
!= : So sánh khác

– Toán tử logic:

&& (and): Giá trị đúng khi cả hai cùng đúng.
|| (or) : Giá trị đúng nếu một trong 2 đều đúng.

– Toán tử chuỗi:
+ Khai báo chuỗi: Ðể khai báo một giá trị chuỗi, Javascript sử dụng cặp dấu nháy đơn (‘) để khai báo chuỗi.
Ví dụ:

<script type="text/javascript">
var name = 'Bài học javascript cơ bản tại hocphp.info';
</script>

+ Cộng 2 chuỗi: Sử dụng dấu “+” để thực hiện cộng 2 chuỗi với nhau
Ví dụ:

<script type="text/javascript">
var str1 = 'Bài học javascript cơ bản';
var str2 = 'tại hocphp.info;
var str3 = str1 + str2 ;
alert(str3);
</script>

Câu điều kiện trong Javascript

– Câu điều kiện IF… ELSE:

+ Cú pháp:

<script type="text/javascript">
   if(điều kiên)
   {
      //nếu điều kiện đúng
   }else{
      //nếu điều kiện sai
   }
</script>

+ Ví dụ:

  <script type="text/javascript">
      var diemTB= 6;
      if(diemTB > 5)
      {
            document.write("Bạn được lên lớp");
      }else{
            document.write("Bạn phải thi lại");
      }
   </script>

+ Ở ví dụ trên chúng ta đang thực hiện kiểm tra điều kiện cho biến diemTB, nếu lớn hơn hơn 5 thì in ra thông báo “Bạn được lên lớp” nếu không thì in ra thông báo “Bạn phải thi lại”.
+ các bạn thấy có dòng lệnh document.write() đây chính là câu lệnh hiển thị dữ liệu ra màn hình trong javascript

– Câu điều kiện SWITCH … CASE

+ Đây là câu kiểm tra điều kiện,trong những trường hợp mà có nhiều câu điều kiện if..else thì bạn lên sử dụng câu điều kiện Swithch
+ Ví dụ:

<script type="text/javascript">
var gioitinh = 1;
switch(gioitinh) {
     case 1:
     document.write(“Bạn là nam giới");
     break;
     case 2:
     document.write("Bạn là nữ giới");
     break;
     default:
     document.write(“Giới tính không xác định");
     break;
}
</script>

+ Với ví dụ trên chúng ta đang kiểm tra biến gioitinh nếu biến gioitinh bằng giá trị với case nào đó trong câu lệnh switch thì nó sẽ chạy đoạn mã lệnh bên trong case đó.Ở đây mình dùng thêm lệnh break nhằm thoát khỏi điều kiện switch nếu bạn không có lệnh break thì nó sẽ chạy tới tất cả các case trong switch
Kết quả in ra màn hình sẽ là: “Bạn là nam giới”;

Cửa sổ thông báo

– Hộp thoại cảnh báo (Alert Box),thường để hiển thị lên cảnh báo hoặc thông báo nào đó
Vídụ:

<script type="text/javascript">
alert(‘Nội dung cảnhbáo !’);
</script>

– Hộp thoại xác nhận (Confirm Box),thường hiển thị lên câu hỏi trả lời yes, no (ví dụ hỏi lại admin xem có muốn xóa dư liệu không) nếu bạn chọn yes lúc đó sẽ thực hiện lệnh bên trong,còn nếu không thì sẽ đóng hộp thoại
Vídụ:

<script type="text/javascript">
if(confirm(“Bạn chắc chắn muốn xóa?”))
{
   //lệnh thực thi khi chọn yes
}
</script>

– Hộp thoại nhập liệu(Frompt Box),dùng trong trường hợp cho phép người dùng nhập dữ liệu thông qua hộp thoại
Vídụ:

<script type="text/javascript">
frompt(“Bạn bao nhiêu tuổi?”);
</script>

Hàm trong Javascript

– Hàm thường được gọi trong 1 sự kiện nào đó
– Ưu điểm không phải viết lại các đoạn mã javascript và có thể gọi ra bất kỳ đâu trong html
Cú phap:

function function_name(var1, var2…)

– Hàm có thể có tham số hoặc không có tham số,khi gọi 1 hàm có thể thực hiện 1 chức năng nào đó hoặc hàm trả về 1 giá trị nào đó.

Ví dụ:

<script type="text/javascript">
function phepNhan(a,b) {
   var result;
   result = a * b;
   return result ;
}
</script>

+ Hàm trên là 1 hàm ta tự xây dựng với tên là phepNhan và nó có 2 tham số truyền vào,và khi gọi hàm này sẽ trả về giá trị là tích của 2 tham số đó.Ngoài ra các bạn có thể tự xây dựng các hàm với chức năng khác nhau,có thể có tham số hoặc không,có thể trả về dữ liệu hoặc không.

Vòng lặp trong javascript

– Vòng lặp FOR:

+ Cú pháp:

<script type="text/javascript">
for (startValue; endValue; varIncrement)
{
   //Code here
}
</script>

Giải thích: Trong đó startValue là giá trị bắt đầu vòng lặp, endValue giá trị kết thúc của vòng lặp, varIncrement giá trị tăng
+ Ví dụ In ra giá trị từ 1 tới 10:

<script type="text/javascript">
for (i=1;i<=10;i++)
{
   document.write(“Đầy là số: " + i);
   document.write("<br />");
}
</script>

Vòng lặp sẽ chạy 10 lần,bắt đầu từ số 1 cho tới khi nào vẫn còn thỏa mãn điều khiên nhỏ hơn hoặc bằng 10,mỗi 1 lần lặp giá trị biến i sẽ được tăng lên 1 đơn vị,và kết quả sẽ như sau:

Vòng lặp trong javascript

Vòng lặp trong javascript

– Vòng lặp WHILE
+ Cú pháp:

<script type="text/javascript">
while (điều kiện)
{
   //Code here
}
</script>

Trong khi còn thỏa mãn điều kiện thì sẽ vẵn lặp thực hiện câu lệnh bên trong
+ Ví dụ In ra giá trị từ 1 tới 10:

<script type="text/javascript">
var i = 1;
while(i<=10)
{
    document.write(“Đầy là số: “ + i);
    document.write("<br />");
    i++;
}

Vònglặp DO…WHILE
+ Cú pháp:

<script type="text/javascript">
do{
code here
}
while (điều kiện)
</script>

Vòng lặp này sẽ thực hiện ít nhất 1 lần,sau đó sẽ kiểm tra điều kiện nếu còn thỏa mãn thì tiếp tục lặp
+ Ví dụ In ra giá trị từ 1 tới 10:

<script type="text/javascript">
var i = 1;
do
{
  document.write(“Đầy là số: “ + i);
  document.write("<br />");
  i++;
}
while(i<=10)
</script>

Mảng trong javascript

– Mảng là một đối tượng được sử dụng để lưu trữ nhiều giá trị trong một biến duy nhất
– Tạo mảng:

<script type="text/javascript">
var arr = new Array();
arr[0] = “Giá trị 1";
arr[1] = “Giá trị 2“;
var arr = new Array(“Giá trị 1",“Giá trị 2");
var arr = new Array[“Giá trị 1",“Giá trị 2“];
</script>

– In phần tử trong mảng:

<script type="text/javascript">
document.write(arr[0]);
</script>

– Lấy độ dài của mảng:

<script type="text/javascript">
document.write(arr.length);
</script>

– Duyệt mảng:

<script type="text/javascript">
var arr =new Array[“Giá trị 1",“Giá trị 2“];
for (x in arr)
{
  document.write(arr[x] + "<br />");
}
</script>

– Nối mảng:

<script type="text/javascript">
array.concat(array2, array3, ..., arrayX);
</script>

– Nối các phần tử trong mảng:

<script type="text/javascript">
array.join("|");
</script>

– Đảo ngược mảng:

<script type="text/javascript">
array.reverse();
</script>

– Chuyển mảng thành chuỗi:

<script type="text/javascript">
array.toString();
</script>


01/09/2014
Tags:
Written by nobitacnt

Trong bài viết không tránh khỏi những câu từ chưa chính xác,mong nhận được sự góp ý để website hoàn thiện hơn.Nếu thấy bài viết có ích với bạn hãy like và share để ủng hộ nhé :D.

Bài viết chùng chuyên mục

One comment

Gửi bình luận

Giới thiệu

Mình tạo ra blog này với mong muốn chia sẻ và học hỏi kinh nghiệm trong quá trình thiết kế website. Website đang trong quá trình phát triển chân thành cảm ơn mọi sự góp ý của các bạn để làm cho website ngày càng hoàn thiên.

DMCA.com Protection Status
Theo dõi qua Email

Tổng hợp các bài viết về

Hoc php - CodeIgniter Framework - Laravel Framework - PHP va MYSQL