vi
new
0
Avatar
Tuyến Nguyễn @nguyen.thi.tuyen
458 29 25
Đã đăng vào thg 8 25, 2017 9:38 CH 12 phút đọc
719

Bắt Đầu với Javascript (P4)

Trong phần này sẽ tiếp tục tìm hiểu về các câu lệnh, cấu trúc lệnh của javaScript.

Trong javaScript kết thúc mỗi câu lệnh sẽ dùng dấu chấm phẩy (😉 để ngăn cách các câu lệnh.

1.Block statement - Khối lệnh

Câu lệnh cơ bản nhất là một câu lệnh khối được sử dụng cho các câu lệnh nhóm. Khối được phân cách bởi một cặp ngoặc nhọn {}:

{
  statement_1;
  statement_2;
  .
  .
  .
  statement_n;
}

Ví dụ: khối lệnh thường được sử dụng với các câu lệnh điều khiển (ví dụ: if, for, while).

while (x < 10) {
  x++;
}

Ở đây, {x ++; } Là câu khối lệnh.

2. Conditional statements - câu lệnh điều kiện

Một câu lệnh điều kiện là một tập hợp các lệnh được thực hiện nếu điều kiện xác định là true. JavaScirpt hỗ trợ 2 lệnh điều kiện: if ... else và switch.

lệnh if...else

Sử dụng câu lệnh if để thực hiện một câu lệnh nếu một điều kiện hợp lý là đúng. Sử dụng mệnh đề tùy chọn else để thực hiện một câu lệnh nếu điều kiện là sai. Câu lệnh if như sau:

if (condition) {
  statement_1;
} else {
  statement_2;
}

Ở đây, điều kiện có thể là bất kỳ biểu thức nào đánh giá đúng hoặc sai. Nếu điều kiện đánh giá đúng, statement_1 được thực thi; Nếu không, statement_2 được thực thi. statement_1 và statement_2 có thể là bất kỳ câu lệnh nào, bao gồm các câu lệnh if lồng nhau khác.

Bạn cũng có thể kết hợp các lệnh bằng cách sử dụng else if có nhiều điều kiện kiểm tra theo trình tự, như sau:

if (condition_1) {
  statement_1;
} else if (condition_2) {
  statement_2;
} else if (condition_n) {
  statement_n;
} else {
  statement_last;
}

Trong trường hợp nhiều điều kiện chỉ điều kiện đầu tiên hợp lý được đánh giá là đúng sẽ được thực hiện. Để thực hiện nhiều câu lệnh, nhóm chúng lại trong một khối sử dụng cặp dấu ngoặc nhọn ({...}). Nói chung, tốt nhất luôn luôn sử dụng khối lệnh khi sử dụng các lệnh if lồng nhau:

if (condition) {
  statement_1_runs_if_condition_is_true;
  statement_2_runs_if_condition_is_true;
} else {
  statement_3_runs_if_condition_is_false;
  statement_4_runs_if_condition_is_false;
}

Bạn nên không sử dụng các phép gán đơn giản trong một biểu thức có điều kiện vì nó có thể bị nhầm lẫn với sự bình đẳng khi lướt qua code. Ví dụ: không sử dụng code sau:

if (x = y) {
  /* statements here */
}

Nếu bạn cần sử dụng một phép gán trong một biểu thức có điều kiện, một thực tế phổ biến là đặt dấu ngoặc đơn bổ sung ngoài phép gán. Ví dụ:

if ((x = y)) {
  /* statements here */
}

Falsy values

Các giá trị sau đánh giá là false (còn được gọi là giá trị Falsy):

  • false
  • undefined
  • null
  • 0
  • NaN
  • string rỗng ("")

Tất cả các giá trị khác, bao gồm tất cả các đối tượng, đánh giá là true khi pass một câu lệnh có điều kiện.

Không nhầm lẫn các giá trị boolean nguyên thủy true và false với các giá trị true và false của đối tượng Boolean. Ví dụ:

var b = new Boolean(false);
if (b) // this condition evaluates to true
if (b == true) // this condition evaluates to false

Ví du: Trong ví dụ sau, hàm checkData trả về true nếu số ký tự trong một đối tượng Text là 3; Nếu không, nó sẽ hiển thị một alert và trả về false.

function checkData() {
  if (document.form1.threeChar.value.length == 3) {
    return true;
  } else {
    alert('Enter exactly three characters. ' +  document.form1.threeChar.value + ' is not valid.');
    return false;
  }
}

lệnh switch

Một câu lệnh switch cho phép một chương trình đánh giá một biểu thức và thử khớp giá trị của biểu thức (expression) với các case (label_1, label_2, ...). Nếu tìm thấy case phù hợp, chương trình sẽ thực thi câu lệnh trong case đó. Một câu lệnh switch có dạng như sau:

switch (expression) {
  case label_1:
    statements_1
    [break;]
  case label_2:
    statements_2
    [break;]
    ...
  default:
    statements_def
    [break;]
}

Chương trình đầu tiên tìm mệnh đề case với một nhãn phù hợp với giá trị của biểu thức và sau đó truyền điều khiển tới mệnh đề đó, thực hiện các câu lệnh có liên quan. Nếu không tìm thấy label phù hợp, chương trình sẽ tìm lựa chọn mệnh đề default, và nếu tìm thấy, chuyển đến mệnh đề đó, thực hiện các câu lệnh có liên quan. Nếu không tìm thấy mệnh đề default, chương trình sẽ tiếp tục thực hiện tại câu lệnh sau khi kết thúc chuyển đổi. Theo quy ước, mệnh đề default là mệnh đề cuối cùng, nhưng nó không cần phải như vậy.

Câu lệnh break tùy chọn được kết hợp với mỗi mệnh đề case đảm bảo rằng chương trình thoát ra khỏi switch khi câu lệnh kết hợp được thực hiện và tiếp tục thực hiện tại câu lệnh sau chuyển đổi. Nếu break bị bỏ qua, chương trình sẽ tiếp tục thực thi câu lệnh kế tiếp trong câu lệnh switch.

Ví dụ: Trong ví dụ sau, nếu fruittype đánh giá là "Bananas", chương trình này khớp với giá trị với trường hợp "Bananas" và thực hiện câu lệnh có liên quan. Khi gặp break, chương trình sẽ kết thúc switch và thực hiện câu lệnh sau switch. Nếu break được bỏ qua, lệnh cho trường hợp "Cherries" sẽ được thực hiện.

switch (fruittype) {
  case 'Oranges':
    console.log('Oranges are $0.59 a pound.');
    break;
  case 'Apples':
    console.log('Apples are $0.32 a pound.');
    break;
  case 'Bananas':
    console.log('Bananas are $0.48 a pound.');
    break;
  case 'Cherries':
    console.log('Cherries are $3.00 a pound.');
    break;
  case 'Mangoes':
    console.log('Mangoes are $0.56 a pound.');
    break;
  case 'Papayas':
    console.log('Mangoes and papayas are $2.79 a pound.');
    break;
  default:
   console.log('Sorry, we are out of ' + fruittype + '.');
}
console.log("Is there anything else you'd like?");

3. Exception handling statements

Bạn có thể ném các ngoại lệ bằng cách sử dụng câu lệnh throw và xử lý chúng bằng cách sử dụng câu lệnh try ... catch.

  • throw statement
  • try...catch statement

Exception types

Về bất kỳ đối tượng có thể được ném ra trong JavaScript. Tuy nhiên, không phải tất cả các đối tượng ném ra được tạo ra đều như nhau. Mặc dù việc ném ra numbers hoặc strings như các errors là khá phổ biến, nhưng nó sẽ hiệu quả hơn nếu sử dụng một trong các loại ngoại lệ được tạo ra đặc biệt cho mục đích này:

  • ECMAScript exceptions
  • DOMException và DOMError

lệnh throw

Sử dụng lệnh throw để ném ngoại lệ. Khi bạn ném một ngoại lệ, bạn chỉ định biểu thức (expression) có chứa giá trị được ném:

throw expression;

Bạn có thể ném bất kỳ biểu thức, không chỉ biểu thức của một loại cụ thể. Đoạn mã sau ném một số ngoại lệ của các loại khác nhau:

throw 'Error2';   // String type
throw 42;         // Number type
throw true;       // Boolean type
throw {toString: function() { return "I'm an object!"; } };

Chú ý: Bạn có thể chỉ định một đối tượng khi bạn ném một ngoại lệ. Sau đó bạn có thể tham chiếu đến thuộc tính của đối tượng trong khối catch. Ví dụ sau tạo một đối tượng myUserException của type UserException và sử dụng nó trong một câu lệnh throw.

// Create an object type UserException
function UserException(message) {
  this.message = message;
  this.name = 'UserException';
}

// Make the exception convert to a pretty string when used as a string 
// (e.g. by the error console)
UserException.prototype.toString = function() {
  return this.name + ': "' + this.message + '"';
}

// Create an instance of the object type and throw it
throw new UserException('Value too high');

lệnh try...catch

Câu lệnh try ... catch đánh dấu một khối các câu lệnh để thử, và chỉ định một hoặc nhiều câu trả lời nếu một ngoại lệ được ném ra. Nếu một ngoại lệ được ném ra, câu lệnh try ... catch catching nó.

Câu lệnh try ... catch chứa một khối try, có chứa một hoặc nhiều câu lệnh, và một khối catch, chứa các câu lệnh xác định phải làm gì nếu một ngoại lệ được ném vào khối try. Nghĩa là bạn muốn chặn thử thành công, và nếu nó không thành công, bạn muốn điều khiển để vượt qua khối catch. Nếu bất kỳ tuyên bố trong khối try (hoặc trong một chức năng được gọi là từ bên trong khối try) ném một ngoại lệ, kiểm soát ngay lập tức chuyển sang chặn bắt. Nếu không có ngoại lệ được ném vào khối try, khối catch được bỏ qua. Các khối cuối cùng thực hiện sau khi thử và bắt các khối thực hiện nhưng trước khi các báo cáo sau các câu try ... catch.

Ví dụ sau sử dụng câu lệnh try ... catch. Ví dụ gọi một hàm lấy ra một tên tháng từ mảng dựa trên giá trị được truyền đến hàm. Nếu giá trị không tương ứng với số tháng (1-12), ngoại lệ được ném ra với giá trị "InvalidMonthNo" và các câu lệnh trong khối catch gán biến monthName thành unknown.

function getMonthName(mo) {
  mo = mo - 1; // Adjust month number for array index (1 = Jan, 12 = Dec)
  var months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul',
                'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
  if (months[mo]) {
    return months[mo];
  } else {
    throw 'InvalidMonthNo'; //throw keyword is used here
  }
}

try { // statements to try
  monthName = getMonthName(myMonth); // function could throw exception
}
catch (e) {
  monthName = 'unknown';
  logMyErrors(e); // pass exception object to error handler -> your own function
}

khối catch

Bạn có thể sử dụng một khối catch để xử lý tất cả các ngoại lệ có thể được tạo ra trong khối try.

catch (catchID) {
  statements
}

Khối catch xác định một định danh (catchID trong cú pháp trước) chứa giá trị theo quy định của lệnh throw; Bạn có thể sử dụng định danh này để nhận thông tin về ngoại lệ bị ném ra. JavaScript tạo ra định danh này khi khối catch được nhập; Định danh chỉ tồn tại trong suốt thời gian của khối catch; Sau khi khối catch bắt đầu thực thi, định danh không còn tồn tại.

Ví dụ, mã sau đây ném một ngoại lệ. Khi ngoại lệ xảy ra, kiểm soát chuyển đến khối catch.

try {
  throw 'myException'; // generates an exception
}
catch (e) {
  // statements to handle any exceptions
  logMyErrors(e); // pass exception object to error handler
}

khối finally

Các khối finally chứa câu lệnh để thực hiện sau khi thử và nắm bắt các khối thực thi nhưng trước khi những điều khoản sau lần thử ... lệnh catch. Các khối finally thực thi hay không là một ngoại lệ được ném. Nếu một ngoại lệ được ném, các câu lệnh trong khối finally thực hiện ngay cả khi không có khối catch xử lý ngoại lệ.

openMyFile();
try {
  writeMyFile(theData); //This may throw a error
} catch(e) {  
  handleError(e); // If we got a error we handle it
} finally {
  closeMyFile(); // always close the resource
}

Nếu khối finally trả về một giá trị, giá trị này trở thành giá trị trả về của toàn bộ cấu trúc try-catch-finally, không có lưu ý nào về lệnh return trong các khối try và catch:

function f() {
  try {
    console.log(0);
    throw 'bogus';
  } catch(e) {
    console.log(1);
    return true; // this return statement is suspended
                 // until finally block has completed
    console.log(2); // not reachable
  } finally {
    console.log(3);
    return false; // overwrites the previous "return"
    console.log(4); // not reachable
  }
  // "return false" is executed now  
  console.log(5); // not reachable
}
f(); // console 0, 1, 3; returns false

Ghi đè các giá trị trả về bởi khối finally cũng áp dụng cho các ngoại lệ được ném hoặc ném lại bên trong khối catch:

function f() {
  try {
    throw 'bogus';
  } catch(e) {
    console.log('caught inner "bogus"');
    throw e; // this throw statement is suspended until 
             // finally block has completed
  } finally {
    return false; // overwrites the previous "throw"
  }
  // "return false" is executed now
}

try {
  f();
} catch(e) {
  // this is never reached because the throw inside
  // the catch is overwritten
  // by the return in finally
  console.log('caught outer "bogus"');
}

// OUTPUT
// caught inner "bogus"

các lệnh try...catch lồng nhau

Bạn có thể lồng một hoặc nhiều câu lệnh try ... catch với nhau. Nếu một lệnh bên trong try ... catch không có một khối catch, nó cần phải có một khối finally và khối catch của lệnh try...catch được kiểm tra cho phù hợp. Để biết thêm thông tin, hãy xem ví dụ dưới:

try {
  try {
    throw new Error('oops');
  }
  finally {
    console.log('finally');
  }
}
catch (ex) {
  console.error('outer', ex.message);
}

// Output:
// "finally"
// "outer" "oops"

Bây giờ, nếu chúng ta đã bắt được ngoại lệ trong khối try bên trong bằng cách bổ sung một khối catch:

try {
  try {
    throw new Error('oops');
  }
  catch (ex) {
    console.error('inner', ex.message);
  }
  finally {
    console.log('finally');
  }
}
catch (ex) {
  console.error('outer', ex.message);
}

// Output:
// "inner" "oops"
// "finally"

Và bây giờ, hãy ném lại lỗi:

try {
  try {
    throw new Error('oops');
  }
  catch (ex) {
    console.error('inner', ex.message);
    throw ex;
  }
  finally {
    console.log('finally');
  }
}
catch (ex) {
  console.error('outer', ex.message);
}

// Output:
// "inner" "oops"
// "finally"
// "outer" "oops"

Kết luận:

Trên đây là một số cú pháp khác của javaScript. Cảm ơn bạn đã theo dõi bài viết. Mong rằng nó có thể giúp ích cho bạn.

Tham khảo:

JavaScript

All rights reserved

Mục lục


Viblo
Hãy đăng ký một tài khoản Viblo để nhận được nhiều bài viết thú vị hơn.
Đăng kí