JS OOP 中的三种继承方法:

很多读者关于js opp的继承比较模糊,本文总结了oop中的三种继承方法,以助于读者进行区分。

<继承使用一个子类继承另一个父类,子类可以自动拥有父类的属性和方法。(继承的两方,发生在两个类之间)>

一、通过object实现继承

1:定义父类
function Parent(){}
2:定义子类
funtion Son(){}
3:通过原型给Object对象添加一个扩展方法。
Object.prototype.customExtend = function(parObj){
for(var i in parObj){
// 通过for-in循环,把父类的所有属性方法,赋值给自己
this[i] = parObj[i];
}
}
4:子类对象调用扩展方法
Son.customExtend(Parent);

         // 1.定义父类
function Person(name,age){
this.name = name;
this.age = age;
this.say = function(){
alert(this.name+":"+this.age);
}
}
// 2.定义子类
function Student(no){
this.no = no;
this.add = function(a,b){
alert(a+b);
}
}
function Programmer(lang){
this.lang = lang;
this.codding = function(){
alert("我爱敲代码!敲代码使我快乐!");
}
}
// 3.通过原型给Object对象添加一个扩展方法。
Object.prototype.customExtend = function(parObj){
for(var i in parObj){
// 通过for-in循环,把父类的所有属性方法,赋值给自己
this[i] = parObj[i];
}
} var p = new Person("小明","18");
var s = new Student("0001");
s.customExtend(p);//现在s继承了p的所有属性和方法。
console.log(s) var pro = new Programmer("JavaScript");
pro.customExtend(p);
console.log(pro)

二、使用call和apply进行继承

首先,了解一下call和apply:通过函数名调用方法,强行将函数中的this指向某个对象;
 call写法: func.call(func的this指向的obj,参数1,参数2...);
 apply写法: func.apply(func的this指向的obj,[参数1,参数2...]);
call与apply的唯一区别:在于接收func函数的参数方式不同。call采用直接写多个参数的方式,而apply采用是一个数组封装所有参数。
② 使用call和apply
1:定义父类
funtion Parent(){}
2:定义子类
function Son(){}
3:在子类中通过call方法或者apply方法去调用父类。
function Son(){
Parent.call(this,....);
}

 function Person(name,age){
this.name = name;
this.age = age;
this.say = function(){
alert("我叫:"+this.name+";今年:"+this.age+"岁");
}
}
function Student(no,stuName,stuAge){ this.no = no;
Person.call(this,stuName,stuAge);
}
var stu = new Student(12,"zhangsan",14);
stu.say(); console.log(stu)

三、使用原型继承

③ 使用原型继承
1:定义父类
function Parent(){}
2:定义子类
function Son(){}
3:把在子类对象的原型对象声明为父类的实例。
Son.prototype = new Parent();

 function Person(name,age){
this.name = name;
this.age = age;
this.say = function(){
alert("我叫:"+this.name+";今年:"+this.age+"岁");
}
}
function Student(no){
this.no = no;
} Student.prototype = new Person("张三",14) var stu = new Student(12); stu.say(); console.log(stu)

希望以上代码能够帮助读者解决继承的问题!

js oop中的三种继承方法的更多相关文章

  1. C++中的三种继承关系

    C++中的三种继承关系 先看类中声明成员时的三种访问权限 public : 可以被任意实体访问 protected : 只允许子类及本类的成员函数访问 private : 只允许本类的成员函数访问 在 ...

  2. SuperDiamond在JAVA项目中的三种应用方法实践总结

    SuperDiamond在JAVA项目中的三种应用方法实践总结 1.直接读取如下: @Test public static void test_simple(){ PropertiesConfigur ...

  3. js中的几种继承方法

    JS作为面向对象的弱类型语言,继承也是其非常强大的特性之一. 继承:子承父业:一个原本没有某些方法或属性的对象,统一写方法,拿到了另外一个对象的属性和方法 下面是js中的几种继承方式 1.改变this ...

  4. JavaScript 继承——三种继承方法及其优劣

    原文地址   本文内容 目的 继承的第一步--最简单的继承 私有变量/成员和原型 三种继承方式及其优劣 基本的原型继承 Yahoo JavaScript 模块模式 创建闭包的构造函数 三种方法的代码执 ...

  5. C++中的三种继承public,protected,private

    ( c++默认class是private继承且class内的成员默认都是private struct 默认位public 继承,struct内成员默认是public  ) 三种访问权限 public: ...

  6. java数组中的三种排序方法中的冒泡排序方法

    我记得我大学学java的时候,怎么就是搞不明白这三种排序方法,也一直不会,现在我有发过来学习下这三种方法并记录下来. 首先说说冒泡排序方法:冒泡排序方法就是把数组中的每一个元素进行比较,如果第i个元素 ...

  7. C++中的三种继承方式

    1,被忽略的细节: 1,冒号( :)表示继承关系,Parent 表示被继承的类,public 的意义是什么? class Parent { }; class Child : public Parent ...

  8. Python中class的三种继承方法

    class parent(object): def implicit(self): print("Parent implicit()") def override(self): p ...

  9. [转]C++中的三种继承public,protected,private

    链接:http://www.cnblogs.com/BeyondAnyTime/archive/2012/05/23/2514964.html

随机推荐

  1. .net生成条形码

    1..net 标准库(.net standard 2.0) Nuget添加引用:ZXing.Net生成条形码,ZXing.Net.Bindings.ImageSharp生成图片 public stat ...

  2. Java并发编程读书笔记(一)

    ----------------------------------------------<Java并发编程实战>读书笔记-------------------------------- ...

  3. cpu缓存java性能问题初探

    在内存与cpu寄存器之间,还有一块区域叫做cpu高速缓存,即我们常常说的cache. cache分为L1.L2.L3三级缓存,速度递减,离cpu越来越远,L1.L2每个内核自己都有,L3是每个插槽上的 ...

  4. ip addr 相关操作

    1.添加ip: ip addr add 1.1.1.100/255.255.255.0 dev eth0 2.删除ip: ip addr del 1.1.1.100/255.255.255.0 dev ...

  5. 在linux下搭建python+django环境

    下载python3,进行编译安装,运行django程序 在 /opt目录中安装 cd /opt 1.解决python编译安装所需的软件依赖 yum install gcc patch libffi-d ...

  6. Notification通知栏的使用

    一.基础的知识了解 1.pendingIntent : 它是Intent的封装,可以跳转某个Activity.给Service发送一个命令.还可以发送一个广播 2.进度条的使用方法 3.更新通知栏的信 ...

  7. setInterval传递参数

    参照:https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout 平时我们使用定时器的时 ...

  8. webpack快速入门——CSS中的图片处理

    1.首先在网上随便找一张图片,在src下新建images文件夹,将图片放在文件夹内 2.在index.html中写入代码:<div id="pic"></div& ...

  9. [JavaScript] 获取数组中相同元素的个数

    /** * 获取数组中相同元素的个数 * @param val 相同的元素 * @param arr 传入数组 */ function getSameNum(val,arr){ processArr ...

  10. 奇怪的Java题:为什么1000 == 1000返回为False,而100 == 100会返回为True?

    如果你运行如下代码: 1 2 3 4 Integer a = 1000, b = 1000;  System.out.println(a == b);//1 Integer c = 100, d =  ...