Heim >Web-Frontend >js-Tutorial >Ein Beispiel für das Festlegen von Standardwerten für JavaScript-Methodenparameter_Grundkenntnisse
Haben Sie jemals eine solche Situation erlebt und eine Funktion ohne Parameter geschrieben?
function showUserInfo(){ alert("你好!我是小明。"); } function showUserInfo(){ alert("你好!我是小明。"); }
Anruf:
showUserInfo(); showUserInfo();
Später stellte ich fest, dass diese Funktion auch an anderen Stellen benötigt wird, aber einige Variablenwerte wurden in der Funktion fest codiert. Fügen Sie einen Parameter hinzu.
function showUserInfo(name){ name=name||"小明"; alert("你好!我是"+name+"。"); } function showUserInfo(name){ name=name||"小明"; alert("你好!我是"+name+"。"); }
Erklärung: name=name||„Xiao Ming“ Dieser Code bedeutet, dass, wenn der Name null ist, er dem Standardwert „Xiao Ming“ entspricht. Sie können auch so schreiben:
function showUserInfo(name){ // name=name||"小明"; if(!name){ name="小明"; } alert("你好!我是"+name+"。"); } function showUserInfo(name){ // name=name||"小明"; if(!name){ name="小明"; } alert("你好!我是"+name+"。"); }
Rufen Sie an:
showUserInfo('小李'); showUserInfo('小李');
Später änderten sich die Bedürfnisse und das Alter musste hinzugefügt werden. Okay, lass es uns ändern:
function showUserInfo(name,age){ name=name||"小明"; age=age||22; alert("你好!我是"+name+",今年"+age+"岁。"); } function showUserInfo(name,age){ name=name||"小明"; age=age||22; alert("你好!我是"+name+",今年"+age+"岁。"); }
Anruf:
showUserInfo('小李');//结果:你好!我是小李,今年22岁。 showUserInfo('小李',19);//结果:你好!我是小李,今年19岁。 showUserInfo(null,19);//结果:你好!我是小明,今年19岁。 showUserInfo('小李');//结果:你好!我是小李,今年22岁。 showUserInfo('小李',19);//结果:你好!我是小李,今年19岁。 showUserInfo(null,19);//结果:你好!我是小明,今年19岁。
Okay, was ist, wenn wir Parameter wie Geburtstag, Telefonnummer, Geschlecht, QQ usw. hinzufügen müssen? Standardwerte einzeln festlegen? Tatsächlich sehe ich viele Leute, die das tun. Schauen wir uns einen einfacheren Weg an. Das heißt, Jquery-Erweiterungen zu verwenden. Schauen wir uns zunächst den Code an:
function showUserInfo(setting){ var defaultSetting={ name:"小明", age:"22", sex:"男", phone:"13888888888", QQ:"12345678", birthday:"1980.12.29" }; $.extend(defaultSetting,settings); var message='姓名:'+defaultSetting.name +',性别:'+defaultSetting.sex +',年龄:'+defaultSetting.age +',电话:'+defaultSetting.phone +',QQ:'+defaultSetting.QQ +',生日:'+defaultSetting.birthday +'。'; alert(message); } function showUserInfo(setting){ var defaultSetting={ name:"小明", age:"22", sex:"男", phone:"13888888888", QQ:"12345678", birthday:"1980.12.29" }; $.extend(defaultSetting,settings); var message='姓名:'+defaultSetting.name +',性别:'+defaultSetting.sex +',年龄:'+defaultSetting.age +',电话:'+defaultSetting.phone +',QQ:'+defaultSetting.QQ +',生日:'+defaultSetting.birthday +'。'; alert(message); }
Erklärung: Die Funktion von $.extend(defaultSetting,settings) besteht darin, die eingehende Einstellungskonfiguration mit defaultSetting zusammenzuführen und die defaultSetting-Konfiguration mit der Konfiguration in der Einstellung zu überschreiben.
Rufen Sie an:
showUserInfo({ name:"小李" }); //结果:姓名:小李,性别:男,年龄:22,电话:13888888888,QQ:12345678,生日:1980.12.29。 showUserInfo({ name:"小红", sex:"女", phone:"13777777777" }); //结果:姓名:小红,性别:女,年龄:22,电话:13777777777,QQ:12345678,生日:1980.12.29。 showUserInfo({ name:"小李" }); //结果:姓名:小李,性别:男,年龄:22,电话:13888888888,QQ:12345678,生日:1980.12.29。 showUserInfo({ name:"小红", sex:"女", phone:"13777777777" }); //结果:姓名:小红,性别:女,年龄:22,电话:13777777777,QQ:12345678,生日:1980.12.29。
Es ist ganz einfach! Auf diese Weise haben Sie keine Angst, selbst wenn es 100 Parameter gibt.
Wann sollten also mehrere Parameter und wann ein solches Parameterobjekt verwendet werden? Ich habe die Erfahrung gemacht, dass je nach tatsächlichem Bedarf das Parameterobjekt nicht verwendet wird, wenn ein oder zwei Parameter verwendet werden können. Wenn es mehr als 3 sind, verwende ich dieses Parameterobjekt.