esnext:最后一个参数后面也允许加逗号了

时间:2022-07-06 09:00:58

https://jeffmo.github.io/es-trailing-function-commas 目前是一个 stage 3 的提案,Chakra 和 JSC 已经实现了,它允许我们在函数定义时的最后一个形参和函数调用时的最后一个实参的尾部加上逗号。

最后一个参数加上逗号有什么优点?

注意:最后一个参数加逗号的优点只在参数分行写时才能体现出来。

优点1:修改代码时不容易出错

假如当前的代码长这样:

function foo(
param1,
param2,
param3
)

而你此时要做的是删除 param3 参数的实现,这时你很有可能把光标定位到 param3 那一行,连续按下 Command+X 和 Command+S 了事(Sublime):

function foo(
param1,
param2,
)

一测试,SyntaxError!恍然大悟,回去再把逗号删掉。

假如是新增一个参数呢,问题也类似,你得留心给上一个参数补上逗号;调整参数的顺序(Sublime 用 Ctrl + Command + ↑↓)也类似。除了形参,函数调用时传入的实参也一个道理。

如果每个参数尾部都已经加上了逗号,那么就不存在上面说的这些问题了。

优点2:对 git/hg blame 更友好

我专门用 git 生成了一个演示用的仓库,里面有一个演示文件 test.js:

esnext:最后一个参数后面也允许加逗号了

我现在想知道 param3 和对应的 arg3 是谁在哪个 commit 里加上去,所以我会执行 git blame test.js:

esnext:最后一个参数后面也允许加逗号了

git blame 告诉我,是小李在 11e537fc 这次 commit 里加的。但当你查看那个 commit 的变更时,就会发现,错了,小李只是在实现 param4 时迫于无奈给 param3 补了个逗号,完整的 git log -p test.js 才能看到真相,真正实现 param3 的是小张,而且同时也能发现,小张在实现 param3 的时候也*改动了 param2 那一行:

esnext:最后一个参数后面也允许加逗号了

如果每一行参数尾部都有逗号,那么开发人员就不需要修改和本次 commit 无关的行,从而就不会污染 git/hg blame。

参数分行写有什么优点?

有些同学就问了:“这提案对我没用啊,我所有的参数都是写在一行里的”。的确,如果你从不把参数分行写,那你压根用不上这个特性。不过,参数分行写的确是有用的:

优点1:能避免行过长

如果参数太多,或者某个实参是个长字符串,那么参数写在一行就会让编辑器出现横向滚动条,既不美观,也不好读。

优点2:对 git/hg blame 更友好

就像前面演示的,如果你所有的参数都写在一行里,你就无法 blame 到每个参数被添加的 commit。有些同学怀疑了?真的有人这么写吗?是真的,我电脑上刚好有个 V8 的仓库,我们用下面的 grep 命令查找一下:

grep -zoPR --include='*.js' 'function \w+\(\n([\s\w]+,(.+)?\n)+[\s\w]+\)'

果然找到了一个:

esnext:最后一个参数后面也允许加逗号了

git blame 一下呢:

esnext:最后一个参数后面也允许加逗号了

每个参数的 commit 都能方便的拿到!这在多人合作的开源项目里很重要。

优点3:避免分支冲突

显而易见,两个分支同时在一行上添加新的参数,必然会产生冲突。

优点4:方便加注释

如果你需要为每个参数添加注释,除了分行写还有什么选择吗?同样在 V8 的仓库里 grep 到了真实案例,是给每个实参加了注释:

esnext:最后一个参数后面也允许加逗号了

上面说的这些对对象字面量和数组字面量也同样适用吧?

对,上面说的加逗号的优点和分行的优点对 {} 和 [] 同样适用,{} 是在 ES5 里支持尾部加逗号的,[] 从诞生时就支持,因为它需要支持稀疏数组,比如 [1,,,]。

JSON 呢?

“什么时候 json 规范能改,不统一掉很难受啊?” 是啊,我也想,但我也不知道什么时候能改。

能进 ES 几?

ES8(2017)还是 ES9(2018)?不要再 care 了,现在是先有实现后进规范,就像 Chrome 的版本号一样,随它涨去吧。目前 Spidermonkey 和 V8 还没开始实现,我已经给 V8 提了需求 https://bugs.chromium.org/p/v8/issues/detail?id=5051

几个语法限制

下面这些都是 SyntaxError:

function foo(,){} // 没参数只有个逗号
function foo(param1,,){} // 连续的两个逗号
function foo(param1,...rest,){} // 剩余参数后面还有逗号,因为剩余参数必须是最后一个参数

