《JavaScript应用程序设计》一一2.10 参数命名

简介:

本节书摘来华章计算机出版社《JavaScript应用程序设计》一书中的第2章,第2.10节,作者:Eric Elliott 更多章节内容可以访问云栖社区“华章计算机”公众号查看。

2.10 参数命名

函数被传入的参数数量称为元数 (arity),一般来说函数的元数应该尽可能的精简,但还是避免不了出现极多个元数的调用场景。多元数的问题在于每个参数都必须按照先后顺序被传入,即使个别参数是可选的。要记住这些顺序本身就是一个令人头疼的问题,而且给函数传入无用的参数,对功能本身而言也没有意义。
在下面的示例中,createUser()是一个用于创建用户账户的函数,userProto是用户账户的默认配置,可以用createUser()中传入的参数将之覆盖。

var userProto = {
    name: '',
    email: '',
    alias: '',
    showInSearch: true,
    colorScheme: 'light'
  };

function createUser(name, email, alias, showInSearch, 
  colorScheme) {

  return {
    name: name || userProto.name,
    name: email || userProto.email,
    alias: alias || userProto.alias,
    showInSearch: showInSearch,
    colorScheme: colorScheme || userProto.colorScheme
  };
}

test('User account creation', function () {
  var newUser = createUser('Tonya', '', '', '', 'dark');

  equal(newUser.colorScheme, 'dark',
    'colorScheme stored correctly.');
});

在上述示例中,createUser()函数拥有5个可选参数,而UserProto是一个原型对象,这里存在一个问题,先看函数调用:
var newUser = createUser('Tonya', '', '', '', 'dark');
首先,如果不了解createUser()函数的具体实现,很难知晓每个参数的具体含义。其次,若想设置最后一位参数的值,必须将前面4位参数全部补全。再者,如果这个函数被其他模块依赖,那么后期对其所进行参数调整的成本非常昂贵。
正确的参数传入方式是:

var newUser = createUser({
  name: 'Mike',
  showInSearch: false
});

你可以使用extend()方法来处理这类参数的传入,市面上大部分JavaScript类库中都拥有类似的方法(包括jQuery与Underscore),来看看使用jQuery的版本:

function createUser(options) {
  return $.extend({}, userProto, options);
}

$.extend()将对象作为参数传入,所传入的第一个参数是需要进行扩展的对象。在这个例子中,我们需要在不改变userProto或options值的前提下,创建用户账户对象,所有对象的方法与属性都是通过扩展而来,这是一种简单且优雅的代码复用方式。

相关文章
|
2月前
egg.js 24.18参数验证
egg.js 24.18参数验证
31 0
egg.js 24.18参数验证
|
4月前
|
JavaScript
如何在JS中实现修改URL参数而不刷新页面
如何在JS中实现修改URL参数而不刷新页面
75 1
|
1月前
|
前端开发 JavaScript
【实现js和css互通、共享常量参数值】js如何获取CSS/SCSS/LESS的常量、CSS/SCSS/LESS又是如何获取js的值(或者说js是如何主动推送参数给CSS使用的)?
【实现js和css互通、共享常量参数值】js如何获取CSS/SCSS/LESS的常量、CSS/SCSS/LESS又是如何获取js的值(或者说js是如何主动推送参数给CSS使用的)?
|
2月前
|
JavaScript 前端开发 API
js截取图片地址后面的参数和在路径中截取文件名或后缀名
在处理网页上的图片资源或者其他类型的文件资源时,你可能会遇到需要使用这些技巧的情况。以下是一些具体的使用场景:
22 0
|
14天前
|
JavaScript
如何在JS中实现修改URL参数而不刷新页面
如何在JS中实现修改URL参数而不刷新页面
|
14天前
|
JavaScript 前端开发
【专栏】`Function.prototype.apply` 在JavaScript中用于动态设定函数上下文(`this`)和参数列表
【4月更文挑战第29天】`Function.prototype.apply` 在JavaScript中用于动态设定函数上下文(`this`)和参数列表。它接受两个参数:上下文对象和参数数组。理解`apply`有助于深入JS运行机制。文章分三部分探讨其原理:基本概念和用法、工作原理详解、实际应用与注意事项。在应用中要注意性能、参数类型和兼容性问题。`apply`可用于动态改变上下文、传递参数数组,甚至模拟其他语言的调用方式。通过深入理解`apply`,能提升代码质量和效率。
|
15天前
|
存储 JavaScript 前端开发
每日一道javascript面试题(九)函数的参数可以和函数体中的变量重名吗
每日一道javascript面试题(九)函数的参数可以和函数体中的变量重名吗
|
17天前
|
存储 JavaScript 前端开发
js原生方法,获取url上面所有参数,并返回一个对象
JavaScript函数`getUrlParameters`用于从URL中提取所有参数并返回一个键值对对象。它接收URL,分割查询字符串,解码参数对,并存储在对象中。重复参数键会被存储为数组。
|
24天前
|
JavaScript
js如何实现修改URL参数并不刷新页面
js如何实现修改URL参数并不刷新页面
|
5月前
|
JavaScript
如何在JS中实现修改URL参数而不刷新页面
如何在JS中实现修改URL参数而不刷新页面

热门文章

最新文章