JavaScript中继承的一些示例方法与属性参考

prototype 属性的作用:
利用prototype 属性提供对象的类的一组基本功能。对象的新实例“继承”赋予该对象原型的操作。

prototype 属性的功能:
所有JavaScript 内部对象都有只读的prototype 属性。可以为内部对象的原型添加功能,但该对象不能被赋予不同的原型。
然而,用户定义的对象可以被赋给新的原型。

constructor 属性的作用:
constructor 表示创建对象的函数。

constructor 属性的功能:
constructor 属性是所有具有 prototype 的对象的成员。它们包括除 Global 和 Math 对象以外的所有 JavaScript 内部对象。
constructor 属性保存了对构造特定对象实例的函数的引用。

A 利用prototype 添加对象的属性 [ 方式一]
示例:


代码如下:

<script type="text/javascript">
//方式一
var myObj = function(){
this.study = "JavaScript";
}
myObj.prototype.hobby = function()
{
this.hobby = "See girl";
}
var newObj = new myObj();
for ( var attr in newObj )
{
document.write( attr +"<br/>" );
}
</script>

B 利用prototype 添加对象的属性 [ 方式二]
示例:


代码如下:

<script type="text/javascript">
//方式二
var superObj = { name:"xugang" };
var subObj = { age:20 };
function extend(superObj,subObj){
//获得父对象的原型对象
subObj.getSuper = superObj.prototype;
//将父对象的属性给子对象
for(var i in superObj){
subObj[i] = superObj[i];
}
}
extend(superObj,subObj);
for ( var s in subObj )
{
document.write( s +"<br/>" ); //遍历子对象的属性
}
</script>

C 利用prototype 继承父类的原型属性
示例:


代码如下:

<script>
function Person(_name){
this.name = _name;
}
//创建对象(用于更改 prototype 原型对象)
function addSex(_sex){
this.sex = _sex;
}
//更改原型对象
Person.prototype = new addSex('男');
var p = new Person('xugang');
alert("p 的原型为:" + p.constructor);
//打印所有属性
for(var i in p){
//alert(p[i]);
}

// ================= 继承 =================
//创建子对象 Student
function Student(_study){
this.study = _study;
}
// 通过 prototype 让 Student 继承 Person
Student.prototype = new Person('刘德华');
var stu1 = new Student('JS');
alert("stu1 的原型为:" + stu1.constructor);
for(var i in stu1){
alert(stu1[i]);
}
</script>

因为Student 对象的原型更改为Person 对象,而Person 对象的原型更改为addSex ,所以,Student 对象的原型为addSex 。
注意:一个对象的原型是在 new 对象的那一刻确定的,如果在 new 对象以后更改无效!

D 如何设置对象的原型对象和构造函数
示例:


代码如下:

<script type="text/javascript">
function B(){
this.name = "刘德华";
return "B方法";
}
function C(){
this.age = 42;
return "C方法";
}
B.prototype = new C();
var b = new B();
b.constructor = B; //重写b的构造方法为B本身
document.write("b 的构造方法:");
document.write(b.constructor() + "<br/>");
document.write("b 的原型对象的构造方法:");
document.write(b.constructor.prototype.constructor() + "<br/>");
for ( var m in b )
{
document.write("属性:" + m );
document.write(" 值:" + b[m] +"<br/>");
}
</script>

结果如下:
b 的构造方法:B方法
b 的原型对象的构造方法:C方法
属性:age 值:42
属性:name 值:刘德华

E 对象中用来保存原型的 __proto__ 变量
示例:


代码如下:

<script type="text/javascript">
function myObject(){}
var my = new myObject();
//任何对象都会有一个隐藏的 __proto__ 变量用来保存原型
document.write(my.__proto__ + "<br/>");
//在 Internet Explorer 下显示为:undefined
//在 Mozilla Firefox 下显示为:[object Object]

function Person(){
this.name = "刘德华";
return "Person 方法";
}
/*
定义方法后,在内存中相当于:
Person.prototype = { constructor:Person }
*/
//改变 Person 对象的原型对象
function Super_Person(){
this.hobby = "唱歌";
return "Super_Person 方法";
}
Person.prototype = new Super_Person();
var newObj = new Person();
/* 使用 new 创建对象过程:
var o = {};
Person.prototype.constructor.call(o);
o = {__proto__:Person.prototype,name = "刘德华"};
return o;
*/
document.write(newObj.constructor.prototype.constructor() + "<br/>");
//打印newObj原型对象(在 IE 下无效!)
document.write(newObj.__proto__.constructor() + "<br/>");
</script>

在 Firefox 中的结果如下:
[object Object]
Super_Person 方法
Super_Person 方法

(0)

