yooocen / dadaLearningBlogs

入职之后所有的学习文档
0 stars 0 forks source link

javascript怎么实现子类继承基类 #14

Open yooocen opened 6 years ago

yooocen commented 6 years ago

在javascript中模拟继承,最关键的就是利用prototype,给一个函数function设置好它的prototype,然后new出一个对象,这个对象的proto里面就会有这个函数的prototype中的所有的属性。

var abstractObjectConstructor = function(){}
abstractObjectConstructor.prototype.field1 = 1;
var obj = new abstractObjectConstructor();
console.log(obj);

如果在new完对象之后,修改这个函数function的prototype的属性的值,对应的这个对象的属性也就也变了,这可以从原型链去理解,因为这个proto中的所有变量都只是这个函数function的原型prototype的一个引用而已。

借助这个原理,我们项目组中怎么模拟实现类的继承呢?(必须也包括对基类的方法的复写)

var son = function(){}
son.prototype = new father()
$.extend(son.prototype,{
     method = function(){//content}
     field = newValue
})

把father这个基类构造函数new出来,相当于把它的全部属性方法取过来,挂在子类的原型上也就是继承方法的意思类,要想复写,可以利用jquery的extend,将同名属性合并,这样就实现这个继承的模拟。

补充:$.extend()

$.extend( [deep ], target, object1 [, objectN ] )

deep : 可选。 Boolean类型 指示是否深度合并对象,默认为false。如果该值为true,且多个对象的某个同名属性也都是对象,则该"属性对象"的属性也将进行合并。

比方说

var result=$.extend( true, {}, 
{ name: "John", location: {city: "Boston",county:"USA"} }, 
{ last: "Resig", location: {state: "MA",county:"China"} } );

结果就是

result={name:"John",last:"Resig", location:{city:"Boston",state:"MA",county:"China"}}

基本都是后面覆盖前面,只是加了true的话,前面的同名属性有不同的key值的话就不会丢失掉,上面的例子就是location.city