第一个参数是第一个控制点的x坐标
第二个参数是第一个点的y坐标
第三个参数是第二个控制点的x坐标
第四个参数是第二个控制点的y坐标
第五个参数是结束点的x坐标
第六个参数是结束点的y坐标
写成伪代码就是：

bezierCurveTo(cp1x,cp1y,cp2x,cp2y,x,y);

可能这样看着没什么，但是当组合了多个路径，或者嵌套了好几次之后，结果就炫了。你可以用这些方法在Canvas上画出任何疯狂的东西出来。

你可能想要一个可以让你的Adobe Illustrator图变成canvas代码的东西，如果有非常棒，可以节省很多时间了。

绘画状态
在上一讲中，我们提到了如何更改填充和边框的样式。需要注意的一点是，如果你想要原来的笔画的粗细和颜色，那么需要再手动改回来。不过，还有更好的办法，称为绘画状态。

Canvas中的绘画状态是指你可以保存你当前的绘画样式，之后还能再改回来。这是一个稍微有点绕的感觉，但是在理解之后还是能做很多事情的。事实上，会装状态中保存了很多关于canvas的信息，比如转换矩阵，剪辑区域，还有下面这些属性：globalAlpha,globalCompositeOperation, strokeStyle, fillStyle, lineWidth,lineCap, lineJoin, miterLimit, shadowOffsetX, shadowOffsetY,shadowBlur, shadowColor, font, textAlign, 以及textBaseline。可能很多属性都还没用过，RockUX会在后面的文章中讲到。

保存绘画状态
使用绘画状态很简单，但是理解上还得花点时间。将上一节的代码替换如下：

ctx.fillStyle = "rgb(0,0,255)";
ctx.save();
ctx.fillRect(50,50,100,100);

要保存绘画状态，只需要调用这么一句就行了，很简单吧。

当你把当前的样式改为蓝色的时候，然后调用save方法，就会把当前的样式存入栈中。一般，绘画状态的栈是空的。

需要理解的是，栈就跟你桌子上的一沓文件一样，第一个入栈的就好像最底下的文件，后入栈的在最上面。如果你想获得最下面的文件，就得先拿掉上面的文件。可以理解为先进后出，或者后进先出。

恢复绘画状态
保存绘画状态很简单，但是保存了我们总还是要取出来的吧。你可以使用restore方法。

加上下面的代码：

ctx.fillStyle = "rgb(255,0,0)";
ctx.fillRect(200,50,100,100);

然后就会画出来另一个矩形，只不过颜色不同（这次是红色）：

画完了红色的矩形，你又想画蓝色的了怎么办呢？可以手动设置成蓝色，不过这样太无聊了一点，我们试试这个方法吧：

ctx.restore()
ctx.fillRect(350, 50, 100, 100);

这会画出来另外一个蓝色的矩形：

很简单吧，调用restore方法之后，就会移除后来加入进去的样式，恢复到你存储时候的样式。这节省了很多时间。好吗，这个例子中没有节省你大量的时间，但是在做变换的时候你就体会到了。

使用多重的drawing state
你现在知道如何在简单的情况下使用恢复绘画状态，那么多重状态的时候怎么办呢？你应该还记得我之前提到的文件，后进，先出，我们看看下面的代码：

ctx.fillStyle = "rgb(0, 0, 255)";
ctx.save();
ctx.fillRect(50, 50, 100, 100);
ctx.fillStyle = "rgb(255, 0, 0)";
ctx.save();
ctx.fillRect(200, 50, 100, 100);
ctx.restore()
ctx.fillRect(350, 50, 100, 100);

虽然这和之前的代码差不多，但是在最后这点还是有很大不同的，我们最后看到的是这样：

如果想恢复最初的蓝色的状态，你需要在调用一次restore命令，所以需要添加：

ctx.restore();
ctx.fillRect(50, 200, 100, 100);

这会从栈里面移除最初添加进去的蓝色的样式，然后应用到canvas上面：

多次使用restore就能节省不少时间了。

总结一下
我们这次讲的不是太多，不过有些概念还是比较复杂的，最好还是自己动手试一试吧。