esnext:最后一个参数后面也允许加逗号了的更多相关文章

  1. 为什么只有一个元素的tuple要加逗号?

    如果要定义一个空的tuple,可以写成(): >>> t = () >>> t () 但是,要定义一个只有1个元素的tuple,如果你这么定义: >>& ...

  2. php json_decode() 如果想要强制生成PHP关联数组,json_decode()需要加一个参数true

    php json_decode()该函数用于将json文本转换为相应的PHP数据结构.下面是一个例子:$json = '{"foo": 12345}';$obj = json_de ...

  3. 解决父类加载iframe,src参数过大导致加载失败

    原文:解决父类加载iframe,src参数过大导致加载失败 <iframe src="*******.do?param=****" id="leftFrame&qu ...

  4. 预编译那些事#define后面只跟一个&OpenCurlyDoubleQuote;参数”

    一般情况下,源程序中所有的行都参加编译.但是有时希望对其中一部分内容只在满足一定条件才进行编译,也就是对一部分内容指定编译的条件,这就是“条件编译”.有时,希望当满足某条件时对一组语句进行编译,而当条 ...

  5. SDWebImage使用——一个可管理远程图片加载的类库

    SDWebImage使用——一个可管理远程图片加载的类库     SDWebImage使用——一个可管理远程图片加载的类库 SDWebImage托管在github上.https://github.co ...

  6. 一个简单的AMD模块加载器

    一个简单的AMD模块加载器 参考 https://github.com/JsAaron/NodeJs-Demo/tree/master/require PS Aaron大大的比我的完整 PS 这不是一 ...

  7. IE push方法,最后一个参数后面不能跟&quot&semi;&comma;&quot&semi;&comma;否则报语法错误

    var columns = [[]]; columns[0].push( { field: 'ADDNAME', title: '添加人', width: 80, }, { field: 'ADDDT ...

  8. 源码学习:一个express&lpar;&rpar;&period;get方法的加载与调用

    刚刚接触express,它的中间件确实把我搞得头晕.get的回调中要不要加next?不加载还会执行下一个中间件么?给get指定'/'路径是不是所有以'/'开头的访问在没有确切匹配时都能执行?use件又 ...

  9. 为PartialView传递一个参数

    看这篇之前,得先了解这个<在MVC应用程序中动态加载PartialView>http://www.cnblogs.com/insus/p/3547985.html. 因为是从这篇重构而来. ...

随机推荐

  1. 【记录】Install-Package &colon; &OpenCurlyDoubleQuote;Unity”已拥有为&OpenCurlyDoubleQuote;CommonServiceLocator”定义的依赖项。

    在使用 NuGet 安装 Unity 的时候,安装命令:install-package unity. 但是会莫名奇妙的报如下错误: “Unity”已拥有为“CommonServiceLocator”定 ...

  2. Linux系统文件的隐藏属性

    linux系统的文件除了有普通rwx权限外还有一种隐藏权限,例如明明有权限删除某个文件却报错了. 或者仅能为某个文件追加内容而不能减少内容,遇到这种很‘奇怪’的文件,就要怀疑是文件被设置隐藏权限了. ...

  3. CLR via C&num; 混合线程同步构造

    1. 自旋,线程所有权和递归 2. 混合构造 a.ManualResetEventSlim b.SemaphoreSlim c.Monitor d.ReaderWriterLockSlim 3.条件变 ...

  4. BZOJ 2073&colon; &lbrack;POI2004&rsqb;PRZ&lpar; 状压dp &rpar;

    早上这道题没调完就去玩NOI网络同步赛了.... 状压dp , dp( s ) 表示 s 状态下所用的最短时间 , 转移就直接暴力枚举子集 . 可以先预处理出每个状态下的重量和时间的信息 . 复杂度是 ...

  5. windows下npm scripts不能执行的问题

    最近在学webpack为了方便把运行脚本写入package.json文件中,如下: "scripts": { "start": "webpack-de ...

  6. database disk image is malformed

    在Linux上使用yum安装软件的时候报如下错误: database disk image is malformed 根本原因是:yum的缓存出错, 需要清理缓存 使用如下命令来解决这个问题: yum ...

  7. python之路-----前端之css

    本篇内容 CSS 语法 css的四种引入方式 css选择器 css属性操作 Caution! 后台管理布局 css响应式布局 一.CSS语法 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声 ...

  8. HTTPS和HTTP(加密知识)

    什么是HTTPS? 基于安全套接字层的超文本传输协议(HTTP over SSL),一个Netscape开发的Web协议.HTTPS在HTTP应用层的基础上使用安全套接字层(或者升级版传输层安全,Tr ...

  9. Django-Model操作数据库&lpar;增删改查、连表结构)

    一.数据库操作 1.创建model表         基本结构 1 2 3 4 5 6 from django.db import models     class userinfo(models.M ...

  10. 关于Rigidbody,Collider和CharacterController三者之间的关系和用法的总结

    Rigidbody:多用在“物体”上,因为“物体”都是“死”的,他们的运动一般都是靠物理系统.所以对于Rigidbody的移动,不要用Translate(),要用各种“力”, 比如:Rigidbody ...