推荐的方式来扩展Paper.js中的类
有没有推荐的方法来扩展Paper.js中的类？ 特别是，我有兴趣扩展Path
不好意思，如果我的术语不正确，但我很想问问关于这里被问到关于三个纸张的相同问题
根据您对我的答案的初始版本的评论，您正在寻找“扩展”功能（oops，这正是您的意思）进行子类化。 在发送给paper.js邮件列表的电子邮件中，JürgLehni（创建人之一）表示：
至于子类，目前还不支持这个功能。 它可能起作用，它可能不起作用，它可能在大多数情况下起作用，但在极少数情况下很难查明，它可能只需要进行一些更改就可以使其运行良好，但这些可能会出现在许多不同的地方。
例如，每个Item子类都有一个_type属性，它是一个表示其类型的字符串。 有时我们检查而不是使用instanceof，因为它更快，并且到目前为止，例如对于我们假定不存在子类的Path。
并发症是没有paper.Path.Rectangle对象。 有路径，有矩形，但是当您调用new paper.Path.Rectangle()它会使用初始化代码（ createRectangle ）创建一个新的Path ，以创建矩形形状。
所以我们需要延长paper.Path 。 不幸的是，当你调用new paper.Path.Rectangle它会调用createPath ，它总是返回一个Path （不是你的扩展）。 有可能做到这样的事情：
var SuperRectangle = paper.Path.extend({
otherFunc: function() {
console.log('dat');
}
});
...并正确替换/覆盖createRectangle或createPath获取子类的工作。 不幸的是，我一直无法管理它。
我的第一个工作建议是建立一个工厂并将你的函数添加到该工厂的对象中（jsbin在这里）：
var createSuperRectangle = function(arguments){
var superRect = new paper.Path.Rectangle(arguments);
superRect.otherFunc = function(){
console.log('dat');
}
return superRect;
}
var aRect = new Rectangle(20, 30, 10, 15);
var aPath = createSuperRectangle({
rectangle: aRect,
strokeColor: 'black'
});
aPath.otherFunc();
同样，你可以使用工厂只需更改原型为您SuperRectangles，已经增加你的功能到原型对象（而使得其原型的一个从paper.Path.__proto__ ）（jsbin这里）：
var superRectProto = function(){};
var tempRect = new paper.Path.Rectangle();
tempRect.remove();
superRectProto.__proto__ = tempRect.__proto__;
superRectProto.otherFunc = function(){
console.log('dat');
}
delete tempRect;
var createSuperRectangle = function(arguments){
var superRect = new paper.Path.Rectangle(arguments);
superRect.__proto__ = superRectProto;
return superRect;
}
var aRect = new Rectangle(20, 30, 10, 15);
var aPath = createSuperRectangle({
rectangle: aRect,
strokeColor: 'black'
});
aPath.otherFunc();
或者，你可以创建一个封装Path的对象（这里是jsbin）：
var SuperRectangle = function(arguments){
this.theRect = new paper.Path.Rectangle(arguments);
this.otherFunc = function(){
console.log('dat');
}
}
var aRect = new Rectangle(20, 30, 10, 15);
var aPath = new SuperRectangle({
rectangle: aRect,
strokeColor: 'black'
});
aPath.otherFunc();
aPath.theRect.strokeWidth = 5;
不幸的是，然后要访问路径，你必须使用theRect变量。
最初的错误答案如下：
我不认为你的意思是“延长课程”。 在Javascript中，您可以扩展对象以使它们具有更多功能，因此扩展Path“class”将意味着所有Path对象都具有相同的新功能。 这里进一步描述Javascript对象扩展。
如果我错了，而且您确实想要扩展Path，那么您可以使用：
paper.Path.inject({
yourFunctionName: function(anyArgumentsHere) {
// your function here
}
});
但是，我认为你实际上是在讨论创建新的对象，这些新对象的行为与Path对象的行为相似，但功能彼此不同。 如果是这样的话，那么你可能想要使用原型继承来看看关于Javascript的这个答案。 例如，我在这里创建不同的表现，当我问他们两个矩形对象doSomething （jsbin这里）：
var rect1 = new Path.Rectangle({
point: [0, 10],
size: [100, 100],
strokeColor: 'black'
});
rect1.doSomething = function() {
this.fillColor = new Color('red');
};
var rect2 = new Path.Rectangle({
point: [150, 10],
size: [100, 100],
strokeColor: 'black'
});
rect2.doSomething = function() {
this.strokeWidth *= 10;
};
rect1.doSomething();
rect2.doSomething();
几件事。
1）你可以包装原始的paperjs对象，但这是一个非常黑的paperjs操场
function SuperSquare() {
this.square = new Path.Rectangle({
size:50,
fillColor:'red',
onFrame:function(base) {
var w2 = paper.view.element.width / 2;
this.position.x = Math.sin(base.time) * w2 + w2;
}
});
}
SuperSquare.prototype.setFillColor = function(str) {
this.square.fillColor = str;
}
var ss = new SuperSquare();
ss.setFillColor('blue');
2）我可以克隆和创建一个以es6操作的纸张，以便您可以使用extend关键字。
3）我写了一个名为Flavas的应用程序，但它从来没有获得一个跟随，所以我只是留下它。 话虽如此，我最近一直在玩它; 将其升级到es6。 有了它，你可以做你正在谈论的东西。
class Square extends com.flanvas.display.DisplayObject {
constructor(size) {
this.graphics.moveTo(this.x, this.y);
this.graphics.lineTo(this.x + size, this.y);
this.graphics.lineTo(this.x + size, this.y + size);
this.graphics.lineTo(this.x, this.y + size);
}
someMethod(param) {
trace("do something else", param);
}
);
我写了所有这种快速的，所以随时用Q打我。
链接地址: http://www.djcxy.com/p/72951.html