相关推荐

  • JavaScript中继承的一些示例方法与属性参考

    prototype 属性的作用: 利用prototype 属性提供对象的类的一组基本功能.对象的新实例"继承"赋予该对象原型的操作. prototype 属性的功能: 所有JavaScript 内部对象都有只读的prototype 属性.可以为内部对象的原型添加功能,但该对象不能被赋予不同的原型. 然而,用户定义的对象可以被赋给新的原型. constructor 属性的作用: constructor 表示创建对象的函数. constructor 属性的功能: constructor 属

  • JavaScript中自带的 reduce()方法使用示例详解

    1.方法说明 , Array的reduce()把一个函数作用在这个Array的[x1, x2, x3...]上,这个函数必须接收两个参数,reduce()把结果继续和序列的下一个元素做累积计算,其效果就是: [x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4) 2. 使用示例 'use strict'; function string2int(s){ if(!s){ alert('the params empty'); return; } if

  • JavaScript中关键字 in 的使用方法详解

    for-in循环应该用在非数组对象的遍历上,使用for-in进行循环也被称为"枚举". 对于数组 ,迭代出来的是数组元素 但不推荐,因为不能保证顺序,而且如果在Array的原型上添加了属性,这个属性也会被遍历出来,所以 最好数组使用正常的for循环,对象使用for-in循环 对于对象 ,迭代出来的是对象的属性: var obj = { "key1":"value1", "key2":"value2", &q

  • JavaScript类继承及实例化的方法

    本文实例讲述了JavaScript类继承及实例化的方法.分享给大家供大家参考.具体如下: (function(){ var Class = { //扩展类 create: function(aBaseClass, aClassDefine){ var $class = function(){ for(var member in aClassDefine){ this[member] = aClassDefine[member]; } if('undefined'===typeof aClassD

  • 彻底搞懂JavaScript中的apply和call方法(必看)

    call和apply都是为了改变某个函数运行的context上下文而存在的,即为了改变函数体内部this的指向.因为JavaScript的函数存在定义上下文和运行时上下文以及上下文是可以改变的概念. 回到目录定义 fun.apply(thisArg, [argsArray]) fun.call(thisArg, arg1,arg2, ...) 其中thisArg可以为null或undefined,此时表示全局对象,更详细见MDN:apply().call() 二者的作用完全一样,只是接受参数的方

  • JavaScript中数组的22种方法必学(推荐)

    前面的话 数组总共有22种方法,本文将其分为对象继承方法.数组转换方法.栈和队列方法.数组排序方法.数组拼接方法.创建子数组方法.数组删改方法.数组位置方法.数组归并方法和数组迭代方法共10类来进行详细介绍 对象继承方法 数组是一种特殊的对象,继承了对象Object的toString().toLocaleString()和valueOf()方法 [toString()] toString()方法返回由数组中每个值的字符串形式拼接而成的一个以逗号分隔的字符串 [注意]该方法的返回值与不使用任何参数

  • 浅谈JavaScript 中有关时间对象的方法

    ECMAScript中的Date类型是在早期 Java 中的 Java.unile.Date 类基础上构建的.为此 Date 类型使用自 UTC (Coordinated Universal Time, 国际协调时间)1970年1月1日午夜开始经过的毫秒数来保存日期. 在这种数据存储格式下, Date 类型保存的日期能够精确到1970年1月1日之前或之后的285616年 •Date.parse(string) 接受一个表示日期的字符串参数,然后尝试根据这个字符串返回相应日期的毫秒数,不能转换则返

  • 全面解析JavaScript中的valueOf与toString方法(推荐)

    可以这样说,所有JS数据类型都拥有valueOf和toString这两个方法,null除外.它们俩解决javascript值运算与显示的问题.在程序应用非常广泛.下面我们逐一来给大家介绍下. JavaScript 的 valueOf() 方法 valueOf() 方法可返回 Boolean 对象的原始值. 用法booleanObject.valueOf(),返回值为booleanObject 的原始布尔值.如果调用该方法的对象不是 Boolean,则抛出异常 TypeError. <script

  • JavaScript面向对象继承原理与实现方法分析

    本文实例讲述了JavaScript面向对象继承原理与实现方法.分享给大家供大家参考,具体如下: 1.构造函数.原型和实例的关系 构造函数有一个原型属性prototype指向一个原型对象. 原型对象包含一个指向构造函数的指针constructor . 实例包含一个指向原型对象的内部指针[[prototype]] . 2.通过原型链实现继承 基本思想:利用原型让一个引用类型继承另一个引用类型的属性和方法,子类型可以访问超类型的所有属性和方法.原型链的构建是将一个类型的实例赋值给另一个构造函数的原型实

  • JavaScript中继承原理与用法实例入门

    本文实例讲述了JavaScript中继承原理与用法.分享给大家供大家参考,具体如下: 正统的面相对象的语言都会提供extend之类的方法用于出来类的继承,但Javascript并不提供extend方法,在Javascript中使用继承需要用点技巧. Javascript中的实例的属性和行为是由构造函数和原型两部分组成的,我们定义两个类:Person和zhangsan,它们在内存中的表现如下图1: 如果想让Zhangsan继承Person,那么我们需要把Person构造函数和原型中的属性和行为全部

随机推荐