我实际上是在玩Javascript做一个小游戏,我想实现在http://www.crockford.com/javascript/inheritance.html上发现的内容,该内容类似于:
ZParenizor.method('toString', function () { if (this.getValue()) { return this.uber('toString'); } return "-0-"; });
我找不到用于使这种开发成为可能的库的任何参考。有任何想法吗?否则,我正在寻找一个好的库来帮助我的OOP开发。
谢谢
编辑:
我正在寻找Node.js的OOP解决方案/库。请注意,我是Node.js的新手
也许您确实需要一个库,ES5就像地狱一样冗长,所以我创建了pd
我正在寻找Node.js的OOP解决方案/库。
你 并不 需要一个库。您有 ES5 。
JavaScript没有经典的OOP。它具有原型OOP。
这意味着您只有对象。您只能对对象进行扩展,操作和克隆。
操作
var o = {}; o.foo = "bar";
延伸
var o = someObject; Object.defineProperties(o, { "foo": { value: "foo" }, "bar": { value: "bar" } "method": { value: function () { } } }
克隆
var o = someObject; var p = Object.create(o);
克隆并扩展
var o = someObject; var p = Object.create(o, { "foo": { value: "foo" }, "bar": { value: "bar" } "method": { value: function () { } } }
要了解这一点很重要Object.create,Object.defineProperty和Object.defineProperties工作。
Object.create
Object.defineProperty
Object.defineProperties
克隆操作实际上不是克隆。它正在根据蓝图创建一个新对象。蓝图是一个对象。它将蓝图放入了[[Prototype]]。我将用于演示[[Prototype]]的.__proto__财产中的生活。
[[Prototype]]
.__proto__
var o = {}; var p = Object.create(o); p.__proto__ === o; // true var q = Object.create(p); q.__proto__.__proto__ === o; var r = Object.create(q); r.__proto__.__proto__.__proto__ === o;
免责声明: .__proto__已弃用。不要在代码中使用它。它具有用于调试和健全性检查的功能。
这里主要的一点是,从访问属性o中r它必须走3级了原型链,这变得昂贵。为了解决该问题,而不是克隆随机对象,您应该克隆特定的蓝图(每个对象应该有一个蓝图)。
o
r
// Parent blueprint var Parent = (function _Parent() { // create blank object var self = Object.create({}); // object logic return self; }()); // factory function var createParent = function _createParent(foo) { // create a object with a Parent prototype return Object.create(Parent, { foo: { value: foo } }); } var Child = (function _Child() { var self = Object.create(Parent); // other stuff return self; }()); var createChild = function _createChild(bar) { return Object.create(Child, { bar: { value: bar } }) };
这是我正在处理的一些代码的片段,您可以将其用作示例:
var Sketchpad = (function _SketchPad() { var self = Object.create({}); var mousemove = function _mousemove(e) { this.drawLine(e); }; self._init = function _init() { this.$elem.bind({ "mousemove": mousemove.bind(this), }); this.pens = {}; $("#clear").bind("click", this.clear.bind(this)); $("#undo").bind("click", (function _undoPath() { this.pen.undo(); }).bind(this)); return this; }; self.clear = function() { this.paper.clear(); }; return self; }()); createSketch = function _createSketchPad(id, w, h) { var paper = Raphael(id, w, h); var pen = createPen(paper); var o = Object.create(Sketchpad, { paper: { value: paper }, $elem: { value: $("#" + id) }, pen: { get: function() { return pen; }, set: function(v) { pen = v; } } }); return o._init(); };