- vừa được xem lúc

Bóc tách JavaScript: Biểu thức và câu lệnh - khác biệt nằm ở đâu?

0 0 1

Người đăng: Vũ Tuấn

Theo Viblo Asia

Trong hành trình khám phá JavaScript, việc phân biệt biểu thức và câu lệnh là một bước quan trọng giúp bạn viết code hiệu quả hơn. Hãy cùng tìm hiểu sự khác biệt giữa hai khái niệm này và tại sao chúng lại quan trọng đối với lập trình viên JavaScript.

Khởi đầu đơn giản: Hiểu rõ những điều căn bản

Chúng ta hãy bắt đầu với một ví dụ đơn giản:

const x = 5;

Ở đây, chúng ta đã tạo một hằng số x và gán cho nó giá trị 5. Rất dễ hiểu phải không?

Bây giờ, hãy xem dòng code này:

const y = getAnswer();

Mặc dù getAnswer() có thể là một hàm phức tạp với hàng trăm dòng code, nhưng nó vẫn quy về cùng một dạng với x = 5 — nó trả về một giá trị. Và đây chính là điểm mấu chốt đầu tiên: trong JavaScript, biểu thức là bất cứ đoạn code nào có thể được đánh giá thành một giá trị, cho dù đơn giản hay phức tạp.

Vậy thì biểu thức là gì?

Biểu thức là bất kỳ đoạn code nào được đánh giá thành một giá trị. Một con số đơn lẻ, như 5, là một biểu thức bởi vì nó đã là một giá trị. Nhưng một phép toán phức tạp hơn như 2 + 3 cũng là một biểu thức — nó được đánh giá thành 5.

Dưới đây là một số ví dụ về biểu thức:

12 // Evaluates to 12.
7 + 5 // Evaluates to 12.
Math.sqrt(16) // Evaluates to 4.
"Hello" + " World" // Evaluates to "Hello World".

Trong tất cả các trường hợp này, code tạo ra một giá trị sau khi được đánh giá, và đó chính là điều làm cho nó trở thành một biểu thức.

Vậy câu lệnh là gì?

Trong khi biểu thức tập trung vào việc tạo ra giá trị, câu lệnh lại tập trung vào việc thực hiện các hành động. Hãy coi câu lệnh như những chỉ dẫn hoặc mệnh lệnh trong code của bạn, cho JavaScript biết cần phải làm gì.

Ví dụ, các cấu trúc điều khiển luồng như điều kiện if, vòng lặp for và vòng lặp while là câu lệnh bởi vì chúng khiến mọi thứ xảy ra, nhưng bản thân chúng không trả về giá trị.

if (x > 10) { console.log("x is greater than 10");
}

Câu lệnh if này kiểm tra xem x có lớn hơn 10 hay không. Nếu điều kiện là đúng, nó sẽ chạy code bên trong khối lệnh. Nhưng bản thân nó không tự động trả về một giá trị.

Sự khác biệt này có ý nghĩa gì?

Ban đầu, tôi đã nghĩ rằng sự khác biệt giữa biểu thức và câu lệnh chỉ là một chi tiết kỹ thuật. Nhưng khi tìm hiểu sâu hơn, tôi nhận ra rằng nó thực sự ảnh hưởng đến cách tôi viết code. Dưới đây là lý do:

  • Bạn không thể sử dụng câu lệnh ở những nơi yêu cầu biểu thức. Ví dụ: bạn không thể truyền một câu lệnh if làm đối số cho một hàm bởi vì hàm mong đợi một giá trị, không phải một hành động.
 const result = if (x > 10) { ... } // This will cause an error!

Tuy nhiên, bạn có thể truyền một biểu thức, bởi vì nó được đánh giá thành một giá trị:

 const result = x > 10 ? "Yes" : "No"; // The ternary operator is an expression!

Trong trường hợp này, toán tử ba ngôi được đánh giá thành "Yes" hoặc "No", là một giá trị có thể được gán cho biến result.

Biểu thức bên trong biểu thức: Một bí mật thú vị

Một điều tôi thấy hấp dẫn là JavaScript cho phép bạn lồng các biểu thức bên trong các biểu thức khác. JavaScript sẽ đánh giá chúng lần lượt từng cái một và kết quả cuối cùng sẽ là một giá trị duy nhất.

Dưới đây là một ví dụ:

