Javascript bỏ qua các tham số tùy chọn

Trong bài viết này, chúng ta sẽ xem cách khai báo các tham số chức năng tùy chọn trong JavaScript. Có hai cách tiếp cận để làm như vậy

  • Sử dụng toán tử logic OR (‘. ’)
  • Sử dụng toán tử gán (“=”). Theo cách tiếp cận này, biến tùy chọn được gán giá trị mặc định trong chính câu lệnh khai báo. Ghi chú. Các tham số tùy chọn phải luôn ở cuối danh sách tham số.  

    JavaScript là một trong những công nghệ cốt lõi của web. Phần lớn các trang web sử dụng nó và tất cả các trình duyệt web hiện đại đều hỗ trợ nó mà không cần plugin. Trong loạt bài này, chúng ta sẽ thảo luận về các mẹo và thủ thuật khác nhau sẽ giúp bạn phát triển JavaScript hàng ngày

    Trong mã hóa JavaScript, bạn thường cần đặt các tham số chức năng tùy chọn. Khi bạn đang sử dụng các hàm JavaScript, có hai loại tham số. tham số bắt buộc và tham số tùy chọn. Trong trường hợp tham số bắt buộc, bạn phải truyền các tham số đó, nếu không JavaScript sẽ báo lỗi. Tuy nhiên, trong trường hợp tham số tùy chọn, nếu bạn không chuyển chúng, chúng sẽ được khởi tạo thành giá trị mặc định

    Hôm nay, chúng ta sẽ thảo luận về các khái niệm cơ bản về tham số chức năng tùy chọn trong JavaScript và cách sử dụng chúng

    Cách sử dụng các tham số chức năng tùy chọn trong ES5 trở về trước

    Trong phần này, chúng ta sẽ thảo luận về một giải pháp hoạt động ngay cả với các trình duyệt cũ hơn. Điều này được sử dụng thường xuyên cho đến thời đại JavaScript ES5, khi không có hỗ trợ tích hợp sẵn để biến các tham số chức năng thành tùy chọn

    Hãy xem qua ví dụ sau để hiểu cách thức hoạt động của nó

    1
    function getFullImagePath(imagePath, imageBaseUrl) {
    
    2
      imageBaseUrl = imageBaseUrl || 'https://code.tutsplus.com/’;
    
    
    3
    
    
    
    4
      var fullImagePath = imageBaseUrl + imagePath;
    
    
    5
    
    
    
    function getFullImagePath(imagePath, imageBaseUrl) {
    
    0
    function getFullImagePath(imagePath, imageBaseUrl) {
    
    1
    function getFullImagePath(imagePath, imageBaseUrl) {
    
    2
    function getFullImagePath(imagePath, imageBaseUrl) {
    
    3

    Trong ví dụ trên, hàm

    3
    2 nhận hai đối số,
    3
    3 và
    3
    4. Chúng tôi muốn đặt tham số thứ hai là tùy chọn, vì vậy bạn có thể bỏ qua việc chuyển tham số nếu muốn sử dụng giá trị tham số mặc định cho tham số đó. Để biến nó thành tùy chọn, chúng tôi đã sử dụng câu lệnh sau

    1
    function getFullImagePath(imagePath, imageBaseUrl) {
    
    5

    Về cơ bản, chúng tôi đang kiểm tra xem biến

    3
    4 có được xác định hay không. Nếu nó được xác định và đánh giá là
    3
    7, thì chúng tôi cho rằng tham số thứ hai có sẵn và chúng tôi sẽ sử dụng nó. Mặt khác, nếu tham số
    3
    4 không được xác định hoặc ước tính thành
    3
    9, chúng tôi sẽ sử dụng giá trị
    
    
    
    0 làm giá trị mặc định của tham số này. Điều quan trọng là các tham số tùy chọn phải luôn xuất hiện ở cuối danh sách tham số

    Lưu ý rằng phương pháp này sẽ không hoạt động đối với các giá trị số vì nó sẽ ghi đè giá trị

    
    
    
    1. Tương tự, nếu bạn muốn có thể chuyển
    
    
    
    1 hoặc
    
    
    
    3 vào hàm của mình, bạn sẽ phải kiểm tra rõ ràng xem tham số có phải là không xác định hay không.  

    1
    function getFullImagePath(imagePath, imageBaseUrl) {
    
    2
    function getFullImagePath(imagePath, imageBaseUrl) {
    
    9
    3
    2
    1_______6_______
    5
    2
    4
    function getFullImagePath(imagePath, imageBaseUrl) {
    
    0
    function getFullImagePath(imagePath, imageBaseUrl) {
    
    3

    Trong trường hợp này, chúng tôi đã kiểm tra rõ ràng xem giá trị của tham số

    3
    4 có phải là
    
    
    
    5 hay không để quyết định xem đó có phải là tham số tùy chọn hay không. Đây là một phương pháp hoàn hảo hơn để quyết định xem tham số có phải là tùy chọn hay không

    Vì vậy, đó là cách bạn có thể tùy chọn tham số chức năng trong các trình duyệt không hỗ trợ phiên bản ES6+. Trong phần tiếp theo, chúng ta sẽ thảo luận về nó trong bối cảnh của các trình duyệt hiện đại

    Cách sử dụng các tham số chức năng tùy chọn trong JavaScript ES6

    Trong phần này, chúng ta sẽ thảo luận về phương pháp mà bạn có thể sử dụng trong các trình duyệt hiện đại hỗ trợ phiên bản ES6 của JavaScript. Hãy xem qua ví dụ sau để hiểu cách thức hoạt động của nó. Chúng tôi sẽ viết lại ví dụ mà chúng tôi đã thảo luận trong phần trước với đối tác ES6 của nó

    1
    2
    8
    2
    2
    1_______4_______
    4
    2
    4
    5
    function getFullImagePath(imagePath, imageBaseUrl) {
    
    3

    Nếu bạn đã làm việc với các ngôn ngữ lập trình khác, cách tiếp cận trên để xác định các tham số chức năng tùy chọn có thể quen thuộc với bạn. Trong trường hợp này, tham số tùy chọn được gán giá trị mặc định trong chính câu lệnh khai báo hàm

    Ngoài ra, bạn có thể có nhiều tham số tùy chọn, như được hiển thị trong đoạn mã sau, miễn là bạn xác định chúng ở cuối danh sách tham số

    1
      imageBaseUrl = imageBaseUrl || 'https://code.tutsplus.com/’;
    
    
    7
    2
      imageBaseUrl = imageBaseUrl || 'https://code.tutsplus.com/’;
    
    
    9
    3
    function getFullImagePath(imagePath, imageBaseUrl) {
    
    3

    Như bạn có thể thấy, cú pháp JavaScript ES6 đơn giản và dễ viết hơn nhiều so với phương thức cũ

    Phần kết luận

    Hôm nay, chúng ta đã thảo luận về cách bạn có thể sử dụng các tham số hàm tùy chọn trong JavaScript, cùng với một số ví dụ thực tế

    Làm cách nào để chuyển tham số tùy chọn trong khi bỏ qua một số tham số tùy chọn khác?

    bạn có thể sử dụng biến tùy chọn theo ? . , ví dụ. chi tiết chức năng (tên. chuỗi, quốc gia = "CA", địa chỉ?. sợi dây,. sở thích. sợi dây) { //. } Ở trên. Tên là bắt buộc.

    Các tham số tùy chọn có phải là thông lệ xấu không?

    Vấn đề với các tham số tùy chọn là, chúng XẤU vì chúng không trực quan - nghĩa là chúng KHÔNG hoạt động theo cách bạn mong đợi. Đây là lý do tại sao. Họ phá vỡ khả năng tương thích ABI. để bạn có thể thay đổi các đối số mặc định tại một nơi.

    Làm cách nào để bỏ qua chức năng trong JavaScript?

    js Phương thức bỏ qua() . Phương thức bỏ qua () được sử dụng để bỏ qua số phần tử đã cho từ bộ sưu tập và trả về các phần tử bộ sưu tập còn lại.

    Làm cách nào để chỉ chuyển tham số thứ hai trong JavaScript?

    kiểm tra hàm (a,b) { //. }; . ,b); . var defaultVar = "cái gì đó"; . } . sau đó thay đổi giá trị defaultVar theo nhu cầu của tôi.