javaScript中的面向对象表示

我们知道,面向对象的语言都有一个特点,那就是一般都有类的概念,进而有类的属性和方法等概念。

然而javaScript中并没有类的概念,那我们怎么去通过这个语言本身去实现一些面向对象的特性呢?

(1)一个最简单的方式

  创建Object的实例,为它添加属性和方法

var car = new Object();     //创建实例
car.color = "red";              //为car这个对象增加颜色的属性
car.showColor= function(){       //car的方法
  alert(this.color);
}

  后来发展为一种更为简便和直观的类似json的对象字面量的写法

var car = {
    color : "red",
    showColor : function(){
        alert(this.color);
    }
}

  使用创建单个实例或是对象字面量的写法虽然可以创建单个对象,但是如果我们需要创建多个对象,以上方法就显得很麻烦,

  我们必须复制一套相同的代码,产生car2、car3,渐渐的,为了解决这个问题,我们开始采用工厂模式

(2)使用工厂模式创建对象

function makeCar(color){
    var car = new Object();        //创建一个实例
    car.color = color,             //添加属性
    car.showColor = function(){    //添加方法
        alert(this.color);
    }
    return car;                    //将生成的实例返回
}

调用:
var car1 = car("red");
var car2 = car("green");

  工厂模式顺利解决创建多个对象时编写重复代码的问题。而另一个方面,通过上面这种方式,我们知道,car1和car2都是通过生成Object实例在附加属性和方法产生的,

  即他们都是Object的实例,所以我们并不能很好的知道产生的对象的类型。后来人们为了解决这个问题又提出了一种新的解决方法

(3)构造函数模式

function Car(color){                  //一般构造函数开头大写
    this.color = color;               //添加属性
    this.showColor = function(){      //添加方法
        alert(this.color);
    }
}

调用:
var car1 = new Car("red");
var car2 = new Car("green");

  比较构造函数模式和工厂模式我们可以看出以下区别

1、在构造函数模式里面并没有new Object();方式创建实例和对此实例的赋值

2、在构造函数模式里面没有返回创建的实例

3、构造函数模式直接将属性和方法赋值给this对象

4、构造函数模式使用new 操作符产生Car的对象

  通过上述的方法,我们就可以创建两个Car的对象,解决对象识别的问题(可以使用instanceof方法检验)

  那么使用上面的构造方法创建对象是不是没有缺点呢?答案是否定的,上面的代码中的创建方法的方式实际上相当于

  this.showColor = new Function("alert(this.color)");

  这样的话,new出多个对象就相当于创建了多个Function实例,而这个是浪费的。我们可以把它提出外面,像以下这样

function Car(color){                  //一般构造函数开头大写
    this.color = color;               //添加属性
    this.showColor = showColor;
}
function showColor(){      //添加方法
    alert(this.color);
}   

  这种方法同样存在一个缺点,那就是会产生showColor这个全部的函数,是函数的封装性无法实现

(4)使用构造函数和原型链方式

function Car(color){                  //一般构造函数开头大写
    this.color = color;               //添加属性
}
Car.prototype = {
    constructor : Car,
    showColor : function(){
        alert(this.color);
    }
}   

  以上方式使用了原型链这一概念,关于原型链相关的知识有空再进行整理

  我们需要知道的是,使用原型链定义方法和共享的属性可以通过引用的方式共享,可以最大程度的节约内存。这是采用度较高的一种方式。

时间: 2024-08-07 08:39:34

javaScript中的面向对象表示的相关文章

如何理解并学习javascript中的面向对象(OOP) [转]

如果你想让你的javascript代码变得更加优美,性能更加卓越.或者,你想像jQuery的作者一样,写出属于自己优秀的类库(哪怕是基于 jquery的插件).那么,你请务必要学习javascript面向对象,否则你无法更灵活的使用javascript这门语言. 什么事闭包?到底什么是原型?(知道闭包和原型的,就算得上是javascript的高手了.但真正能够理解,并且灵活运用的人并不多)到底该如何学习javascript中的面向对象呢?在javascript这么语言正如日中天,相信不少人正在为

前端开发:面向对象与javascript中的面向对象实现(一)

