function declaration và function expression trong JavaScript

Chúng ta có hai kiểu function trong ngôn ngữ JavaScript (ở đây Góc Kinh Nghiệm dùng chính xác từ tiếng Anh cho các bạn dễ hiểu): function declaration và function expression

// Function Declaration
function test(val){
    return val=== true;
}

// Function Expression
var isTest = function(val){
    return val === true;
}

Câu hỏi đặt ra là: chúng khác nhau chỗ nào?

function declaration vs function expression

Sự khác nhau đó là: function declaration có thể được lôi cổ gọi dùng bất cứ khi nào, bất cứ chỗ nào bởi bộ phân tích (interpreter) của trình duyệt. JavaScript biết sự có mặt của nó và parse nó trước khi chương trình JavaScript của chúng ta thực thi. Nói một cách khác (trừu tượng hơn) đó là JavaScript đưa các function loại này lên trên top của scope hiện tại. Làm một cái ví dụ cho dễ hiểu

myFunc();
function myFunc (){
	alert(“Hello Góc Kinh Nghiệm”);
}

Ở ví dụ trên chúng ta thấy hàm test() được gọi trước khi nó được khai báo. Tuy nhiên, chúng ta cũng có thể viết dạng như sau cũng được:

function myFunc (){
	alert(“Hello Góc Kinh Nghiệm”);
}
myFunc();

Còn function expression thì sao? Nó không được JavaScript đánh giá cho đến khi nó được gán vào biến. Hơi trừu tượng một tí, chúng ta làm cái ví dụ cho dễ hiểu

// Báo lỗi nè!
expression();
var expression = function (){
	alert(“Gọi tui là lỗi nha mấy chú”);
}

Nếu các bạn chạy đoạn mã trên thì sẽ báo lỗi vì expression được gọi trước khi nó được khai báo. Để chạy được, chúng ta phải viết lại như sau:

var expression = function (){
	alert(“Gọi tui là lỗi nha mấy chú”);
}
expression();

Tóm lại thì sao: function declaration thì có thể gọi trước khi khai báo hoặc sau khi khai báo đều được, còn function expression thì phải có trình tự. Thế thôi :)


4 comments

  1. Chào anh,

    Nếu giải thích vậy thì hok có lý do gì javascript lại để cho khai báo 2 cách như vậy, và nếu như vậy thì việc dùng function declaration sẽ tiện hơn rất nhiều so với thằng còn lại.

    Giả sử nếu mình tạo một đối tượng js, và muốn tạo một function trong đối tương đó thì mình sẽ dùng thằng gì? Hy vọng câu hỏi này sẽ giải quyết được vấn đề là mục đích sử dụng function expression.

    Thanks

  2. Chào bạn,
    mình xin được giải thích rõ hơn về function declaration và function expression.
    Đối với function declaration, khi trình duyệt nhận được file JS chứa nó, các function này được lưu ngay vào bộ nhớ ram và nó thực thi ngay hành động của function đó =>> tốn bộ nhớ ram, ảnh hưởng tới thiết bị di động rất nhiều.
    Đối với function expression, function không lưu vào bộ nhớ ram, nó chỉ hoạt động khi được gọi => Mình hay sử dụng cách khai báo này.

    Thân,
    nếu có gì thắc mắc các bạn có thể inbox fb.com/loctran.ict
    rất vui được chia sẻ cùng các bạn

Leave a Reply

Your email address will not be published. Required fields are marked *