JavaScript 设置函数默认参数值的三种常用方法

作者:半夏时间:2026-10-29 16:01:55浏览:377

本文介绍了在JavaScript中为函数设置默认参数值的三种常用方法。第一种利用arguments对象判断参数是否存在;第二种通过逻辑或运算符(||)进行赋值;第三种结合jQuery的extend方法处理多个参数。文章提供了具体的代码示例和调用演示,帮助开发者根据实际需求选择合适方案。

JavaScript设置函数默认参数值的三种常用方法

在JavaScript开发中,经常需要为函数定义默认参数值。以下介绍几种常见的实现方式供参考。第一种方法是利用arguments对象进行判断:


function example(a,b){ 
  var a = arguments[0] ? arguments[0] : 1;//设置参数a的默认值为1 
  var b = arguments[1] ? arguments[1] : 2;//设置参数b的默认值为2 
  return a+b; 
} 

需要注意的是,上述函数也可以改写为不显式声明参数的形式:


function example(){ 
  var a = arguments[0] ? arguments[0] : 1;//设置第一个参数的默认值为1 
  var b = arguments[1] ? arguments[1] : 2;//设置第二个参数的默认值为2 
  return a+b; 
} 

以下是具体的调用示例:


alert( example() ); //输出3 
alert( example(10) ); //输出12 
alert( example(10,20) ); //输出30 
alert( example(null,20) ); //输出20 

第二种方法是利用逻辑或运算符(||)进行赋值:


function example(name,age){ 
  name=name||'貂蝉'; 
  age=age||21; 
  alert('你好!我是'+name+',今年'+age+'岁。'); 
} 

该函数逻辑也可以改写为使用if语句判断的形式:


function example(name,age){ 
  if(!name){name='貂蝉';} 
  if(!age){age=21;} 
  alert('你好!我是'+name+',今年'+age+'岁。'); 
} 

调用示例如下:


example('王五');//输出:你好!我是王五,今年21岁。  
example('王五',30);//输出:你好!我是王五,今年30岁。  
example(null,30);//输出:你好!我是貂蝉,今年30岁。 

第三种方法适用于参数较多的场景,这里借助了jQuery库的扩展功能:


function example(setting){ 
  var defaultSetting={ 
    name:'小红', 
    age:'30', 
    sex:'女', 
    phone:'100866', 
    QQ:'100866', 
    birthday:'1949.10.01' 
  }; 
  $.extend(defaultSetting,settings); 
  var message='姓名:'+defaultSetting.name 
  +',性别:'+defaultSetting.sex 
  +',年龄:'+defaultSetting.age 
  +',电话:'+defaultSetting.phone 
  +',QQ:'+defaultSetting.QQ 
  +',生日:'+defaultSetting.birthday 
  +'。'; 
  alert(message); 
} 

调用示例:


example({ 
  name:'小红', 
  sex:'女', 
  phone:'100866' 
}); 
//输出:姓名:小红,性别:女,年龄:30,电话:100866,QQ:100866。 

以上三种方法各有优劣,建议根据具体业务场景选择最合适的方式。

作者最新文章