最近在读javascript高级程序设计,其中的对象基础一章感觉讲的很好,下面把其中有用的东西分享一下。
看如下js构造类的一个示例:
function Car(sColor, iDoors, iMpg) {
this.color = sColor;
this.doors = iDoors;
this.mpg = iMpg;
this.showColor = function() {
alert(this.color);
}
}
var oCar1 = new Car('red', 4, 23);
var oCar2 = new Car('blue', 3, 25);
这种方法被称为构造函数方式
。简要的说明一下,这段代码声明了一个Car类,oCar1和oCar2为其两个对象。看起来这段代码很是不错,但是注意那个this.showColor = function(){alert(this.color)};
this指代Car的一个对象,也就是说,每一个对象都有一个showColor方法,这势必会造成一种资源浪费。
再来看一种js构造类的示例:
function Car(){
}
Car.prototype.color = "red";
Car.prototype.doors = 4;
Car.prototype.mpg = 23;
Car.prototype.showColor = function(){
alert(this.color);
}
var oCar1 = new Car();
var oCar2 = new Car();
这种方法被称为原型方式
。该方法避免了showColor函数被每个对象都创建,而是所有Car类的对象共享这一个函数,然后在调用的时候,使用this关键字找到实例对象的color,这种方式也有问题,即color,doors和mpg被所有对象共享,如果一个对象修改了color那么其他的对象的color也会相应的改变。
那么显然将二者结合起来就好了:
function Car(){
this.color = sColor;
this.doors = iDoors;
this.mpg = iMpg;
}
Car.prototype.showColor = function(){
alert(this.color);
}
var oCar1 = new Car();
var oCar2 = new Car();
这种方式被称为混合的构造函数/原型方法
。
这个代码就没有什么问题了,那么动态原型方法
指的是什么呢?
我们先来看一段java代码:
class Car {
public String color = "red";
public int doors = 4;
public int mpg = 23;
public Car(String color, int doors, int mpg){
this.color = color;
this.doors = doors;
this.mpg = mpg;
}
public void showColor() {
System.out.println(this.color);
}
}
这是和我们前面js构造出来的相似的一个java class.由此可见由于java超强的面向对象的机制,已经把这种属性和方法的区别为我们做好了,我们只需要将所有的方法写在class中,然后java处理好剩下的事情。
js也有一种几乎完全和这段java类似的方法-动态原型方法
function Car(sColor,iDoors,iMpg){
this.color = sColor;
this.doors = iDoors;
this.mpg = iMpg;
if(typeof Car._initialized == "undefined"){
Car.prototype.showColor = function(){
alert(this.color);
}
Car._initialized = true.
}
}
这回看起来舒服多了吧,不过动态原型方法
在继承的时候有一个问题:
function Polygon(iSides) {
this.sides = iSides;
if(typeof Polygon._initialized == "undefined"){
Polygon.prototype.getArea = function(){
return 0;
}
Polygon._initialized = true;
}
}
function Triangle(iBase,iHeight){
Polygon.call(this,3);
this.base = iBase;
this.height = iHeight;
if(typeof Triangle._initialized == "undefined"){
Triangle.prototype = new Polygon();
Triangle.prototype.getArea = function(){
return .5 * this.base * this.height;
}
Triangle._initialized = true;
}
}
var tri1 = new Triangle(3,4);
alert(tri1.getArea());
这段代码根本就跑不起来,也就是说当
var tri1 = new Triangle(3,4);
执行的时候,程序会进入Triangle的构造函数中,然后依次执行,此时Triangle的这个对象已经被实例化了,所以当再次调用
Triangle.prototype = new Polygon();
自然就会报错了。也就是说,动态原型方法
不适合与继承中子类的构造。
那么修改一下就可以了:
function Polygon(iSides) {
this.sides = iSides;
this.type = "Polygon";
if(typeof Polygon._initialized == "undefined"){
Polygon.prototype.getArea = function(){
return 0;
}
Polygon._initialized = true;
}
}
function Triangle(iBase,iHeight){
Polygon.call(this,3);
this.base = iBase;
this.height = iHeight;
if(typeof Triangle._initialized == "undefined"){
Triangle.prototype.getArea = function(){
return .5 * this.base * this.height;
}
Triangle._initialized = true;
}
}
Triangle.prototype = new Polygon();
var tri1 = new Triangle(3,4);
alert(tri1.getArea());
alert(tri1.type);
总之,js面向对象是js重要的一关,也是js高级的重要部分,所以语法特性不是一个语言最重要的部分,而模式,设计,OO这些东西才是学好一门语言的关键。可以看看ext的东西,尤其是源代码(我目前是没看懂),你就会发现,ext使用类似swing的模式,使用js这种语言搭建了一个如此庞大的对象的库是多么的强大了。
分享到:
相关推荐
JS面向对象经典案例,JS面向对象过程中用到的一些技术,例如对象、类、JS继承Call、JS原型链Prototype、JS闭包等等
JavaScript作为一门浏览器语言的核心思想;面向对象编程的基础知识及其在... 《JavaScript面向对象编程指南》着重介绍JavaScript在面向对象方面的特性,展示如何构建强健的、可维护的、功能强大的应用程序及程序库
《JavaScript面向对象编程指南》内容包括:JavaScript作为一门浏览器语言的核心思想;面向对象编程的基础知识及其在JavaScript中的运用;数据类型、操作符以及流程控制语句;函数、闭包、对象和原型等概念,以代码...
第16周-第16章节-Python3.5-JavaScript面向对象及原型.avi
原型是理解继承概念的关键, 我们将会教你如何建立原型, 如何检测一个对象是否是另外一个对象的原型, 及其 JavaScript 的模型与Java 面向对象编程之间的区别。我们同样会向你展示如何检测对象所包含的各种属性的方法...
李炎恢JavaScript视频教程[Avi版]中的讲义 非常好~
JavaScript作为一门浏览器语言的核心思想;...如何实现JavaScript中缺失的面向对象特性,如对象的私有成员与私有方法;如何应用适当的编程模式,发挥JavaScript语言特有的优势;如何应用设计模式解决常见问题等。
由于JS不是纯的面向对象的语言,所以对象的继承是以原型函数的形式继承的,很多人刚开始接触的时候不太理解,但是JS这种以原型函数的形式实现面向对象技术,不仅是可行的,而且还为面向对象技术提供了动态继承的功能...
js面向对象之常见创建对象的几种方式(工厂模式、构造函数模式、原型模式).docx
主要介绍了面向对象JS基础讲解,工厂模式、构造函数模式、原型模式、混合模式、动态原型模式,需要的朋友可以参考下
《JavaScript面向对象编程指南》内容包括:JavaScript作为一门浏览器语言的核心思想;面向对象编程的基础知识及其在JavaScript中的运用;数据类型、操作符以及流程控制语句;函数、闭包、对象和原型等概念,以代码...
《JavaScript面向对象编程指南》内容包括:JavaScript作为一门浏览器语言的核心思想;面向对象编程的基础知识及其在JavaScript中的运用;数据类型、操作符以及流程控制语句;函数、闭包、对象和原型等概念,以代码...
但是,它又不是一种真正的面向对象编程(OOP)语言,因为它的语法中没有class(类)。 那么,如果我们要把"属性"(property)和"方法"(method),封装成一个对象,甚至要从原型对象生成一个实例对象,我们应该怎么...
JavaScript面向对象基础PPT,讲述了何谓面向对象、面向对象特点、组成及写法、工厂模式、原型以及如何将普通面向过程的代码转换为面向对象的基本原则