前端开发:面向对象与javascript中的面向对象实现(一) 前言: 人生在世,这找不到对象是万万不行的.咱们生活中,找不到对象要挨骂,代码里也一样.朋友问我说:“嘿,在干嘛呢......”,我:“找不到对象!”,他:“就你那样也能找得到对象?”.我一脸黑线...... 废话不多说,今天博主要跟大家聊的是<面向对象与javascript中的面向对象实现>”. 面向对象理解: 面向对象是一种对现实世界理解和抽象的方法,是一种先进的程序设计理念,是一种比较抽象的,多形态的设计模式.我们可以这么理

前端开发:面向对象与javascript中的面向对象实现(二)构造函数与原型

前端开发:面向对象与javascript中的面向对象实现(二)构造函数与原型 前言(题外话): 有人说拖延症是一个绝症,哎呀治不好了.先不说这是一个每个人都多多少少会有的,也不管它究竟对生活有多么大的影响,单单是自己的念想受到了一定得局限,想法不能够像平地而起的高楼大厦建成一样.可是那大楼也是有烂尾的呀,我觉得最重要的还是外在环境与个人观念的先决条件,决定了拖延症的症状的好坏,有那么一些人,它也有拖延症,但是它在拖的中间,想的更多,看的更远.事情在做的时候更加有条不紊,这拖延症这样看来,它也是好

javascript中的面向对象(object-oriented)编程

本文原发于我的个人博客,经多次修改放到csdn上,主要是做备份用,为了更好的阅读体验,请到我的个人博客上阅读. 最近工作一直在用nodejs做开发,有了nodejs,前端.后端.脚本全都可以用javascript搞定,很是方便.但是javascript的很多语法,比如对象,就和我们常用的面向对象的编程语言不同:看某个javascript开源项目,也经常会看到使用this关键字,而这个this关键字在javascript中因上下文不同而意义不同:还有让人奇怪的原型链.这些零零碎碎的东西加起来就很容

javascript 中的面向对象中比较好的资料

http://www.ruanyifeng.com/blog/2011/06/designing_ideas_of_inheritance_mechanism_in_javascript.html http://www.ruanyifeng.com/blog/2010/05/object-oriented_javascript_encapsulation.html http://www.ruanyifeng.com/blog/2010/05/object-oriented_javascript_

JavaScript中OOP——&gt;&gt;&gt;面向对象中的继承/闭包

  前  言  OOP  JavaScript中OOP-->>>面向对象中的继承/闭包 1.1面向对象的概念 使用一个子类继承另一个父类,子类可以自动拥有父类的属性和方法.      >>> 继承的两方,发生在两个类之间. 1.2JS模拟实现继承的三种方式:        首先,了解一下call/apply/binb:通过函数名调用方法,强行将函数中的this指向某个对象:            call写法:  func.call(func的this指向的obj,参数

javascript 中的面向对象实现 如何封装

面向对象的手法来封装javascript ,javascript是没有类的概念的. 所以今天谈到的封装,其实就是用javascript的函数来实现的. 1 2 3 4 var People{ name:’一介布衣’, age:’30' }; 这就是javascript中的一个对象,里面封装了2个属性. 实例化一个对象的实例 people 1 2 var people=new People(); console.log(people.name,people.age);  //一介布衣,30 如果我

深入理解javascript中实现面向对象编程方法

介绍Javascript中面向对象编程思想之前,需要对以下几个概念有了解: 1. 浅拷贝和深拷贝:程序在运行过程中使用的变量有在栈上的变量和在堆上的变量,在对象或者变量的赋值操作过程中,大多数情况先是复制栈上的信息,这样就会出现以下情况,如果变量是对象,那么这一操作,复制的只是真正对象所在 的堆内存空间的起始地址,这就是所谓的浅拷贝,如果是深拷贝,则是在内存堆空间中重新分配一个内存,并把分配的内存的起始地址复制过去. 2. 引用类型数据和值类型数据:谈到引用类型数据和值类型数据,自然而然的联想到

深入JavaScript(一)——JavaScript中的面向对象(一)

面向对象的语言有一个标志,那就是它们都有"类"的概念,通过类可以创建任意多个具有相同属性和方法的对象.JavaScript 中没有类的概念,因此它的面向对象与基于类的语言中的对象有所不同. JavaScript 对对象的定义是:无序属性的集合,其属性可以包含基本值.对象或者函数.可以把 JavaScript 对象理解成散列表,即一组名值对,其中的值可以是数据或函数. 那么想要创建自定义对象,有以下几种常用方法: 1.使用 Object 构造函数: var person = new Ob