const result = Math.sqrt(2 + 7);
// First, 2 + 7 evaluates to 9.
// Then, Math.sqrt(9) evaluates to 3.

Mặc dù có hai biểu thức ở đây, JavaScript sẽ giải quyết cả hai để trả về giá trị cuối cùng là 3.

Biểu thức và câu lệnh: So sánh nhanh

Để tóm tắt, dưới đây là bảng so sánh:

Biểu thức:

  • Luôn luôn được đánh giá thành một giá trị.
  • Có thể được sử dụng ở bất cứ đâu JavaScript mong đợi một giá trị, chẳng hạn như trong các đối số của hàm hoặc phép gán.
  • Có thể đơn giản (như 5) hoặc phức tạp (như Math.sqrt(4)).

Câu lệnh:

  • Thực hiện các hành động hoặc kiểm soát luồng của chương trình.
  • Bản thân chúng không được đánh giá thành giá trị.
  • Ví dụ bao gồm điều kiện if, vòng lặp và khai báo.

Tại sao bạn nên quan tâm đến sự khác biệt này?

Biết được sự khác biệt giữa biểu thức và câu lệnh có thể giúp bạn viết code tốt hơn và hiệu quả hơn. Hiểu được khi nào JavaScript mong đợi một giá trị (một biểu thức) so với khi nào nó cần một chỉ dẫn (một câu lệnh) có thể giúp bạn tránh được những lỗi gây nhầm lẫn và làm cho code của bạn trở nên rõ ràng hơn.

Chẳng hạn, việc cố gắng gán một câu lệnh if cho một biến sẽ gây ra lỗi bởi vì câu lệnh if không tạo ra giá trị. Nhưng việc gán một biểu thức ba ngôi cho một biến hoạt động bởi vì nó được đánh giá thành một giá trị.

Kết luận

Việc tìm hiểu sự khác biệt giữa biểu thức và câu lệnh đã giúp tôi hiểu được cách JavaScript hoạt động từ bên trong. Biểu thức là các khối xây dựng giá trị trong code của bạn, trong khi câu lệnh cho chương trình biết phải làm gì.

Một khi bạn nắm bắt được điều này, bạn sẽ bắt đầu nhận ra lý do tại sao một số phần code của bạn lại hoạt động theo cách chúng hoạt động, và tại sao một số thứ nhất định (như gán một câu lệnh if cho một biến) lại không hoạt động.

Cảm ơn các bạn đã theo dõi.

Bình luận

Bài viết tương tự

- vừa được xem lúc

Giới thiệu Typescript - Sự khác nhau giữa Typescript và Javascript

Typescript là gì. TypeScript là một ngôn ngữ giúp cung cấp quy mô lớn hơn so với JavaScript.

0 0 522

- vừa được xem lúc

Bạn đã biết các tips này khi làm việc với chuỗi trong JavaScript chưa ?

Hi xin chào các bạn, tiếp tục chuỗi chủ đề về cái thằng JavaScript này, hôm nay mình sẽ giới thiệu cho các bạn một số thủ thuật hay ho khi làm việc với chuỗi trong JavaScript có thể bạn đã hoặc chưa từng dùng. Cụ thể như nào thì hãy cùng mình tìm hiểu trong bài viết này nhé (go).

0 0 433

- vừa được xem lúc

Một số phương thức với object trong Javascript

Trong Javascript có hỗ trợ các loại dữ liệu cơ bản là giống với hầu hết những ngôn ngữ lập trình khác. Bài viết này mình sẽ giới thiệu về Object và một số phương thức thường dùng với nó.

0 0 153

- vừa được xem lúc

Tìm hiểu về thư viện axios

Giới thiệu. Axios là gì? Axios là một thư viện HTTP Client dựa trên Promise.

0 0 143

- vừa được xem lúc

Imports và Exports trong JavaScript ES6

. Giới thiệu. ES6 cung cấp cho chúng ta import (nhập), export (xuất) các functions, biến từ module này sang module khác và sử dụng nó trong các file khác.

0 0 110

- vừa được xem lúc

Bài toán đọc số thành chữ (phần 2) - Hoàn chỉnh chương trình dưới 100 dòng code

Tiếp tục bài viết còn dang dở ở phần trước Phân tích bài toán đọc số thành chữ (phần 1) - Phân tích đề và những mảnh ghép đầu tiên. Bạn nào chưa đọc thì có thể xem ở link trên trước nhé.

0 0 245