坑爹的prototype

我想创建一个自己的卡片类，暂时叫GameCard吧，继承createjs的Container类。

然后我就可以传入cardId，在自定义类里自动把卡片的背景图啊、卡片上的图案啊，addChild上去。

于是我百度了一下"js、继承"，从得到的答案里找了一个最简单的，写成了这样：

createjs.GameCard = GameCard;
createjs.GameCard.prototype = new createjs.Container();

我new 了一个GameCard，放到舞台上去，嗯，没什么问题。于是我又new了一个，坑爹的事情发生了，第一张卡的样子变成和第二张一样了。。。。

我在把卡片添加到舞台之前，console.log了一下两张卡片，确实是3个不同的卡，id也不一样，那怎么长得一样的呢。

我又去看了一下createjs库内部的displayObject的继承是怎么写的，发现它写了一个函数专门用来继承

createjs.promote = function(subclass, prefix) {
	"use strict";

	var subP = subclass.prototype, supP = (Object.getPrototypeOf&&Object.getPrototypeOf(subP))||subP.__proto__;
	if (supP) {
		subP[(prefix+="_") + "constructor"] = supP.constructor; // constructor is not always innumerable
		for (var n in supP) {
			if (subP.hasOwnProperty(n) && (typeof supP[n] == "function")) { subP[prefix + n] = supP[n]; }
		}
	}
	return subclass;
};

看样子它是把superClass的prototype的每一个属性一一赋给subClass。而不是像我那样直接整个赋过去。

查了一下，原来“prototype的属性将会成为使用这个构造函数创建的对象的通用属性”。而我一开始的写法是prototype直接等于一个COntainer对象，导致我新建的Card子类都指向了这个对象，比如说独有的标识id之类的属性，我猜。导致我操作3个card其实都是在操作同一个Container。

我把卡片的底牌去掉，重新跑了一遍，果然，其实我添加了3遍图片素材在同一张卡上，只不过因为每次都添加了底牌，遮住了上一次的素材。

于是我就照着createjs自己的继承写法，修改了我的代码

createjs.extend(GameCard, createjs.Container);
createjs.GameCard = createjs.promote(GameCard, "Container");

终于正常显示3张牌了