Hướng dẫn dùng parameter. JavaScript
Nội dung bài viết Trong ECMAScript 2015 hay còn gọi là
ES6, default function parameters đã được giới thiệu trọng ngôn ngữ lập trình JavaScript. Cho phép những developers khởi tạo function có những default value nếu như chúng được định nghĩa sai. Đồng nghĩa với việc, khi sử dụng chức năng này thì giúp những function của chúng ta dễ control và ít error hơn. - Hiểu về ES6 - Hiểu
về cách initialize a function Trong bài viết này, chúng ta sẽ phân biệt được Để phân biệt được arguments và Biến x chính là một Tiếp theo xem thử // Invoke cube function cube(10) //Ouput: 1000 Đi tiếp đoạn code tiếp theo // Assign a number to a variable const number = 10 // Invoke cube function cube(number)
// Invoke the cube function without passing an argument cube() //Output: NaN
Cú pháp Default Parameter trong JavaScriptTrước kia khi chưa được ES6 giới thiệu về Default Parameter thì chúng ta thường check một cách điển hình như thế này, còn ai không check thì kệ nó, và kết thúc bài viết tại đây. Tipjs: Tổng hợp tính năng javascript mới nhất kể từ ES6 đến ES11 // Check for undefined manually function cube(x) { if (typeof x === 'undefined') { x = 5 } return x * x * x } cube() Bạn sử dụng check điều điện trong JavaScript để check nếu // Define a cube function with a default value function cube(x = 5) { return x * x * x } Sử dụng: // Invoke cube function without an argument cube() Ouput: 125: Thậm chí set // Invoke cube function with undefined cube(undefined) Ouput: 125: Đến đây bạn có thể check xem Default Parameter support được bao nhiêu kiểu định dạng: Default Parameter Data Types trong JavaScriptVí dụ : // Create functions with a default value for each data type const defaultNumber = (number = 42) => console.log(number) const defaultString = (string = 'Shark') => console.log(string) const defaultBoolean = (boolean = true) => console.log(boolean) const defaultObject = (object = { id: 7 }) => console.log(object) const defaultArray = (array = [1, 2, 3]) => console.log(array) const defaultNull = (nullValue = null) => console.log(nullValue) // Invoke each function defaultNumber() defaultString() defaultBoolean() defaultObject() defaultArray() defaultNull() //Ouput: 42 "Shark" true {id: 7} (3) [1, 2, 3] null Nhưng chưa hết bạn có nhớ ES6-2019122141422037">Destructuring JavaScript" , điều này cũng có thể làm tương tự với destructuring // Define a settings function with a default object function settings(options = {}) { const { theme, debug } = options // Do something with settings } Sử sụng Multiple Default ParametersĐến đây, tôi nghĩ các bạn cũng đã hiểu hơn rồi, và cùng xem những ví dụ để hiều hơn về set multiple // Define a function to add two values function sum(a = 1, b = 2) { return a + b } sum() //Output: 3 Ngoài ra, giá trị được sử dụng trong một tham số có thể được sử dụng trong mọi tham số mặc định tiếp theo, từ trái sang phải. // Define a function to create a user object using parameters function createUser(name, rank, userObj = { name, rank }) { return userObj } // Create user const user = createUser('Jean-Luc Picard', 'Captain') //Ouput: {name: "Jean-Luc Picard", rank: "Captain"} Đến đây chưa phải là hết mà mới là bắt đầu của bài viết này thôi, quan trọng là phần này Set Default Parameters cho một functionTrong
đoạn mã dưới này, bạn sẽ tạo một hàm để trả về một số ngẫu nhiên, sau đó sử dụng kết quả làm giá trị tham số mặc định trong Ví dụ : // Define a function to return a random number from 1 to 10 function getRandomNumber() { return Math.floor(Math.random() * 10) } // Use the random number function as a default parameter for the cube function function cube(x = getRandomNumber()) { return x * x * x } // sử dụng cube() cube() //Output: 512 64 Kết luậnTrong bài viết này, bạn đã tìm hiểu các tham số chức năng mặc định là gì và cách sử dụng chúng. Bây giờ bạn có thể sử dụng các tham số mặc định để giúp giữ cho các chức năng của bạn tránh bị những Resource: digitalocean.com |