我有一些简单的代码:
context.drawImage(image, 0, 0);
我想知道是否有可能使用ES6扩展(编辑:扩展语法,而不是“扩展运算符”)功能来消除幻数并使代码更明确:
const TOP_LEFT = [0, 0]
context.drawImage(image, ...[TOP_LEFT]);
是否可以在函数调用中将变量用作多个参数?
答案 0 :(得分:2)
是的-与您的操作完全相同,但是在使用时没有[]
:
context.drawImage(image, ...TOP_LEFT);
实时示例:
function drawImage(image, x, y) {
console.log("image = " + image);
console.log("x = " + x);
console.log("y = " + y);
}
const TOP_LEFT = [0, 0]
drawImage("the image", ...[TOP_LEFT]);
现在,您可能不想在成千上万次迭代的紧密循环中执行此操作,因为在理论上并按规定,...TOP_LEFT
涉及在数组上调用函数以创建迭代器对象,然后重复调用该迭代器上的方法,该方法每次都会创建一个结果对象,并从该结果对象获取属性。但是所有这些都可能需要进行优化,无论如何,我们通常希望避免担心性能,除非/除非存在特定的性能问题要解决。
您可以通过freezing数组来帮助优化器:
const TOP_LEFT = Object.freeze([0, 0]);
...但是您想测试目标环境以查看它是否真的有用。
旁注:...
不是运算符,也不能。像函数一样,运算符具有单个结果值。传播(和休息)是主要语法,而不是运算符,例如for
语句,函数声明和对象初始化程序。