`
conkeyn
  • 浏览: 1505614 次
  • 性别: Icon_minigender_1
  • 来自: 厦门
社区版块
存档分类
最新评论

Javascript的类与子类创建

 
阅读更多

声明父类与子类的示例:

/**
 * Created by Administrator on 2015/12/23.
 */
//声明Rectangle类
function Rectangle(w, h) {
    this.width = w;
    this.height = h;
}
Rectangle.prototype.area = function () {
    return this.width * this.height;
}
//父类定义了toString()方法+
Rectangle.prototype.toString = function(){
    return "[width:" + this.width +",height:"+this.height+"]";
}

//2.1 声明PositionedRectangle子类
function PositionedRectangle(x,y,w,h){
    //通过调用call()或apply()来调用Rectangle的构造方法。
    Rectangle.call(this,w,h);
    this.x=x;
    this.y=y;
}
//2.2 如果我们需要使PositionedRectangle继承Rectangle,那么必需显式的创建PositionedRectangle的prototype属性。
PositionedRectangle.prototype=new Rectangle();

//2.3 删除不需要属性
//delete PositionedRectangle.prototype.width;
//delete PositionedRectangle.prototype.height;

//2.4 然后定义PositionedRectangle的构造函数为PositionedRectangle;
PositionedRectangle.prototype.constructor=PositionedRectangle;

//2.5 定义PositionedRectangle的函数
PositionedRectangle.prototype.contains=function(x,y){
    return (x>this.x && x<this.x+this.width &&y>this.y && y<this.y+this.height);
}

PositionedRectangle.prototype.toString = function(){
    return "("+this.x +","+this.y+")"+Rectangle.prototype.toString.apply(this);
}


// 3.1
function ZPositionedRectangle(z,x,y,width,height){
    this.z =z;
    //调用PositionedRectangle的构造方法,相当于继承于PositionedRectangle类。
    PositionedRectangle.call(this,x,y,width,height);
}
ZPositionedRectangle.prototype = new PositionedRectangle();
ZPositionedRectangle.prototype.constructor=ZPositionedRectangle;

ZPositionedRectangle.prototype.toString = function(){
    return "z:"+this.z+" "+PositionedRectangle.prototype.toString.apply(this);
}

//运行

//var r = new Rectangle(4,3);
var r = new PositionedRectangle(23,44,4,3);
console.log("area:"+r.area());

console.log("rectangle:"+ r.toString());

var r = new ZPositionedRectangle(2,23,44,4,3);
console.log("z rectangle:"+ r.toString());

for(prop in r){
    console.log(prop+":"+ r.hasOwnProperty(prop));
}

r.pi=4;
console.log(r.pi);

 

 d

分享到:
评论

相关推荐

    JavaScript继承

    在JavaScript中继承是一个非常复杂的话题,比其他任何面向对象的语言中的继承都复杂得多。在大多数其他面向对象语言中,继承一个类只需使用一个...本章将讨论在JavaScript中创建子类的各种技术以及它们的适用场合。

    JavaScript详解(第2版)

     8.5.5 创建子类及继承   8.6 应知应会   练习   第9章 JavaScript核心对象   9.1 什么是核心对象   9.2 数组对象   9.2.1 数组的声明及填充   9.2.2 Array对象属性   9.2.3 关联数组   ...

    JavaScript权威指南(第6版)

    9.3 JavaScript中Java式的类继承 9.4 类的扩充 9.5 类和类型 9.6 JavaScript中的面向对象技术 9.7 子类 9.8 ECMAScript 5 中的类 9.9 模块 第10章 正则表达式的模式匹配 10.1 正则表达式的定义 10.2 用于模式匹配的...

    JavaScript权威指南(第6版)中文版pdf+源代码

     9.3 JavaScript中Java式的类继承207  9.4 类的扩充210  9.5 类和类型212  9.6 JavaScript中的面向对象技术217  9.7 子类230  9.8 ECMAScript 5 中的类239  9.9 模块248  第10章 正则表达式的模式匹配253  ...

    JavaScript权威指南(第6版)(附源码)

    9.3 JavaScript中Java式的类继承 9.4 类的扩充 9.5 类和类型 9.6 JavaScript中的面向对象技术 9.7 子类 9.8 ECMAScript 5 中的类 9.9 模块 第10章 正则表达式的模式匹配 10.1 正则表达式的定义 10.2 用于模式匹配的...

    node-createerror:用于创建易于扩展和可子类化JavaScript错误类的帮助器

    节点创建错误用于创建易于扩展和可子类化JavaScript错误类的助手。安装确保已经安装了node.js和npm,然后运行: npm install createerror用法var createError = require('createerror');var MyError = createError({...

    JavaScript高级资料JavaScript代码 素材 笔记 作业资料.zip

    01-创建类和对象.html 02-类中添加方法(1).html 03-类的继承(1).html 04-super关键字调用父类普通函数(1).html 05-子类继承父类方法同时扩展自己方法.html 06-使用类注意事项.html 07-面向对象案例

    JavaScript权威指南(第6版)(中文版)

    9.3 JavaScript中Java式的类继承 9.4 类的扩充 9.5 类和类型 9.6 JavaScript中的面向对象技术 9.7 子类 9.8 ECMAScript 5 中的类 9.9 模块 第10章 正则表达式的模式匹配 10.1 正则表达式的定义 10.2 用于模式匹配的...

    JavaScript权威指南(第6版)中文文字版

    9.3 javascript中java式的类继承 207 9.4 类的扩充 210 9.5 类和类型 212 9.6 javascript中的面向对象技术 217 9.7 子类 230 9.8 ecmascript 5 中的类 239 9.9 模块 248 第10章 正则表达式的模式匹配 253 10.1 正则...

    JavaScript 权威指南(第四版).pdf

     9.3 JavaScript中Java式的类继承207  9.4 类的扩充210  9.5 类和类型212  9.6 JavaScript中的面向对象技术217  9.7 子类230  9.8 ECMAScript 5 中的类239  9.9 模块248  第10章 正则表达式的模式匹配253  ...

    javascript学习笔记.docx

    f) 继承:只是在查询一个属性时自动发生,而不会在写属性时发生,就是说单写一个父类的属性时,JavaScript环境会为对象本身创建一个同名的属性,从此该属性就覆盖了父类中的属性。 12) 创建一个数组可用 new Array()...

    JavaScript继承与聚合实例详解

    本文实例讲述了JavaScript继承与聚合。分享给大家供大家参考,具体如下: 一、继承 第一种方式:类与被继承类直接耦合度高 1. 首先,准备一个可以被继承的类(父类),例如 //创建一个人员类 function Person(name)...

    JavaScript权威指南(第6版)

    9.3 javascript中java式的类继承 207 9.4 类的扩充 210 9.5 类和类型 212 9.6 javascript中的面向对象技术 217 9.7 子类 230 9.8 ecmascript 5 中的类 239 9.9 模块 248 第10章 正则表达式的模式匹配 253 10.1 正则...

    JavaScript权威指南(第六版) 清晰-完整

    9.3 JavaScript中Java式的类继承 9.4 类的扩充 9.5 类和类型 9.6 JavaScript中的面向对象技术 9.7 子类 9.8 ECMAScript 5 中的类 9.9 模块 第10章 正则表达式的模式匹配 10.1 正则表达式的定义 10.2 用于模式匹配的...

    JavaScript权威指南(第6版) 中文版

    9.3 javascript中java式的类继承 207 9.4 类的扩充 210 9.5 类和类型 212 9.6 javascript中的面向对象技术 217 9.7 子类 230 9.8 ecmascript 5 中的类 239 9.9 模块 248 第10章 正则表达式的模式匹配 253 10.1 正则...

    JavaScript中的类与实例实现方法

    本文实例讲述了JavaScript中的类与实例实现方法。分享给大家供大家参考。具体如下: JavaScript 中没有父类, 子类的概念, 也没有class 和 instance 的概念, 全靠 prototype chain来实现继承. 当查找一个对象的属性时...

    【JavaScript源代码】JavaScript中的几种继承方法示例.docx

    JavaScript中的几种继承方法示例  1.原型链继承  原理: 子类原型指向父类实例对象实现原型共享,即Son.prototype = new Father()。 这里先简单介绍下原型 js中每个对象都有一个__proto__属性,这个属性指向的...

    gof-patterns-javascript

    设计模式JavaScript 使用原型和ES6类在JavaScript中实现的23个(GoF)设计模式的集合。模式模式可以分为三个不同的类别。创建模式提供了实例化单个对象或一组相关对象的方法。 -提供一个用于创建相关或相关对象族的...

Global site tag (gtag.js) - Google Analytics