ECMAScript6函数默认参数
作者:hebedich 发布时间:2024-05-13 09:18:24
语言更新时每一个新增的特性都是从千百万开发者需求里提取过来的,规范采用后能减少程序员的痛苦,带来便捷。
我们经常会这么写
function calc(x, y) {
x = x || 0;
y = y || 0;
// to do with x, y
// return x/y
}
简单说就是x,y提供了一个默认值为0,不传时x, y以值0来运算。传了就以实际值计算。
又如定义一个ajax
function ajax(url, async, dataType) {
async = async !== false
dataType = dataType || 'JSON'
// ...
}
自己用原生JS封装的一个简易ajax函数,url必填,async和dataType可选,即不填时默认同步请求和返回JSON格式数据。
再如定义一个矩形类
function Rectangle(width, height) {
this.width = width || 200;
this.height = height || 300;
}
new时不传任何参数,也会创建一个默认宽高为200*300的矩形。
无论是calc,ajax函数还是Rectangle类,我们都需要在函数体内做默认值的处理,如果语言自身处理岂不乐哉? ES6提供了该特性(Default Parameters),以下是用ES6新特性重写的calc,ajax,Rectangle。
function calc(x=0, y=0) {
// ...
console.log(x, y)
}
calc(); // 0 0
calc(1, 4); // 1 4
function ajax(url, async=true, dataType="JSON") {
// ...
console.log(url, async, dataType)
}
ajax('../user.action'); // ../user.action true JSON
ajax('../user.action', false); // ../user.action false JSON
ajax('../user.action', false, 'XML'); // ../user.action false XML
function Rectangle(width=200, height=300) {
this.width = width;
this.height = height;
}
var r1 = new Rectangle(); // 200*300的矩形
var r2 = new Rectangle(100); // 100*300的矩形
var r3 = new Rectangle(100, 500); // 100*500矩形
可以看到,ES6把默认值部分从大括号移到了小括号里,还减少了“||”运算,函数体从此瘦身了。参数默认值嘛,本来就应该在定义参数的地方,这样看起来简洁了不少。O(∩_∩)O
默认参数可以定义在任意位置,比如在中间定义一个
function ajax(url, async=true, success) {
// ...
console.log(url, async, success)
}
定义了一个默认参数async,url和success是必传的,这时需要把中间的参数置为undefined
ajax('../user.action', undefined, function() {
})
注意,不要想当然的把undefined改为null, 即使 null == undefined, 传null后,函数体内的async就是null不是true了。
以下几点需要注意:
1. 定义了默认参数后,函数的length属性会减少,即有几个默认参数不包含在length的计算当中
function calc(x=0, y=0) {
// ...
console.log(x, y)
}
function ajax(url, async=true, dataType="JSON") {
// ...
console.log(url, async, dataType)
}
console.log(calc.length); // 0
console.log(ajax.length); // 1
2. 不能用let和const再次声明默认值,var可以
function ajax(url="../user.action", async=true, success) {
var url = ''; // 允许
let async = 3; // 报错
const success = function(){}; // 报错
}
另外比较有趣的是:默认参数可以不是一个值类型,它可以是一个函数调用
function getCallback() {
return function() {
// return code
}
}
function ajax(url, async, success=getCallback()) {
// ...
console.log(url, async, success)
}
可以看到这里参数success是一个函数调用,调用ajax时如果没有传第三个参数,则会执行getCallback函数,该函数返回一个新函数赋值给success。这是一个很强大的功能,给程序员以很大的想象发挥空间。
例如,利用这个特性可以强制指定某参数必须传,不传就报错
function throwIf() {
throw new Error('少传了参数');
}
function ajax(url=throwIf(), async=true, success) {
return url;
}
ajax(); // Error: 少传了参数
以上所述就是本文的全部内容了,希望大家能够喜欢。
猜你喜欢
- 之前的博客里使用tf读取数据都是每次fetch一条记录,实际上大部分时候需要fetch到一个batch的小批量数据,在tf中这一操作的明显变
- 扩展Code:var blogModule = (function (my) { my.AddPhoto = function (
- 近期因为开发一个新的H5+backbone 项目,验证输入手机号 验证码倒计时功能。#如上图所示 要实现验证码的倒计时的效果首先做页面的布局
- server application error--IIS故障故障现象:Server Application Error The serve
- 有两个结构完全相同的表,由其中一个表插入另一个表中指定条件的数据,报如下错误: 仅当使用了列列表并且 IDENTITY_INSERT 为 O
- 1、什么是混淆矩阵深度学习中,混淆矩阵是ROC曲线绘制的基础,同时它也是衡量分类型模型准确度中最基本,最直观,计算最简单的方法。它可以直观地
- GUID(Global unique identifier)全局唯一标识符,它是由网卡上的标识数字(每个网卡都有唯一的标
- 增强的toggleClass()1.toggleClass也可以和addClass一样,用空格分隔多个class名称了。.toggleCla
- 本文实例讲述了PHP依赖注入原理与用法。分享给大家供大家参考,具体如下:引言依然是来自到喜啦的一道面试题,你知道什么是依赖注入吗?依赖注入(
- 原文地址:30 Days of Mootools 1.2 Tutorials - Day 18 - Classes part IClass(
- 以下为在asp中增加一个sql server2000用户函数,并为建立一个数据库,给他dbo的权限。注意:sql server的验证方式不要
- defineExpose要在变量和方法声明定义之后再使用,否则浏览器的控制台会输出很多警告,并且最终将该页面卡死。[Vue3] define
- 1、什么是数据库连接池就是一个容器持有多个数据库连接,当程序需要操作数据库的时候直接从池中取出连接,使用完之后再还回去,和线程池一个道理。2
- 就MySQL而言,大多数程序员都不太了解其设计背景,因此当他们尝试创建自己的数据库时,会留下很多漏洞。要想为MySQL数据库进行合适的配置,
- 本文实例总结了PHP常用字符串操作函数。分享给大家供大家参考,具体如下:/*常用的字符串输出函数** echo() 输出字符串* print
- Windows 10家庭中文版,Python 3.6.4,stomp.py 4.1.21ActiveMQ支持Python访问,提供了基于ST
- 模板是一个文本,用于分离文档的表现形式和内容。 模板定义了占位符以及各种用于规范文档该如何显示的各部分基本逻辑(模板标签)。 模板通常用于产
- 以下的文章主要介绍的是MySQL 查询缓存的实际应用代码以及查看MySQL 查询缓存的大小 ,碎片整理,清除缓存以及监视MySQL 查询缓存
- 背景今天有人问我 “为什么数据库中有人推荐使用 int 类型来保存 IP 地址?”。现在(2020年)来看这个东西已经有点过时了,一方面是磁
- 呵呵,我之前也写过一个类似的模板替换功能.>> 已实现:>、<、>=、<=、=、==等简单的运算>