Example: how to set the default value for JavaScript method parameters

This article mainly introduces how to set default values for JavaScript method parameters. Setting the default values for parameters is the basic knowledge in JS getting started, if you need a function, you can see if you have encountered such a situation and have written a function without any parameters.

Function showUserInfo () {alert ("Hello! I'm James. ");} Function showUserInfo () {alert (" Hello! I'm James. ");}

Call:

showUserInfo();showUserInfo(); 

Later, I found that this function is also needed elsewhere, but the variable value is already written to the function. What should I do? Add a parameter.

Function showUserInfo (name) {name = name | "James"; alert ("Hello! I am "+ name + ". ");} Function showUserInfo (name) {name = name |" James "; alert (" Hello! I am "+ name + ". ");}

Note: name = name | "Xiao Ming" indicates that if name is null, it is equal to the default value "Xiao Ming ". You can also write as follows:

Function showUserInfo (name) {// name = name | "Xiao Ming"; if (! Name) {name = "James";} alert ("Hello! I am "+ name + ". ");} Function showUserInfo (name) {// name = name |" James "; if (! Name) {name = "James";} alert ("Hello! I am "+ name + ". ");}

Call:

ShowUserInfo ('lily ');

Later, the demand changed and the age needed to be added. Let's try again:

Function showUserInfo (name, age) {name = name | "Xiao Ming"; age = age | 22; alert ("Hello! I am "+ name +", this year "+ age +" years old. ");} Function showUserInfo (name, age) {name = name |" Xiao Ming "; age = age | 22; alert (" Hello! I am "+ name +", this year "+ age +" years old. ");}

Call:

ShowUserInfo ('lil'); // result: Hello! I'm Xiao Li, 22 years old. ShowUserInfo ('lil', 19); // result: Hello! I'm Xiao Li, 19 years old. ShowUserInfo (null, 19); // result: Hello! I'm James, 19 years old. ShowUserInfo ('lil'); // result: Hello! I'm Xiao Li, 22 years old. ShowUserInfo ('lil', 19); // result: Hello! I'm Xiao Li, 19 years old. ShowUserInfo (null, 19); // result: Hello! I'm James, 19 years old.

Well, what should we do if we need to add parameters such as birthday, phone number, gender, and QQ? Do I set the default values one by one? In fact, I see many people do. Let's look at a simpler method. That is, Jquery extension is used. First look at the Code:

Function showUserInfo (setting) {var defaultSetting = {name: "James", age: "22", sex: "male", phone: "13888888888", QQ: "12345678 ", birthday: "1980.12.29"}; $. extend (defaultSetting, settings); var message = 'name: '+ defaultSetting. name + ', Gender:' + defaultSetting. sex + ', age:' + defaultSetting. age + ', tel:' + defaultSetting. phone + ', QQ:' + defaultSetting. QQ + ', birthday:' + defaultSetting. birthday + '. '; Alert (message) ;}function showUserInfo (setting) {var defaultSetting = {name: "James", age: "22", sex: "male", phone: "13888888888", QQ: "12345678", birthday: "1980.12.29" };$. extend (defaultSetting, settings); var message = 'name: '+ defaultSetting. name + ', Gender:' + defaultSetting. sex + ', age:' + defaultSetting. age + ', tel:' + defaultSetting. phone + ', QQ:' + defaultSetting. QQ + ', birthday:' + defaultSetting. birthday + '. '; Alert (message );}

Note: $. extend (settings ultsetting, settings) is used to merge the passed setting configuration with defaultSetting, and overwrite the defaultSetting configuration with the configuration in setting.

Call:

ShowUserInfo ({name: "Xiao Li"}); // result: name: Xiao Li, Gender: male, age: 22, tel: 13888888888, QQ: 12345678, birthday: 1980.12.29. ShowUserInfo ({name: "Xiaohong", sex: "female", phone: "13777777777"}); // result: name: Xiaohong, Gender: female, age: 22, tel: 13777777777, QQ: 12345678, birthday: 1980.12.29. ShowUserInfo ({name: "Xiao Li"}); // result: name: Xiao Li, Gender: male, age: 22, tel: 13888888888, QQ: 12345678, birthday: 1980.12.29. ShowUserInfo ({name: "Xiaohong", sex: "female", phone: "13777777777"}); // result: name: Xiaohong, Gender: female, age: 22, tel: 13777777777, QQ: 12345678, birthday: 1980.12.29.

Easy! In this way, even if there are 100 parameters, you are not afraid.

So when will multiple parameters be used and when will such parameter objects be used? My experience is that, based on actual needs, if one or two parameters are used, the parameter object will not be used. If there are more than three objects, I will use this parameter object.