Tham số hàm JavaScript

Tìm hiểu kiến thức cơ bản về Tham số hàm JavaScript

Một hàm có thể chấp nhận một hoặc nhiều tham số.

const dosomething = () => {
  //do something
}

const dosomethingElse = foo => { //do something }

const dosomethingElseAgain = (foo, bar) => { //do something }

Bắt đầu vớiES6 / ES2015, các hàm có thể có giá trị mặc định cho các tham số:

const dosomething = (foo = 1, bar = 'hey') => {
  //do something
}

Điều này cho phép bạn gọi một hàm mà không cần điền tất cả các tham số:

dosomething(3)
dosomething()

ES2018đã giới thiệu dấu phẩy ở cuối cho các tham số, một tính năng giúp giảm lỗi do thiếu dấu phẩy khi di chuyển xung quanh các tham số (ví dụ: di chuyển cuối cùng ở giữa):

const dosomething = (foo = 1, bar = 'hey',) => {
  //do something
}

dosomething(2, ‘ho!’)

Nó cũng không sao đểgọicác hàm của bạn có dấu phẩy ở cuối sau tham số cuối cùng:

dosomething(2, 'ho!',)

Bạn có thể bao bọc tất cả các đối số của mình trong một mảng và sử dụngnhà điều hành trải rộngkhi gọi hàm:

const dosomething = (foo = 1, bar = 'hey') => {
  //do something
}
const args = [2, 'ho!']
dosomething(...args)

Với nhiều tham số, việc ghi nhớ thứ tự có thể khó khăn. Sử dụng các đối tượng, cấu trúc hủy cho phép giữ các tên tham số:

const dosomething = ({ foo = 1, bar = 'hey' }) => {
  //do something
  console.log(foo) // 2
  console.log(bar) // 'ho!'
}
const args = { foo: 2, bar: 'ho!' }
dosomething(args)

Các chức năng hiện hỗ trợ các tham số mặc định:

const foo = function(index = 0, testing = true) { /* ... */ }
foo()

Giá trị tham số mặc định đã được giới thiệu trong ES2015 và được triển khai rộng rãi trong các trình duyệt hiện đại.

Đây là mộtdoSomethinghàm chấp nhậnparam1.

const doSomething = (param1) => {

}

Chúng tôi có thể thêm một giá trị mặc định choparam1nếu hàm được gọi mà không chỉ định tham số:

const doSomething = (param1 = 'test') => {

}

Điều này cũng hoạt động cho nhiều tham số hơn, tất nhiên:

const doSomething = (param1 = 'test', param2 = 'test2') => {

}

Điều gì sẽ xảy ra nếu bạn có một đối tượng duy nhất với các giá trị tham số trong đó?

Ngày xưa, nếu chúng ta phải chuyển một đối tượng tùy chọn vào một hàm, để có giá trị mặc định của các tùy chọn đó nếu một trong số chúng không được xác định, bạn phải thêm một chút mã bên trong hàm:

const colorize = (options) => {
  if (!options) {
    options = {}
  }

const color = (‘color’ in options) ? options.color : ‘yellow’ … }

Với cấu trúc hủy đối tượng, bạn có thể cung cấp các giá trị mặc định, điều này giúp đơn giản hóa mã rất nhiều:

const colorize = ({ color = 'yellow' }) => {
  ...
}

Nếu không có đối tượng nào được chuyển khi gọicolorize, tương tự, chúng ta có thể gán một đối tượng trống theo mặc định:

const spin = ({ color = 'yellow' } = {}) => {
  ...
}

Tải xuống miễn phí của tôiSổ tay dành cho Người mới bắt đầu JavaScript


Các hướng dẫn js khác: