ES6学习——新的语法:函数参数Spread

73 篇文章 23 订阅

Spread操作符(...)是比较新的特性,但是在ES6的规范中,没有找到单独的章节对这个操作符进行说明,这个操作符主要用在两种情况下:函数传参和数组生成,这节主要讲解第一种情况。


规范的12.3.6.1中对函数参数列表的解释如下:

ArgumentList : ... AssignmentExpression
1. Let list be an empty List.
2. Let spreadRef be the result of evaluating AssignmentExpression.
3. Let spreadObj be GetValue(spreadRef).
4. Let iterator be GetIterator(spreadObj).
5. ReturnIfAbrupt(iterator).
6. Repeat
    a. Let next be IteratorStep(iterator).
    b. ReturnIfAbrupt(next).
    c. If next is false, return list.
    d. Let nextArg be IteratorValue(next).
    e. ReturnIfAbrupt(nextArg).
    f. Append nextArg as the last element of list.


从上面描述的第四步中可以清晰看到,Spread操作符后面的表达式应该是个iterator,如果不是第五步会报错。iterator是什么,后面具体的章节中在讲。在JS中,数组,字符串本身就是iterator,但是对象不是。


下面开始看示例,代码来了:

Math.max.apply(null,[-1, 5, 11, 3]);//旧写法

Math.max(-1, ...[-1, 5, 11], 3);//Spread操作符
Math.max(...[-1, 5, 11, 3]);

'use strict';
var arr = [];
	
arr = arr.concat([1,2,3]);
	
Array.prototype.push.apply(arr,[4,5,6]);//旧写法
	
console.log(arr);//1,2,3,4,5,6
	
arr.push(7,...[8,9],10);//Spread操作符
console.log(arr);//1,2,3,4,5,6,7,8,9,10

new Date(...[2015, 12, 23])//Spread操作符创建Date

function foo(x,y,z) {
    console.log( x, y, z );
}
foo( ...[1,2,3] ); // 1 2 3
foo(3,...[4,5]);//3 4 5

上面都是数组的例子,下面看个字符串的:

'use strict';
	
var arr = [];
arr.push(..."abc");
console.log(arr);//["a", "b", "c"]


var obj = {
"1":"abc",
"2":"cde"
}
	
arr.push(...obj);//Uncaught TypeError:  is not a function


*以上全部代码在Chrome 47下通过测试
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值