继承的几种模式

// 继承方式1 ==> 默认的原型继承
function Person() {}
Person.prototype.run = function() {};
var xiaohong = new Person();

// 继承方式2 ==> 置换后的原型继承
function Person() {}
Person.prototype = {
say: function() {}
}
var xiaohong = new Person();

// 继承方式3 ==> 寄生式继承
var obj = { val: 100 };
var newObj = Object.create( obj );

// 继承方式4 ==> 混入继承
function extend( o1, o2 ) {
for( var key in o2 ) {
o1[key] = o2[key];
}
}
var o = { abc: 888 };
var o2 = { aaa: 111, bbb: 222, ccc: 333 };
extend( o, o2 );

// 继承方式5 ==> 对象冒充( 构造函数借用 )
function Person( name, age, sex ) {
this.name = name;
this.age = age;
this.sex = sex;
}

function Student( name, age, sex ) {
this.Person = Person;
this.Person( name, age, sex );
delete this.Person;
}

function Student( name, age, sex ) {
//Person.call( this, name, age, sex );
Person.apply( this, arguments );
}

var xiaohong = new Student(‘小红‘, 16);
console.log( xiaohong );

// 继承方式6 ==> 原型组合继承
function Person( name, age, sex ) {
this.name = name;
this.age = age;
this.sex = sex;
}

Person.prototype = {
run: function() {
console.log(‘人都会跑‘);
}
};

function Student( name, age, sex ) {
Person.apply( this, arguments );
}

// 解决方案1:
// 这样可以,但是不建议,因为一定会给Student添加一些额外的方法,
// 这些方法不应该和Person共享
//Student.prototype = Person.prototype;

// 解决方案2,混入继承,可取,用的也比较多
//extend( Student.prototype, Person.prototype );

// 解决方案3,原型寄生组合式继承
//Student.prototype = Object.create( Person.prototype );

// 解决方案4,
Student.prototype = new Person;

// xiaofang ==> Student.prototype ==> Person.prototype ==> Object.prototype ==> null
var xiaofang = new Student( ‘小芳‘, 17, ‘女‘ );
xiaofang.run();

/*
* 理想的继承解决方案:
* */
function Person( name, age, sex ) {
this.name = name;
this.age = age;
this.sex = sex;
}

Person.prototype = {
run: function() {
console.log(‘人都会跑‘);
}
};

function Student( name, age, sex ) {
Person.apply( this, arguments );
}

// 让学生实例,继承Student.prototype & Person.prototype
Student.prototype = Object.create( Person.prototype );

// 再给Student扩展自己独有的方法
extend( Student.prototype, {

} );

时间: 2024-08-24 14:46:36

继承的几种模式的相关文章

JavaScript 继承的几种模式

1 /** 2 * Created by 2016 on 2016/6/5. 3 */ 4 //1.原型链继承 5 //把子类的原型,定义为超类的实例 通过原型来访问超类的方法和属性 6 function Person(){//超类 7 this.age = 40; 8 this.run = function(){ 9 console.log("Person is running"); 10 } 11 } 12 function Student(){}//子类 13 Student.p

JavaScript继承的几种模式

原型链 让一个类的原型对象指向另一个类的实例 问题1:引用类型会被共享,一个实例对象更改了值会在所有的对象中更新 问题2:创建子类对象时,不能向超类构造函数中传值 借用构造函数 可向超类构造函数传值 问题:无法复用方法 组合继承 使用原型链实现对原型属性和方法的继承,而通过借用构造函数来实现对实例属性的继承. 调用两次超类构造函数 原型式继承 创建一个临时性的构造函数,将传入的对象作为构造函数的原型.返回一个实例.所有返回的实例,共享构造函数中的引用类型 寄生式继承 创建一个用于封装继承的函数.

javascript创建对象的几种模式

虽然Object构造函数或者对象字面量都可以用来创建单个对象,但这些方式有个明显的缺点:使用同一个接口创建很多对象会产生大量的重复代码.为了解决这个问题,人们开始使用工厂模式的一种变体. 1.工厂模式 function createPerson(name, age, job){ var o=new Object(); o.name = name; o.age = age; o.job = job; o.sayName = function(){ alert(this.name); }; retu

玩转JavaScript OOP[4]——实现继承的12种套路

概述 在之前的文章中,我们借助构造函数实现了"类",然后结合原型对象实现了"继承",并了解了JavaScript中原型链的概念. 理解这些内容,有助于我们更深入地进行JavaScript面向对象编程. 由于JavaScript是一门基于对象和原型的弱语言,灵活度非常高,这使得JavaScript有各种套路去实现继承.本篇文章将逐一介绍实现继承的12种套路,它们可以适用于不同的场景,总一种套路适合你. (亲:文章有点长,请点击右侧的「显示文章目录」按钮,以便导航和阅读

浅谈 JS 创建对象的 8 种模式

Objct 模式 工厂模式 构造器模式 通过 Function 对象实现 prototype 模式 构造器与原型方式的混合模式 动态原型模式 混合工厂模式 1.Object 模式 var o1 = {};//字面量的表现形式 var o2 = new Object; var o3 = new Object(); var o4 = new Object(null); var o5 = new Object(undefined); var o6 = Object.create(Object.prot

面向面试编程——javascript继承的6种方法

javascript继承的6种方法 1,原型链继承 2,借用构造函数继承 3,组合继承(原型+借用构造) 4,原型式继承 5,寄生式继承 6,寄生组合式继承 1.原型链继承. <script type="text/javascript"> function Person(name,sex) { this.name=name; this.sex=sex; this.friends=['李四']; this.getName=function(){ alert(this.name

仿今日头条最强顶部导航指示器,支持6种模式-b

项目中经常会用到类似今日头条中顶部的导航指示器,我也经常用一个类似的库PagerSlidingTabStrip,但是有时并不能小伙伴们的所有需求,所以我在这个类的基础上就所有能用到的情况做了一个简单的封装.大家知道做一个功能比较简单,但是封装好几种功能到一个类里面就需要处理的好多逻辑了,所以对于小编这种小白也是花了好久的业余时间才搞完的,希望大家能够多多支持,更希望我的绵薄之力能够帮助大家.源码和Demo已经上传到github了,欢迎大家多多fork和star. github地址:https:/

hadoop学习;自己定义Input/OutputFormat;类引用mapreduce.mapper;三种模式

hadoop切割与读取输入文件的方式被定义在InputFormat接口的一个实现中.TextInputFormat是默认的实现,当你想要一次获取一行内容作为输入数据时又没有确定的键.从TextInputFormat返回的键为每行的字节偏移量,但眼下没看到用过 曾经在mapper中曾使用LongWritable(键)和Text(值),在TextInputFormat中,由于键是字节偏移量.能够是LongWritable类型,而当使用KeyValueTextInputFormat时,第一个分隔符前后

ThinkPHP教程_PHP框架之ThinkPHP(二)【URL路径访问与模块控制器、URL四种模式、PATHINFO的两种模式、模板与控制器之间的关系】

一.URL路径访问与模块控制器 URL 模块(控制器) 动作(方法) 即以上三者之间的关系URL:http://127.0.0.1/projectName/index.php/模块/动作 1.ThinkPHP规定,两点 ·第一.所有的主入口文件默认访问index控制器(模块) ·第二.所有的控制器默认执行index方法(动作) 特别强调一下,以上两点是独立的!也就是说"所有的主入口文件默认访问index控制器,并执行默认执行index方法"是不准确的 那么,http://127.0.0