cocosCreator的JS脚本的extends如何实现继承的

最近公司中一位新同事，之前没有使用过js/ts和cocos引擎，在使用中存在很多的疑惑，在看官方文档的时候提出js脚本中的extends如何实现继承的，虽然我说了很多但他还是一脸懵逼，没办法只能让他从javaScript语言中去详细了解构造函数、原型模式、以及组合继承。

需要理解：
1、new 的时候会经历哪些步骤。
2、为什么会构造模式和原型模式，以及理解原型对象。
3、借助构造函数模拟继承属性，借助原型链模拟继承方法。
这些内容需要熟悉才能明白下面的内容，建议自行百度或书本学习，这里就不再多说了。

一、javaScript 中的继承方法

我们先使用一下js的继承。

>>>Cat.js
//构造函数
function Cat(name, age) {
	this.name = name;
	this.age = age;
}
//Cat.prototype原型;
Cat.prototype.get_Value = function() {
	console.log("value", this);
}
module.exports = Cat;

>>>Main.js
var Cat = require("./Cat")

var cat = new Cat("Cat", 1);
cat.get_Value();


//现在添加一只波斯猫，继承Cat。
//step1: 创建波斯猫的构造函数;
function Cat_BS (_name, _age) {
	//注释2
	Cat.call(this, _name, _age)
}

//step2: 把Cat里面所有的原型方法都复制过来;
//第一种写法
Cat_BS.prototype = {};
for(var i in Cat.prototype) {
	Cat_BS.prototype[i] = Cat.prototype[i];
}

//第二中写法（大家习惯这种方式）
var obj = function() {};
obj.prototype = Cat.prototype;
Cat_BS.prototype = new obj();
//为什么不直接=new Cat,这样的话会直接将Cat中的属性也继承过来，值类型还好如果是引用类型会出现（同步修改问题）

//可以添加原型方法，如果该xxx修改为get_Value将停止想原型链上搜索
Cat_BS.prototype.xxx = function () {
	console.log('波斯猫添加原型方法')
}

let bsCat = new Cat_BS('bsCat', 2);
bsCat.xxx();       //新添加的原型方法
bsCat.get_Value(); //继承的原型方法

//如果我们想将属性也继承下来的话，
//打开注释2

二、extends如何封装的

理解上面说的继承后，我们可以模拟一下extends的封装原理：

function Class(class_desic) {
	var new_class = function(name, age) {
		if (class_desic.extend) {
			//实现属性的添加
			class_desic.extend.call(this, name, age);
		}
	}

	//更改原型实现原型方法继承
	if (class_desic.extend) {
		var obj = function() {};
		obj.prototype = class_desic.extend.prototype;
		new_class.prototype = new obj();	
	}
	else {
		new_class.prototype = {};	
	}

	//添加成原型方法或属性
	for(var i in class_desic) {
		if (i == "extend") {
			continue;
		}
		new_class.prototype[i] = class_desic[i];
	}


	return new_class;
}

//定义波斯猫继承Cat(extend)
let Cat_BS = Class({
	extend: Cat,

	//自定义方法，添加成原型方法
	add_blood: function() {
		console.log('新增原型方法');
	},
});

var bsCat = new Cat_BS("bsCat", 2);
console.log(bsCat);
bsCat.get_Value();
bsCat.add_blood();

就到这里算了回头看完JS的内容我在将这篇文章推给他。疑问也基本消除了大半了。