本文首发微信公众号:前端徐徐。
函数参数的默认值
ES6 允许为函数的参数设置默认值,即直接写在参数定义的后面。
function log(x, y = 'World') { console.log(x, y); } log('Hello') // Hello World log('Hello', 'China') // Hello China log('Hello', '') // Hello
rest参数
ES6 引入 rest 参数(形式为...变量名),用于获取函数的多余参数,这样就不需要使用arguments对象了。rest 参数搭配的变量是一个数组,该变量将多余的参数放入数组中。
function add(...values) { let sum = 0; for (var val of values) { sum += val; } return sum; } add(2, 5, 3) // 10
⚠️注意事项:
- rest 参数之后不能再有其他参数(即只能是最后一个参数),否则会报错。
// 报错 function f(a, ...b, c) {}
- 函数的length属性,不包括 rest 参数。
(function(a) {}).length // 1 (function(...a) {}).length // 0 (function(a, ...b) {}).length // 1
严格模式
ES2016规定只要函数参数使用了默认值、解构赋值、或者扩展运算符,那么函数内部就不能显式设定为严格模式,否则会报错。
// 报错 function doSomething(a, b = a) { 'use strict'; // code } // 报错 const doSomething = function ({a, b}) { 'use strict'; // code }; // 报错 const doSomething = (...a) => { 'use strict'; // code };
name属性
函数的name属性,返回该函数的函数名。这个属性早就被浏览器广泛支持,但是直到 ES6,才将其写入了标准。
⚠️注意事项:
- 如果将一个匿名函数赋值给一个变量,ES5 的name属性,会返回空字符串,而 ES6 的name属性会返回实际的函数名。
var f = function () {}; // ES5 f.name // "" // ES6 f.name // "f"
- 如果将一个具名函数赋值给一个变量,则 ES5 和 ES6 的name属性都返回这个具名函数原本的名字。
const bar = function baz() {}; // ES5 bar.name // "baz" // ES6 bar.name // "baz"
- Function构造函数返回的函数实例,name属性的值为anonymous。
(new Function).name // "anonymous"
- bind返回的函数,name属性值会加上bound前缀。
function foo() {}; foo.bind({}).name // "bound foo" (function(){}).bind({}).name // "bound "
箭头函数
ES6 允许使用“箭头”(=>)定义函数。
var f = v => v; // 等同于 var f = function (v) { return v; };
⚠️注意事项:
- 箭头函数没有自己的this对象。箭头函数体内的this对象,就是定义该函数时所在的作用域指向的对象,而不是使用时所在的作用域指向的对象。
var name = 'window'; var A = { name: 'A', sayHello: () => { console.log(this.name) } } A.sayHello();// window var B = { name: 'B', sayHello: function () { console.log(this.name) } } B.sayHello(); // B
- 不可以当作构造函数,也就是说,不可以对箭头函数使用new命令,否则会抛出一个错误。
- 不可以使用arguments对象,该对象在函数体内不存在。如果要用,可以用 rest 参数代替。
- 不可以使用yield命令,因此箭头函数不能用作 Generator 函数。
尾调用优化
ES6 引入了尾调用优化的概念,当函数的最后一步是调用另一个函数时,可以进行优化,避免额外的函数调用栈的增长。
修改
函数参数尾逗号
ES2017 允许函数的最后一个参数有尾逗号(trailing comma)。
function sampleFn( sample1, sample2, sample3, // 可以在最后一个参数后面加 逗号 ',' ) {}
Function.prototype.toString()
ES2019 对函数实例的toString()方法做出了修改。toString()方法返回函数代码本身,以前会省略注释和空格。
function /* foo comment */ foo () {} foo.toString() // "function /* foo comment */ foo () {}"
catch 命令的参数省略
ES2019 改变了catch语句后面必须携带参数的要求。允许catch语句省略参数。
try { // ... } catch { // 不带参数 // ... }