Javascript中的默认参数详解


Posted in Javascript onOctober 22, 2014

一些语言——像Ruby,CoffeeScript及即将到来的javascript版本——在定义一个函数的时候,可以声明默认参数,像下面这样:

function myFunc(param1, param2 = "second string") {

    console.log(param1, param2);

}
// Outputs: "first string" and "second string"

myFunc("first string");
// Outputs: "first string" and "second string version 2"

myFunc("first string", "second string version 2");

不幸的是,在当前的javascript版本,这种写法的无效的。因此,我们能做些什么来实现这种方式,使用我们现有的工具集?

最简单的解决方式像这样:

function myFunc(param1, param2) {

    if (param2 === undefined) {

        param2 = "second string";

    }
    console.log(param1, param2);

}
// Outputs: "first string" and "second string version 2"

myFunc("first string", "second string version 2");

事实是一个被省略的参数在访问时总是“undefined”。如果你只有一个参数,这是一个好的解决方式,当时如果有多个呢?

如果你多于一个参数,你可以使用一个对象作为参数,这样有一个优点是每个参数都有一个明确的命名。如果你传递一个对象参数,你可以使用相同的方式声明默认值。

function myFunc(paramObject) {

    var defaultParams = {

        param1: "first string",

        param2: "second string",

        param3: "third string"

    };
    var finalParams = defaultParams;
    // We iterate over each property of the paramObject

    for (var key in paramObject) {

        // If the current property wasn't inherited, proceed

        if (paramObject.hasOwnProperty(key)) {

            // If the current property is defined,

            // add it to finalParams

            if (paramObject[key] !== undefined) {

                finalParams[key] = paramObject[key];

            }

        }

    }
    console.log(finalParams.param1,

                finalParams.param2,

                finalParams.param3);

}

myFunc({param1: "My own string"});

这是一个有点笨拙,如果你使用这种方式的地方很多,可以写个封装函数,幸运的是,现在好多库中带了相关方法,比如jQuery和Underscore中的extend方法。

下面使用Underscore的extend方法来实现上面相同的结果:

function myFunc(paramObject) {

    var defaultParams = {

        param1: "first string",

        param2: "second string",

        param3: "third string"

    };
    var finalParams = _.extend(defaultParams, paramObject);
    console.log(finalParams.param1,

                finalParams.param2,

                finalParams.param3);

}
// Outputs:

// "My own string" and "second string" and "third string"

myFunc({param1: "My own string"});

这就是你如何能得到默认参数,在当前的javascript版本中。

文中不妥之处欢迎批评指正。

Javascript 相关文章推荐
javascript 动态修改样式和层叠样式表代码
Apr 27 Javascript
javascript 基础篇4 window对象,DOM
Mar 14 Javascript
js获取URL的参数的方法(getQueryString)示例
Sep 29 Javascript
Jquery实现侧边栏跟随滚动条固定(兼容IE6)
Apr 02 Javascript
jQuery中animate用法实例分析
Mar 09 Javascript
AngularJS快速入门
Apr 02 Javascript
纯js实现无限空间大小的本地存储
Jun 18 Javascript
js实现仿爱微网两级导航菜单效果代码
Aug 31 Javascript
jQuery 1.9.1源码分析系列(十五)之动画处理
Dec 03 Javascript
vue项目实现github在线预览功能
Jun 20 Javascript
javascript中数组的常用算法深入分析
Mar 12 Javascript
javascript实现放大镜功能
Dec 09 Javascript
js style动态设置table高度
Oct 21 #Javascript
js读写json文件实例代码
Oct 21 #Javascript
一个JavaScript防止表单重复提交的实例
Oct 21 #Javascript
javascript Deferred和递归次数限制实例
Oct 21 #Javascript
JQuery的Ajax中Post方法传递中文出现乱码的解决方法
Oct 21 #Javascript
jquery中post方法用法实例
Oct 21 #Javascript
js调试工具Console命令详解
Oct 21 #Javascript
You might like
php数组去重实例及分析
2013/11/26 PHP
phpmailer发送邮件之后,返回收件人是否阅读了邮件的方法
2014/07/19 PHP
PHP实现自动识别Restful API的返回内容类型
2015/02/07 PHP
PHP中把错误日志保存在系统日志中(Windows系统)
2015/06/23 PHP
PHP中OpenSSL加密问题整理
2017/12/14 PHP
PHP实现抽奖功能实例代码
2020/06/30 PHP
Sample script that deletes a SQL Server database
2007/06/16 Javascript
js小技巧--自动隐藏红叉叉
2007/08/13 Javascript
jquery 插件开发方法小结
2009/10/23 Javascript
写入cookie的JavaScript代码库 cookieLibrary.js
2009/10/24 Javascript
editable.js 基于jquery的表格的编辑插件
2011/10/24 Javascript
jQuery学习笔记之 Ajax操作篇(二) - 数据传递
2014/06/23 Javascript
JSON格式的键盘编码对照表
2015/01/29 Javascript
JS函数的几种定义方式分析
2015/12/17 Javascript
通过V8源码看一个关于JS数组排序的诡异问题
2017/08/14 Javascript
Bootstrap Tooltip显示换行和左对齐的解决方案
2017/10/11 Javascript
vue2.0 自定义 饼状图 (Echarts)组件的方法
2018/03/02 Javascript
在Vue项目中取消ESLint代码检测的步骤讲解
2019/01/27 Javascript
深入浅析ng-bootstrap 组件集中 tabset 组件的实现分析
2019/07/19 Javascript
vue 使用rules对表单字段进行校验的步骤
2020/12/25 Vue.js
[36:54]Mineski vs Winstrike 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
深入理解Python中的*重复运算符
2017/10/28 Python
将字典转换为DataFrame并进行频次统计的方法
2018/04/08 Python
Python实现修改IE注册表功能示例
2018/05/10 Python
python实现画一颗树和一片森林
2018/06/25 Python
Django JWT Token RestfulAPI用户认证详解
2019/01/23 Python
AmazeUI底部导航栏与分享按钮的示例代码
2020/08/18 HTML / CSS
Roxy美国官网:澳大利亚冲浪、滑雪健身品牌
2016/07/30 全球购物
美国优质马术服装购买网站:Breeches.com
2019/12/16 全球购物
护理专业本科生自荐信
2013/10/01 职场文书
搞笑爱情保证书
2014/04/29 职场文书
运动会横幅标语
2014/06/17 职场文书
党员教师群众路线个人整改措施
2014/10/28 职场文书
2014年学习部工作总结
2014/11/12 职场文书
检察院起诉意见书
2015/05/20 职场文书
2016年“11.11”光棍节活动总结
2016/04/05 职场文书