Vì là lệnh bắt vào một ký tự chứ không phải lệnh nhập, vì thế nên các bạn sẽ thấy nó không giống như các lệnh nhập khi bấm 1 phím bấm nó sẽ ngay lập tức ghi phím vừa nhấn lên màn hình. Hàm getch không như vậy, đơn thuần hàm chỉ bắt lấy phím nhấn, và để lấy được phím đó thì ta có thể gắn nó vào một biến. Code minh họa sử dụng hàm getch () 1 2 3 4 5 Một cách đơn giản hơn, không cần quan tâm tới công thức trên, Excel cung cấp cho chúng ta một hàm FV, để tính giá trị của một khoản tiền theo thời gian như dưới đây. Copy All Code. FV (rate,nper,pmt, [pv], [type]) FV: giá trị của tiền trong tương lai rate: lãi suất nper: số kỳ pmt Ví dụ trên sẽ lấy dấu của biểu thức (2015-2010), tức là sẽ hiển thị: 1. 7. SQRT() Hàm SQRT() dùng để tính căn bậc hai của một số hoặc biểu thức, giá trị trả về của hàm là số có kiểu float. Nếu số hay biểu thức có giá trị âm (<0) thì hàm SQRT() sẽ trả về NULL đối với MySQL, trả về lỗi đối với SQL Bên Trong Node.js (P4) - Express Framework ta sẽ có tất cả tính năng mà Express cung cấp và đôi khi nó sẽ trở nên thừa thải khi ta chỉ cần tính năng định tuyết, Middleware là các hàm được dùng để tiền xử lý, lọc các request trước khi đưa vào xử lý logic hoặc điều Trong lập trình JavaScrip, với vòng for … of, ta không cần phải tạo nhiều biến để định nghĩa, mà khi gọi hàm chạy vẫn trả về được tất cả số lượng tham số truyền vào. Như ví dụ trên, thay vì phải tạo ra 10 biến và console.log () 10 biến đó để định nghĩa cho hàm Fast Money. Function JavaScript hàm trong JavaScript là một thành phần không thể thiếu trong cấu trúc chương trình. Hàm giúp chương trình trở nên rõ ràng, dễ hiểu bằng cách gộp những đoạn code lặp lại. Nhờ vậy mà việc bảo trì phần mềm cũng dễ dàng hơn. Ngoài ra, một hàm tốt độc lập và thực hiện một chức năng nhất định có thể tái sử dụng trong nhiều dự án khác nhau. Điều này giúp nâng cao hiệu suất công việc của lập trình viên. 💡 Trong bài viết về tương tác người dùng với alert, confirm và prompt bạn đã biết về các hàm có sẵn như alert, confirm và prompt. Sau đây, mình sẽ giới thiệu những thành phần cơ bản của hàm trong JavaScript. Qua đó, bạn sẽ hiểu hàm là gì, cách xây dựng hàm và ứng dụng hàm vào các dự án. Hàm trong Javascript là gì? Hàm trong JavaScript là một chương trình con giúp thực thi một công việc cụ thể. Để định nghĩa hàm trong JavaScript, bạn sử dụng từ khoá function với cú pháp là function functionName[parameter1], [parameter2],... { statement1; statement2; ... } Trong đó function là một từ khóa trong JavaScript dùng để định nghĩa hàm. functionName là tên của hàm tên tự đặt. [parameter1], [parameter2],... danh sách các tham số của hàm không bắt buộc. Cuối cùng là thân hàm, bao gồm một hoặc nhiều câu lệnh nằm trong cặp dấu ngoặc {}. Ví dụ hàm sayHello function sayHello { from } Để gọi hàm, bạn sử dụng tên hàm function sayHello { from } sayHello; // Hello from Khi gọi hàm, đoạn code bên trong thân hàm sẽ được thực thi. Trong ví dụ trên, đoạn code được thực hiện hai lần ứng với hai lần gọi hàm. Bạn có thể thấy rằng, hàm giúp tránh lặp lại code. Giả sử bạn cần thay đổi nội dung với trên, bạn chỉ cần thay đổi một chỗ bên trong thân hàm. Đến đây chắc bạn đã phần nào hiểu được hàm là gì rồi phải không? Sau đây, mình sẽ đi vào chi tiết các đặc điểm của hàm trong JavaScript. Biến cục bộ trong hàm Một biến được khai báo bên trong hàm, chỉ sử dụng được bên trong thân hàm đó. Biến này gọi là biến cục bộ hay biến địa phương. Ví dụ về biến cục bộ trong JavaScript function sayHello { const message = "Hello from } sayHello; // Hello from // Uncaught ReferenceError message is not defined Trong ví dụ trên, biến message là biến cục bộ bên trong hàm sayHello. Tức là biến message chỉ dùng được ở trong thân hàm sayHello. Khi bạn cố gắng truy cập vào biến message ở ngoài hàm, bạn sẽ bị lỗi Uncaught ReferenceError message is not defined. Biến ngoài hàm trong JavaScript Một hàm trong JavaScript có thể truy cập vào biến được khai báo bên ngoài hàm, ví dụ let message = "Hello from function sayHello { } sayHello; // Hello from Hơn nữa, bạn có thể thay đổi giá trị của biến ngoài hàm từ trong thân hàm let message = "Hello from function sayHello { message = "Hi!"; } sayHello; // Hi! // Hi! Tuy nhiên, nếu bên trong thân hàm khai báo một biến trùng tên với biến ngoài hàm thì biến ngoài hàm "bị bỏ qua" let message = "Hello from function sayHello { let message = "Hi!"; } sayHello; // Hi! // Hello from 📝 Biến toàn cục Một biến được khai báo ở ngoài tất cả các hàm, gọi là biến toàn cục. Biến toàn cục có thể được sử dụng và thay đổi giá trị ở mọi nơi trong chương trình. Vì vậy, bạn nên hạn chế sử dụng biến toàn cục. Điều này giúp hàm trở nên tốt hơn, dễ dàng tái sử dụng hơn vì nó độc lập với các biến bên ngoài. Truyền tham số vào hàm Trong trường hợp bạn muốn sử dụng giá trị của biến bên ngoài vào trong thân hàm, bạn có thể truyền tham số vào hàm thay vì sử dụng biến toàn cục. Ví dụ truyền tham số vào hàm function sayHellomessage { } sayHello"Hello!"; // Hello! sayHello"Hi!"; // Hi! Khi hàm sayHello được gọi, giá trị string được sao chép copy vào biến cục bộ message. Trong thân hàm sẽ sử dụng biến cục bộ đó. khi truyền tham số vào hàm ngoại trừ object là kiểu dữ liệu tham chiếu, hàm trong JavaScript luôn thực hiện sao chép dữ liệu mà không làm thay đổi giá trị biến bên ngoài. Ví dụ let message = "Hello from function sayHellomessage { message = "Hi!"; } sayHello; // Hi! // Hello from Bạn thấy rằng là bên trong hàm đã gán giá trị Hi! cho biến message. Nhưng giá trị của biến message bên ngoài không hề thay đổi. 📝 Số lượng tham số của hàm là không giới hạn. Ví dụ hàm có nhiều tham số function sayHellomessage, site { + " from " + site; } sayHello"Hello", " // Hello from Giá trị tham số mặc định Đối với hàm có tham số mà khi gọi hàm, bạn không truyền giá trị vào thì giá trị của tham số đó là undefined, ví dụ function sayHellomessage, site { + " from " + site; } sayHello"Hello"; // Hello from undefined Trong trường hợp này, bạn có thể định nghĩa "giá trị mặc định" cho tham số bằng cách sử dụng toán tử gán = như sau function sayHellomessage, site = " { + " from " + site; } sayHello"Hello"; // Hello from Lúc này, nếu bạn không truyền giá trị vào tham số site thì giá trị của nó mặc định là Trong ví dụ trên, giá trị mặc định chỉ là một giá trị string. Tuy nhiên, giá trị mặc định có thể là một biểu thức hoặc thậm chí là một hàm khác, ví dụ function aFunction { // code } function sayHellomessage, site = aFunction { + " from " + site; } Trong ví trên, hàm aFunction chỉ được gọi khi bạn không truyền giá trị cho tham số site. Return trong JavaScript Hàm trong JavaScript có thể trả về giá trị khi gọi hàm. Ví dụ hàm tính tổng hai số function suma, b { return a + b; } const result = sum1, 2; // 3 Từ khóa return trong JavaScript có thể đặt ở bất kỳ đâu trong thân hàm. Khi gặp từ khóa return, hàm sẽ dừng lại và trả về giá trị sau return. Có thể dùng nhiều từ khóa return trong hàm function suma, b { if a === null a === undefined { số không hợp lệ!"; return; } if b === null b === undefined { số không hợp lệ!"; return; } return a + b; } const result1 = sum; // Tham số không hợp lệ! Ví dụ trên, mình kiểm tra điều kiện cho a và b. Nếu chúng bằng null hoặc undefined thì sẽ return luôn mà không thực hiện tính tổng. Bạn cũng thấy rằng, hai vị trí return đầu tiên không có giá trị nào theo sau. Khi đó, giá trị trả về mặc định là undefined function suma, b { return; } let r = sum1, 2; // undefined Ngoài ra, nếu hàm không có return thì giá trị trả về cũng là undefined function suma, b {} let r = sum1, 2; // undefined không được xuống dòng ngay sau return. Vì JavaScript sẽ hiểu là bạn không return giá trị nào cả. Ví dụ function suma, b { return; a + b; } const result = sum1, 2; // undefined Trình thông dịch JavaScript sẽ tự động thêm dấu ; ngay sau return. Do đó, giá trị trả về của hàm trên là undefined. Và thành phần a + b phía dưới sẽ không bao giờ được chạy tới. Nếu cần xuống dòng thì bạn phải đưa giá trị trả về vào trong cặp dấu ngoặc đơn như sau function suma, b { return a + b; } const result = sum1, 2; // 3 Cách đặt tên hàm trong JavaScript Quy tắc đặt tên hàm trong JavaScript cũng giống như quy tắc đặt tên biến hay hằng trong JavaScript Bắt đầu bằng chữ cái, dấu gạch dưới _ hoặc kí tự "đô la" $. Sau kí tự đầu tiên, ngoài những kí tự trên, bạn có thể sử dụng thêm số 0-9. Không sử dụng từ khoá và từ dự trữ. Chuẩn hóa cách đặt tên hàm Vì hàm ứng với một hành động, nên tên hàm chuẩn thường bắt đầu bằng một động từ. Ví dụ một số động từ hay dùng để đặt tên hàm get... - trả về một giá trị. set... - gán giá trị cho một biến. check... - kiểm tra một số thứ và trả về giá trị boolean. display... - hiển thị một số thứ. ... Dĩ nhiên, JavaScript không quy định bạn phải đặt tên như vậy. Bạn chỉ cần đặt tên đúng theo quy tắc phía trên là đủ. Nhưng rõ ràng là nếu bạn đặt tên đúng chuẩn thì đồng nghiệp hoặc chính bản thân bạn khi đọc code sẽ dễ dàng hiểu được ý nghĩa của từng hàm. Sự phát sinh hàm trong chương trình Khi lập trình, thông thường sẽ có hai trường hợp mà bạn nên viết hàm Một đoạn chương trình được lặp đi, lặp lại nhiều lần. Việc gom chúng lại thành một hàm sẽ giúp chương trình ngắn gọn hơn, dễ hiểu hơn. Và khi cần thay đổi, bạn chỉ cần sửa một lần trong nội dung hàm, thay vì phải sửa nhiều chỗ. Bạn cần tách toàn bộ chương trình thành những phần nhỏ hơn. Hay còn gọi là module hoá. Lúc này, bạn có thể xây dựng logic cho toàn bộ chương trình trước khi thật sự định nghĩa nội dung từng hàm. Cách tiếp cận này gọi là "top-down". Với những dự án lớn, mỗi thành viên thường chỉ được làm những module nhỏ trong toàn bộ một project lớn. Sau đó khi các module nhỏ hoàn thành, sẽ có người ghép những module nhỏ đó thành một chương trình hoàn chỉnh. Do đó, việc phân chia chương trình thành những hàm tốt là vô cùng quan trọng. Như thế nào là một hàm tốt? Đây là một câu hỏi rất khó để trả lời. Theo mình, hàm tốt là hàm thỏa mãn một số điều kiện sau Một hàm chỉ thực hiện một chức năng duy nhất Độc lập với các yếu tố bên ngoài biến toàn cục, môi trường thực thi,... Dễ dàng tái sử dụng Tuy nhiên, không phải lúc nào bạn cũng có thể thoả mãn những yêu cầu trên. Hoặc không nhất thiết phải thoả mãn tất cả những yêu cầu trên. Pure function và non-pure function Nhìn chung, có hai loại hàm trong JavaScript là pure function hàm thuần khiết và non-pure function hàm không thuần khiết. Hàm thuần khiết là hàm không phụ thuộc vào yếu tố bên ngoài biến toàn cục, môi trường thực thi,.... Bất cứ khi nào bạn gọi hàm thuần khiết với cùng một đối số thì kết quả trả về luôn giống nhau. Do đó, pure function rất dễ để sử dụng, tái sử dụng hay bảo trì,... Theo mình, hàm thuần khiết là một hàm tốt. Ví dụ hàm thuần khiết function pureFuncnumber, factor { return number * factor; } let ret = pureFunc2, 10; // 20 Bạn thấy rằng, với cùng một giá trị truyền vào là 2 và 10 thì kết quả luôn là 20. Do đó, hàm trên là hàm thuần khiết. Ngược lại với hàm thuần khiết, hàm không thuần khiết là hàm phụ thuộc vào biến toàn cục hay môi trường thực thi. Vì vậy, khi bạn gọi cùng một hàm với cùng một đối số, nhưng kết quả lại có thể khác nhau. let factor = 10; function nonPureFuncnumber { return number * factor; } let ret = nonPureFunc2; // 20 factor = 11; ret = nonPureFunc2; // => 22 Rõ ràng, hàm nonPureFunc không phải là hàm thuần khiết. Vì hàm này phụ thuộc vào biến ngoài hàm là factor. Nghĩa là khi giá trị của biến factor thay đổi, kết quả trả về của hàm cũng thay đổi dù cho cùng giá trị truyền vào là 2. Tổng kết Vậy hàm là gì? Hàm trong JavaScript là một chương trình con giúp thực thi một công việc cụ thể với cú pháp là function functionName[parameter1], [parameter2],... { statement1; statement2; ... } Trong đó Tham số truyền vào hàm được sao chép vào biến cục bộ bên trong hàm. Trường hợp không truyền giá trị vào thì giá trị của tham số là undefined. Bạn có thể sử dụng toán tử = để khai báo giá trị mặc định cho tham số trong hàm. Biến cục bộ khai báo bên trong hàm chỉ dùng được ở thân hàm. Code bên ngoài không thể truy cập vào biến cục bộ trong hàm. Hàm có thể đọc và cập nhật giá trị của biến ngoài hàm. Nhưng khi bên trong hàm có khai báo một biến cùng tên với biến ngoài hàm thì biến ngoài hàm bị "bỏ qua". Hàm có thể trả về giá trị bằng cách dùng từ khóa return. Có thể có nhiều từ khóa return trong thân hàm. Khi gặp từ khóa return, hàm sẽ dừng lại ngay lập tức và trả về giá trị sau return. Nếu không có giá trị, biểu thức,... nào sau return, hoặc không có từ khóa return thì giá trị trả về của hàm là undefined. Quy tắc đặt tên hàm cũng giống quy tắc đặt tên biến và hằng. Và tên hàm nên bắt đầu bằng một động từ. Nên ưu tiên viết hàm thuần khiết để dễ dàng tái sử dụng, dễ dàng kiểm thử và tránh lỗi. Thực hành Bài 1 Viết hàm trả về giá trị nhỏ nhất của hai số giả sử giá trị truyền nào luôn là số. Xem đáp án function mina, b { return a < b ? a b; } min2, 5; // 2 min4, -1; // -1 min3, 3; // 3 Trường hợp hai số truyền vào bằng nhau thì dĩ nhiên kết quả là giá trị của hai số đó. Bài 2 Viết hàm kiểm tra xem một số có phải là số nguyên tố hay không. Nếu là số nguyên tố thì trả về true. Ngược lại, trả về false. Xem đáp án function isPrimenumber { if isNaNnumber return false; if number < 2 return false; if number === 2 return true; for i = 2; i * i <= number; i++ { if number % i === 0 return false; } return true; } // Ví dụ isPrime"abc"; // false isPrime0; // false isPrime2; // true isPrime5; // true isPrime6; // false Trong đó, hàm isNaNnumber dùng để kiểm tra giá trị của biến number xem có phải là NaN hay không. Nói cách khác, nếu isNaNnumber trả về false thì giá trị của number là số. Các hàm Function là một trong những nền tảng cơ bản trong Javascript. Vậy bạn đã nắm hết những kiến thức về Function trong Javascript chưa? FunctionHàm là gì? Function hàm, chức năng, gọi chung là subprogram chương trình con có thể được gọi ở bên ngoài hoặc bên trong chính nó. Nó bao gồm tập hợp các câu lệnh gọi là function body. Các giá trị có thể truyền đến một hàm, và một hàm có thể trả về giá trị. Bây giờ, với các ứng dụng hiện đại, các function có thể là một chương trình hoàn chỉnh, chứ không phải là khái niệm tổng quát như ''subprogram" nữa. Có sự khác nhau giữa function và procedure thủ tục rằng sự lý tưởng của function nên trả về một giá trị còn procedure thì không bây giờ điều này có thể thay đổi theo ngôn ngữ lập trình. 1. Khai báo hàm Để khai báo hàm, chúng ta dùng từ khóa function, theo sau nó là Tên hàm Danh sách các tham số truyền vào hàm, được đặt trong ngoặc đơn và cách nhau bởi dấu phẩy. Các câu lệnh của JavaScript để tạo ra một hàm, được đặt trong ngoặc nhọn {...}. Ví dụ, để định nghĩa một hàm in ra chữ "Hello World" ở console function sayHello { World"; } 2. Biểu thức hàm Hàm trong biến Trong khi việc khai báo hàm ở trên là một câu lệnh về mặt cú pháp, các hàm cũng có thể tạo ra bằng một biểu thức hàm function expression. Một hàm như vậy có thể nặc danh; nó không cần phải có tên. Ví dụ, hàm sayHello ở trên có thể được khai báo như sau const sayHello = function { World"; } Tuy nhiên, một cái tên có thể được cung cấp trong một biểu thức hàm. Việc cung cấp tên cho phép hàm có thể chạy chính nó, hoặc có thể sử dụng hệ thống debug để nhận dạng hàm trong stack traces. const hello = function sayHello { World"; } 3. Các ràng buộc về tên hàm Javascript cũng giống như các ngôn ngữ khác nó cũng có các ràng buộc về tên hàm sau đây Tên hàm phải được bắt đầu bằng chữ cái a-z,A-Z hoặc ký tự _. Tên hàm không được bắt đầu bằng số, các ký tự khác ký tự _. Các loại hàm 1. Hàm cơ bản Đây là dạng hàm cơ bản nhất trong Javascript, cú pháp có dạng như sau function doSomeThing { // Do Something } Trong đó doSomeThing là tên của hàm bạn muốn đặt và function là từ khóa bắt buộc. Ví dụ Tạo hàm in ra tên website codelearn ở console function getWebsite { } 2. Hàm có tham số truyền vào Đây là một dạng hàm rất hay được sử dụng, cú pháp có dạng như sau function funNameparam_1, ..., pram_n { //code } Trong đó funName là tên của hàm các bạn muốn đặt. param_1,...,pram_n là các tham số mà các bạn muốn truyền vào hàmkhông giới hạn số lượng. VD Tạo hàm tính tổng 2 số function getSuma, b { " + a + b; } 3. Hàm có tham số mặc định Đây thực ra là dạng hàm có truyền tham số và đồng thời xét luôn giá trị mặc định cho các tham số đó. Cú pháp function funNameparam_1 = value_1, ..., pram_n = value_2 { //code } Trong đó funName là tên của hàm các bạn muốn đặt. param_1,...,pram_n là các tham số mà các bạn muốn truyền vào hàmkhông giới hạn số lượng. value_1,...,value_n là các giá trị tương ứng với các pram. VD với hàm getSum ở trên mình sẽ xét tham số mặc định cho nó. function getSuma = 5, b = 10 { " + a + b; } 4. Hàm có và không trả về giá trị Trong javascript có hai loại hàm,đó là hàm có giá trị trả về và hàm không có giá trị trả về. Đối với hàm có giá trị trả về thì phải sử dụng từ khóa return Và ngược lại đối với hàm không có giá trị trả về thì không có từ khóa return VD khai báo hàm getSum ở trên là hàm có giá trị trả về. function getSuma, b { return a + b; } Gọi hàm Việc định nghĩa một hàm sẽ không thực thi nó. Định nghĩa một hàm đơn giản chỉ là đặt tên cho hàm và chỉ định những việc cụ thể sẽ làm khi hàm đó được gọi. Ví dụ, nếu bạn định nghĩa hàm sayHello, bạn có thể gọi nó như sau function sayHello { World"; } sayHello; // Gọi hàm Câu lệnh trên gọi hàm sayHello, kết quả trả về chữ "Hello World" tại console. Các hàm phải đặt trong phạm vi in scope khi nó được gọi, nhưng việc khai báo hàm có thể được hoisted câu lệnh khai báo hàm xuất hiện bên dưới dòng gọi hàm trong đoạn code, như ví dụ này /* ... */ function getAreaOfSquaren { return n*n; } Phạm vi scope của một hàm là khoảng không gian bên trong hàm mà nó được khai báo hoặc là cả chương trình, nếu nó được khai bảo ở top level, tức là nó không nằm trong hàm nào khác. Lưu ý Điều này chỉ đúng khi định nghĩa một hàm bằng cách sử dụng các cú pháp ở trên ví dụ function funcName{}. Điều này có nghĩa rằng function hoisting chỉ hoạt động với cách khai báo hàm thông thường function declarations - function hoisting không hoạt động đối với hàm được khai báo bằng biểu thức hàm function expression. Ví dụ, đoạn code dưới đây sẽ không hoạt động // ReferenceError getAreaOfSquare is not defined // ReferenceError getAreaOfSquare is not defined getAreaOfSquare = function n { return n * n; } Một hàm có thể gọi chính nó Ví dụ, đây là một hàm tính giai thừa đệ quy function factorialn{ if n == 0 n == 1 return 1; else return n * factorialn - 1; } Bạn có thể tính giai thừa của 1 tới 3 như sau var a, b, c; a = factorial1; // a gets the value 1 b = factorial2; // b gets the value 2 c = factorial3; // c gets the value 6 Có những cách khác để gọi hàm. Có nhiều trường hợp mà tại đó một hàm cần phải được gọi một cách tự động, hoặc làm thay đổi số lượng đối số truyền vào một hàm, hoặc trong trường hợp mà việc gọi hàm cần được gắn với một object nhất định được quyết định tại thời điểm runtime. Điều đó lại hóa ra là các hàm tự bản thân chúng là các object, và kết quả là, những object này có các phương thức. Một trong số chúng, phương thức apply, có thể được dùng để đạt được mục tiêu này. Phạm vi của hàm Function Scope Các biến được định nghĩa bên trong một hàm không thể được truy cập từ nơi nào khác bên ngoài hàm, bởi vì biến đó được định nghĩa chỉ trong phạm vi của hàm. Tuy nhiên, một hàm có thể truy cập đến mọi biến và mọi hàm khác trong cùng phạm vi mà nó được định nghĩa. Nói cách khác, một hàm được định nghĩa trong phạm vi global có thể truy cập tới tất cả các biến đã được định nghĩa trong phạm vi global. Một hàm được định nghĩa bên trong một hàm khác có thể truy cập đến tất cả biến được định nghĩa bên trong hàm cha của nó, và bất cứ biến nào khác mà hàm cha của nó có quyền truy cập đến. Các bạn có thể tham khảo ví dụ dưới đây // Các biến sau được định nghĩa trong phạm vi global scope var num1 = 20, num2 = 3, name = "Khoa"; // Hàm này được định nghĩa trong phạm vi global scope function multiply { return num1 * num2; } multiply; // Returns 60 // Một ví dụ hàm lồng nhau function getScore { var num1 = 50, num2 = 50; function add { return name + " scored " + num1 + num2; } return add; } getScore; // Returns "Khoa scored 100" Các tham số của Function Kể từ ES6, xuất hiện 2 dạng tham số mới default parameters và rest parameters 1. Default parameters Trong JavaScript, các tham số của function được mặc định là undefined. Tuy nhiên, trong một số trường hợp nó có thể hữu ích để thiết lập một giá trị mặc định khác. Đây chính xác là điều mà default parameters sẽ làm. Khi không có default parameters trước ES6 Trong quá khứ, cách thông thường để thiết lập các giá trị mặc định là kiểm định giá trị của các tham số bên trong body của function và gán giá trị cho nó nếu nó là undefined. Trong ví dụ sau, nếu không có giá trị nào được truyền cho b, giá trị của nó sẽ là undefined khi thực hiện tính toán a*b, và việc gọi hàm multiply sẽ trả về NaN. Tuy nhiên, điều này bị ngăn chặn bởi dòng thứ 2 trong ví dụ này function multiplya, b { b = typeof b !== 'undefined' ? b 1; return a*b; } multiply5; // 5 Khi có default parameters sau ES6 Với default parameters, việc kiểm tra thủ công bên trong body của function không còn cần thiết. Bạn có thể đơn giản chỉ là đặt 1 vào làm giá trị mặc định cho b ngay tại head của function function multiplya, b = 1 { return a*b; } multiply5; // 5 2. Rest parameters Cú pháp rest parameter cho phép chúng ta dùng 1 mảng để đại diện cho số lượng vô hạn các đối số. Trong ví dụ sau, hàm multiply sử dụng rest parameters để thu thập các đối số kể từ đối số hứ hai trở về đến hết. Hàm này sau đó sẽ nhân những đối số này với đối số đầu tiên. function multiplymultiplier, ...theArgs { return => multiplier * x; } var arr = multiply2, 1, 2, 3; // [2, 4, 6] Arrow Function Trong ES6, arrow function là một cú pháp mới dùng để viết các hàm trong JavaScript. Nó giúp tiết kiệm thời gian phát triển và đơn giản hóa phạm vi function function scope. Arrow function - còn được gọi là "fat arrow", là cú pháp được mượn từ CoffeeScript một ngôn ngữ chuyển tiếp, cú pháp này là cách ngắn gọn hơn dùng để viết function. Ở đây sử dụng kí tự =>, trông giống như một mũi tên "béo". Arrow function là một hàm vô danh và nó thay đổi cách this bind đến function. Arrow function làm code của ta trông ngắn gọn hơn, giúp đơn giản hóa function scoping cũng như từ khóa this. Dưới đây là 1 vài ví dụ về việc sử dụng Arrow fucntion trong Javascript 1. Trường hợp có nhiều tham số // param1, param2, paramN => expression // ES5 var multiply = functionx, y { return x * y; }; // ES6 var multiply = x, y => { return x * y }; Ví dụ trên cho cùng một kết quả, tuy nhiên cú pháp với arrow function tốn ít dòng mã hơn. Trong trường hợp chỉ có một biểu thức thì không cần tới dấu ngoặc nhọn Ví dụ trên có thể viết lại như sau var multiply = x, y => x * y ; 2. Trường hợp có 1 tham số Dấu ngoặc đơn là không bắt buộc khi chỉ có 1 tham số. //ES5 var phraseSplitterEs5 = function phraseSplitterphrase { return '; }; //ES6 var phraseSplitterEs6 = phrase => "; Codelearn"; // ["Love", "Codelearn"] 3. Trường hợp không có tham số Dấu ngoặc đơn là bắt buộc khi không có tham số. // ES5 var hello = function sayHello { World"; } // ES6 var hello = => { World"; } hello; // Hello World Closures Closures là một trong những chức năng quyền lực nhất của JavaScript. JavaScript cho phép lồng các function vào nhau, và cấp quyền cho function con, để function con có toàn quyền truy cập vào tất cả các biến và function được định nghĩa bên trong function cha và tất cả biến và function mà function cha được cấp quyền truy cập đến. Tuy nhiên, function cha không có quyền truy cập đến các biến và function được định nghĩa bên trong function con. Điều này tạo nên một dạng bảo mật khép kín cho các biến của function con. Bên cạnh đó, vì function con có quyền truy cập đến scope của function cha, các biến và function được định nghĩa bên trong function cha sẽ vẫn tồn tại dù việc thực thi function cha đã kết thúc, nếu function con xoay sở để tồn tại lâu hơn thời gian sống của function cha. Một closure được tạo ra khi một function con bằng cách nào đó trở nên khả dụng với bất kỳ scope nào bên ngoài function cha. Hãy xem các ví dụ sau đây để hiểu hơn về Closures VD1 function numberGenerator { // Local “free” variable that ends up within the closure var num = 1; function checkNumber { } num++; return checkNumber; } var number = numberGenerator; number; // 2 Trong ví dụ trên, hàm numberGenerator tạo ra một biến local num và checkNumber một hàm in ra num trong console. Hàm checkNumber không có bất kỳ biến local nào trong nó. Tuy nhiên, nó có quyền truy cập vào các biến bên ngoài function, bởi vì numberGenerator là một closure. Do đó, nó có thể sử dụng biến num được khai báo trong numberGenerator để log num trong console sau khi numberGenerator được trả lại. VD2 function sayHello { var say = function { } // Local variable that ends up within the closure var hello = 'Hello, world!'; return say; } var sayHelloClosure = sayHello; sayHelloClosure; // Hello, world!’ Chú ý, biến hello được khai báo sau anonymous function nhưng vẫn có thể truy cập biến hello. Điều này là do biến hello đã được khai báo trong function scope tại thời điểm được tạo ra, làm cho nó có sẵn khi anonymous function được thực thi. Callback Function Callback function có thể được hiểu nôm na như sau callback tức là ta truyền một đoạn code Hàm A này vào một đoạn code khác Hàm B. Tới một thời điểm nào đó, Hàm A sẽ được hàm B gọi lại callback. Javascript là một ngôn ngữ lập trình hướng sự kiện và bất đồng bộ nên callback function đóng vai trò rất quan trọng, bạn sẽ truyền một callback function vào các sự kiện và xử lý bất đồng bộ đó.. Về Callback Function thì mình cũng đã có viết 1 bài riêng để chúng ta cùng tìm hiểu về nó. Các bạn có thể đọc thêm ở đây. Tạm kết Như vậy trong bài viết này, chúng ta đã cùng nhau tìm hiểu những vấn đề cơ bản về Function trong Javascript. Bạn thấy thế nào về JS, hãy đưa ra những ý kiến trong quá trình sử dụng js nhé. Nếu các bạn thấy bài viết hữu ích hãy rate 5* và share cho mọi người tham khảo! Hãy để lại comment để mình có thể hoàn thiện bản thân hơn trong tương lai. Cám ơn các bạn! Trong bài này freetuts sẽ hướng dẫn bạn giải bài tập tính tổng hai số bằng javascript, qua đó bạn có thể tự viết chương trình tính tổng cực kì dễ viết này được đăng tại không được copy dưới mọi hình thức. Bài tập cộng 2 số là cơ bản nhất trong lập trình, bằng cách sử dụng toán tử cộng và kết hợp các hàm khác để tạo ra ứng dụng tính tổng. Tuy nhiên, bài này mình sẽ bổ sung thêm kiến thức nâng cao để những bạn có nền tảng rồi tham khảo nhé. 1. Tính tổng hai số bằng javascript đơn giản Ví dụ 1 Cho hai biến a và b, hãy viết chương trình tính tổng hai số a và b rồi in lên trình duyệt. let a = 20; let b = 30; // Tính tổng let tong = a + b; hai số là " + tong; Ví dụ 2 Cho hai ô input textbox và 1 input button. Hãy viết chương trình khi click vào button thì tính tổng hai số ở hai ô viết này được đăng tại [free tuts .net] function sum{ let a = Number let b = Number let sum = parseInta + b; = sum; } Trong ví dụ này thì mình sử dụng hàm Number để ép kiểu string sang kiểu number. Ví dụ 3 Tính tổng hai số trong object javascript Giả sử mình có một object như sau let numbers = { number1 20, number2 30 }; Để tính tổng hai số number1 và number2 thì ta làm như sau let numbers = { number1 20, number2 30 }; let sum = + // 50 2. Kiểm tra dữ liệu trước khi tính tổng bằng javascript Khi lấy dữ liệu từ người dùng thì bạn phải kiểm tra định dạng dữ liệu trước rồi mới tính toán sau. Bước này giúp chương trình không bị lỗi và đảm bảo ứng dụng không bị dừng đột ngột. Đối với bài tập tính tổng hai số trong js này thì ta chỉ cần chắc chắn rằng hai số mà người dùng nhập vào là number. Vì vậy, bạn chỉ cần áp dụng kỹ thuật ép kiểu dữ liệu trong javascript và lệnh if else là có thể xử lý được. function sum{ let a = let b = // Kiểm tra dữ liệu if a == "" b == ""{ alert"Vui lòng nhập vào hai số"; return false; } // Ép kiểu dữ liệu a = Numbera; b = Numberb; if isNaNa isNaNb{ alert"Bạn phải nhập vào hai số"; return false; } let sum = parseInta + b; = sum; } 3. Viết hàm cộng hai số bằng javascript Để cho bài toán đơn giản hơn thì ta sẽ viết một hàm cộng hai số. Mình sẽ viết nhiều hàm, từ đơn giản đến phức tạp để các bạn dễ hiểu hơn. Hàm 1 Không validate dữ liệu. function suma, b{ return a + b; } // Hoặc dùng arrow function let sum = a, b => { return a + b; }; Hàm 2 Có validate dữ liệu function suma, b{ a = Numbera; b = Numberb; if isNaNa isNaNb{ return false; } return a + b; } // Hoặc dùng arrow function let sum = a, b => { a = Numbera; b = Numberb; if isNaNa isNaNb{ return false; } return a + b; }; Hàm 3 Kết hợp try catch javascript để bắt lỗi. function suma, b{ try{ a = Numbera; b = Numberb; if isNaNa isNaNb{ throw new Error'Dữ liệu bạn nhập vào không phải là số'; } return a + b; } catch e{ return false; } } Trên là tất cả những cách cộng hai số trong javascript nói chung và bài tập tính tổng hai số bằng javascript nói riêng. Published May 4th, 2020 715 0 min read mặc dù được hỗ trợ trong những brower hiện đại để Javascript format giá tiền nhưng nếu một lúc nào đó devjs muốn viết cho bản thân mình or cho team một chức năng tương tự thì làm như thế nào? Bài dưới đây sẽ có những phương án rất đơn giản mà hiệu quả Javascript format giá tiền. Javascript format giá tiền với toFixed Ví dụ trở thành 12, Chúng ta có thể làm đơn giản Kiểu tiền tệ trong JavaScript như ví dụ dưới đây. var yourBalance = //returns rounds up //returns //returns pads the decimals Định dạng tiền tệ trong JavaScript Chúng ta có thể làm tương tự khi sử dụng replace, như demo dưới đây. function format1n, currency { return currency + functionc, i, a { return i > 0 && c !== "." && - i % 3 === 0 ? "," + c c; }; } function format2n, currency { return currency + '$1,'; } var numbers = [1, 12, 123, 1234, 12345, 123456, 1234567, for var i = 0; i < i++ { '£ '; } for var i = 0; i < i++ { 'vnd '; } Kết qủa Format 1 £ £ £ £ 1, £ 12, £ 123, £ 1,234, £ 12, Format 2 vnd vnd vnd vnd 1, vnd 12, vnd 123, vnd 1,234, vnd 12, Hàm number_format trong JavaScript Có một chức năng ECMAScript mới hơn được cung cấp bởi Internationalization API const formatter = new { style 'currency', currency 'USD', minimumFractionDigits 2 } // "$1, // "$ // "$1,234,567, All Rights Reserved

hàm tính tiền trong javascript