小记:撰写本文参考了大量网友的JS面向对象编程心得,其中摘录了部分网友博客的代码和语录,因某些原因,这些代码和语录未注明出处,请网友们见谅,如有需要,请与作者联系(shuchangs@126.com),本文将标注出处!本文中所有代码均在VS2005上调试通过!
1 使用function自定义类
function在JS中是一个很特殊的对象,其特殊性表现在它的多重身份上:function既可以声明普通的函数,这一点和其他语言中的函数概念相同(比如VB中声明一个函数用Function,声明一个过程用Sub,注意VB不区分大小写,而JS区分大小写);除此以外,function还可以用作类型的声明和实现、对象的构造函数,以及类引用等。
下面的代码演示了如何使用function定义一个类,以及使用prototype属性为自定义类添加实例方法。
<script type="text/javascript">
//使用function自定义"人"类及其构造函数
function Person(name,sex,age,address){ //此处function首字母小写
this.name=name; //自定义类用this关键词
this.sex=sex;
this.age=age;
this.address=address;
this.vocationDesc=function (vocation) { //在类内部定义方法
document.write("<br />这种直接在‘类内部’定义的方法只能用【类的实例】调用,不能用【类】调用,称之为【类的实例方法】.<br />");
document.write("<br />职业描述:"+vocation+"<br />");
}
}
//使用function自定义类的另一种表达式:className = new Function( [参数1, [... 参数N,]] 类体 );此处Function首字母大写
Person.eduBackground="本科"; //为自定义类添加其它属性
Person.prototype.descript=function () { //使用prototype属性为自定义类添加其它方法
document.write("<br />这种使用‘prototype(原型)’定义的方法只能用【类的实例】调用,不能用【类】调用,称之为【类的实例方法】.");
var str="<br />姓名:"+this.name
+"<br />性别:"+this.sex
+"<br />年龄:"+this.age
+"<br />地址:"+this.address
+"<br />教育背景:"+this.eduBackground+"<br />";
document.write(str);
};
Person.print = function() { //在类外部定义方法
document.write("<br />这种直接在‘类外部’定义的方法只能用【类】调用,不能用【类的实例】调用,称之为【类方法】.<br />");
}
var person=new Person("舒畅","女","20","北京");//新建类Person的实例person,注意JS区分大小写
person.eduBackground="硕士";
document.write(">>类的实例调用:person.descript();【开始】+++++++++++++<br>");
person.descript();//类的实例调用
document.write(">>类的实例调用:person.descript();【结束】+++++++++++++<br>");
document.write(">>类的实例调用:person.vocationDesc('演员');【开始】+++++++++++++<br>");
person.vocationDesc("演员"); //类的实例调用
document.write(">>类的实例调用:person.vocationDesc('演员');【结束】+++++++++++++<br>");
document.write(">>类调用:Person.print();【开始】--------------<br>");
Person.print();//类调用
document.write(">>类调用:Person.print();【结束】--------------<br>");
</script>
运行结果如下:
*注:prototype(原型)属性是JS中所有对象的固有属性。可以使用prototype属性为JS中已有对象(比如Array、Date等对象,这些已有对象可以称之为类)的原型添加功能,但这些对象不能被赋予不同的原型。然而,用户自定义的对象可以被赋给新的原型。
2 使用new Object()方法自定义类
下面的代码演示了如何使用new Object()方法自定义类:
<script type="text/javascript">
Student=new Object(); //创建了一个没有属性的通用对象Student,此处我们称之为类,类似我们上一目中用new Function()方法定义类.
//直接给类赋予属性
Student.name="";
Student.sex="";
Student.address="";
//直接给类赋予方法
Student.Student=function (name,sex,address) {
this.name=name;
this.sex=sex;
this.address=address;
}
Student.synopsis=function () { //直接给类赋予方法
document.write("姓名:"+this.name+",性别:"+this.sex+",地址:"+this.address+"<br>");
document.write("使用new Object()自定义类,不允许有实例,不允许用prototype属性为其定义方法!一切只能用类调用。");
}
Student.Student("舒畅","女","北京"); //类方法调用
Student.synopsis(); //类方法调用
}
</script>
运行结果如下:
3 关于JS面向对象继承问题
JS本身并没有提供继承的语法支持,但我们可以采用复制属性和对象的方法实现继承。其中我们使用for(…in…)语句遍历对象的所有属性和方法。
下面的代码演示了JS关于面向对象继承操作:
<script type="text/javascript">
function Person(){} //定义父类
//使用prototype属性为自定义类添加实例属性
Person.prototype.name="";
Person.prototype.sex="";
Person.prototype.age="";
Person.prototype.address="";
Person.prototype.eduBackground="本科";
//使用prototype属性为自定义类添加实例方法
Person.prototype.init=function(name,sex,age,address,eduBackground){
this.name=name;
this.age=age;
this.sex=sex;
this.address=address;
this.eduBackground=eduBackground;
}
Person.prototype.descript=function () {
var str="<br />姓名:"+this.name
+",性别:"+this.sex
+",年龄:"+this.age
+",地址:"+this.address
+",教育背景:"+this.eduBackground+"<br />";
document.write(str);
};
var person=new Person();//JS区分大小写
person.init("盖茨","男","55","上海","硕士");
document.write("父类操作:<br />");
document.write("<br />父类descript()操作<br />");
person.descript();
//********************下面实现类Worker继承类Person操作*****************
function Worker(){} //定义子类
//使用for(..in..)语句将父类Person的实例属性和方法复制给子类Worker
//使子类Worker继承父类Person的属性和方法
for(p in Person.prototype){
Worker.prototype[p]=Person.prototype[p];
//alert(Person.prototype[p]);
}
//重写Worker类的descript()方法
Worker.prototype.descript=function(){
var str="<br />姓名:"+this.name
+",性别:"+this.sex
+",年龄:"+this.age
+",地址:"+this.address
+",教育背景:"+this.eduBackground
+",职业:工人<br />";
document.write(str);
}
//新增子类的实例方法
Worker.prototype.vocationDesc=function(){
document.write("<br />职业:工人");
}
var worker=new Worker();
worker.init("舒畅","女","20","北京","硕士");
document.write("<br />子类操作:<br />");
document.write("<br />子类重写父类descript()操作<br />");
worker.descript();
document.write("<br />子类新增vocationDesc()操作<br />");
worker.vocationDesc();
</script>
运行结果如下:
也可以使用下面的方法实现继承操作
<script language="javascript" type="text/javascript">
<!--
function superClass() {
this.supertest = superTest; //attach method superTest
}
function subClass() {
this.inheritFrom = superClass; //1.使用这种方法也可以实现继承
this.inheritFrom();//2.使用这种方法也可以实现继承
/*或者采用下面的方式
*this.inheritFrom = superClass;
*superClass.call(this);
*/
this.subtest = subTest; //attach method subTest
}
function superTest() {
return "superTest";
}
function subTest() {
return "subTest";
}
var newClass = new subClass();
document.write("子类方法:"+newClass.subtest()+"<br />"); // yields "subTest"
document.write("子类调用父类方法:"+newClass.supertest()+"<br />"); // yields "superTest"
</script>
运行结果如下:
4 关于JS面向对象多态问题
JS中多态的实现可以采用
分享到:
相关推荐
JS面向对象的基础 写的很好的,大家去看JS面向对象的基础 JS面向对象的基础 写的很好的,大家去看JS面向对象的基础
### 面向对象JavaScript精要 #### 一、书籍概览 本书《面向对象JavaScript精要》由Nicholas C. Zakas编写,是面向对象编程领域中的权威指南之一,尤其针对JavaScript这门语言。作者深入浅出地介绍了面向对象编程的...
JS面向对象基础.
**JS面向对象汇总PDF**是针对JavaScript编程语言中面向对象编程概念的一个综合性的学习资料,主要探讨了JavaScript如何实现面向对象编程(OOP)的设计原则和模式。在JavaScript中,面向对象编程是一种重要的编程范式...
### JavaScript面向对象编程精要 #### 一、引言 JavaScript是一种灵活且强大的脚本语言,它虽然起源于一种简单的浏览器脚本语言,但随着时间的发展,JavaScript已经成为了一种功能全面的编程语言,尤其是在Web开发...
### JavaScript面向对象要点总结 在JavaScript中,面向对象编程(OOP)是一种广泛采用的编程范式,它允许开发者创建可重用、模块化的代码。本文将深入探讨JavaScript面向对象的关键概念,包括构造函数、原型链、...
总结来说,"js 贪吃蛇(面向对象)"案例提供了学习和实践JavaScript面向对象编程的好机会。通过分析和实现这个案例,开发者可以深入理解面向对象的设计原则,提高代码复用和维护性,同时也能体会到面向对象编程在...
根据提供的文件信息,我们将重点放在面向对象编程(OOP)在JavaScript中的应用上。JavaScript作为一种广泛使用的脚本语言,不仅在浏览器环境中发挥着重要作用,在服务器端开发(如Node.js)及桌面应用程序开发等领域也...
JavaScript是一种广泛应用于Web开发的动态编程语言,尤其以其强大的面向对象特性而闻名。面向对象编程(Object-Oriented ...通过阅读`prototype.js`这样的示例代码,可以帮助加深对JavaScript面向对象编程的理解。
### JavaScript面向对象精要 #### 一、概述 《JavaScript面向对象精要》是一本深入讲解JavaScript面向对象编程原理的专业书籍。本书由知名的前端开发者Nicholas C. Zakas撰写,全面介绍了JavaScript作为一种动态...
### JavaScript面向对象编程知识点概述 #### 一、现代JavaScript编程概览 - **JavaScript的演进**:自诞生以来,JavaScript经历了从一个简单的脚本语言到现今被广泛应用于构建复杂应用的强大编程语言的过程。它的...
### JavaScript面向对象编程详解 #### 一、引言 JavaScript作为一种广泛使用的脚本语言,在Web开发领域占据着举足轻重的地位。尽管JavaScript本质上是一种基于原型的语言,但它也支持面向对象编程的一些特性,使得...
### JavaScript面向对象编程详解 #### 6.1 JavaScript中支持面向对象的基础 ##### 6.1.1 使用定义函数的方式定义类 在面向对象编程(OOP)中,“类”是核心概念之一,它代表着一类事物的抽象。在JavaScript中,可以...
在这个“面向对象js开发钟表”的项目中,我们将深入探讨如何使用JavaScript实现一个自定义的钟表插件。 首先,我们需要理解钟表的基本组成部分:时针、分针和秒针。在面向对象的视角下,我们可以为每个部分创建单独...
### 面向对象技术-2,javascript教程,js面向对象教程 #### 课程目标概述 本教程旨在帮助读者深入理解面向对象编程的基础知识,并掌握JavaScript中的面向对象编程技巧。主要内容涵盖面向对象的基础概念、核心特性...
这篇博文“javascript面向对象总结”深入探讨了JavaScript中的面向对象编程(OOP)概念,结合实际示例,提供了对这一主题的全面理解。以下是文章可能涉及的关键知识点: 1. **对象和属性**:在JavaScript中,一切皆...
从所提供的文件信息中,我们可以总结以下几点与“JavaScript面向对象编程指南 第2版 高清 带索引书签目录_样章.pdf”相关的重要知识点。 首先,该文件提到的书籍是关于JavaScript面向对象编程的,面向对象编程...
总结来说,`lang.js`是JavaScript开发者的一个强大工具,它通过提供面向对象的扩展,使得开发者可以在JavaScript中更加方便地实现类的定义和函数重载,提升代码的可维护性和可读性。通过阅读源码和示例,开发者可以...
总结来说,JavaScript面向对象编程涵盖了从基本原理到实现细节的多个方面,包括但不限于对象、构造函数、原型链、继承以及封装等。本书系统地介绍了这些知识点,并通过实例演示了如何在现代JavaScript中实现OOP,...