相同的jQuery功能，不同的設置

Question

我有兩個相同的jQuery功能，但具有不同的設置。

$(document).ready(function() { 
    $('.menu-link').bigSlide({ 
     'menu': ('#slide'), 
     'side': 'right', 
     'menuWidth': '28.585%' 
    }); 
    $('.menu-link-wide').bigSlide({ 
     'menu': ('#slide'), 
     'side': 'right', 
     'menuWidth': '90%' 
    }); 
}); 

我想這可以寫得更好？

Answer 1

你可以擴展設置。

$(document).ready(function() { 
    var defaults = { 
     menu: '#slide', 
     side: 'right' 
    }; 
    $('.menu-link').bigSlide($.extend({}, defaults, { 
     menuWidth: '28.585%' 
    })); 
    $('.menu-link-wide').bigSlide($.extend({}, defaults, { 
     menuWidth: '90%' 
    })); 
}); 

Answer 2

你可以使用$.extend擴展您的常用參數：

var param = { menu: '#slide', side: 'right' }; 

$('.menu-link').bigSlide($.extend({'menuWidth': '28.585%'}, param)); 

$('.menu-link-wide').bigSlide($.extend({menuWidth: '90%'}, param));