`
webcode
  • 浏览: 5943848 次
  • 性别: Icon_minigender_1
  • 来自: 上海
文章分类
社区版块
存档分类
最新评论

JavaScript的面向对象设计

 
阅读更多

依据W3C School的定义,Javascript是面向对象的语言, 虽然没有类(class),但到处是对象. 可以理解只有定义而没有声明, 直接用就行. 其中的每个对象都可以理解为一组Key-Value的组合.


附上W3C School的说明:

面向对象语言的要求

一种面向对象语言需要向开发者提供四种基本能力:

  1. 封装 -把相关的信息(无论数据或方法)存储在对象中的能力
  2. 聚集 -把一个对象存储在另一个对象内的能力
  3. 继承 -由另一个类(或多个类)得来类的属性和方法的能力
  4. 多态 -编写能以多种方法运行的函数或方法的能力

ECMAScript支持这些要求,因此可被是看做面向对象的。



下面就是一比较规矩的对象定义 (以下的例子参考了<<JavaScript高级程序设计>>):

var person = new Object();

person.name = "Horky";

person.age = 40;

person.job = "Software Engineer";


person.sayName = function(){

document.write(this.name);

}


调用方式:

person.sayName();


document.write("<p /> Age: ");

document.write(person.age);

document.write("<p /> Job: ");

document.write(person["job"]);


嗯,是的,所有属性都是public的,而且有两种不同的属性访问方式. (关于访问性的限定可以由属性(property)的特性(attribute)来设定.)


再一种是比较随意而且切中Key-Value的定义方式, 但是老版本的浏览器可不见得支持:

var person = (

name: "Horky",

age: 40,

job: "Software Engineer",


sayName: function(){

document.write(this.name);

}

};


因为Javascript的变量本质是松散类型,说白了就是无政府主义型. 所以并不需要一开始就给出完整定义,而是像下面这样也是允许的 (展示需要,绝不推荐):

var person = new Object();


person.name = "Horky";

person.sayName = function()

{

document.write(this.name);

}


person.sayName();

person.age = 40;

document.write("<p /> Age: ");

document.write(person.age);

person.job = "Software Engineer";

document.write("<p /> Job: ");

document.write(person["job"]);


也不是没有限制. 如果第一句改为下面这样可就不行了:

var person; 或者 var person = "Undefined";

原因还是在Javascript中基本数据类型和引用类型还是泾渭分明的.


回顾一下前面所讲的JavaScript拥有面向对象的特性,前面两点不用多说, 引用类型就比较明显具备, 第三点稍后再说. 关于多态, 其实真有点牵强, 个人觉得更像是C/C++中的可变参数的函数. 因为这里的多态针对函数而言. 也就是一个函数的参数可以很随性, JavaScript也懒得限定,一切交给开发者吧.结果还整出一个多态来. 结合建构子举个例子吧:

function Person(name, age, job)

{

this.name = "Mr Nobody!";

this.age = 0;

this.job = "Hard to say!";


switch(arguments.length)

{

case 3:

this.job = job;

case 2:

this.age = age;

case 1:

this.name = name;

break;

}

this.introduceSelf = function()

{

document.write("<p /> My name is: "+this.name);

document.write("<p /> "+ this.age+" years old!");

document.write("<p /> And, my job is : "+this.job);

}

}


var horky = new Person("Horky",40,"Software Engineer");

var arthas = new Person("Arthas",22);

var nobody = new Person();


这个函数Person()就是一个建构函数, 创建一个Person的对象并返回. 依据传入的不同参数执行不同的初始化,这也就是多态的一种体现了.


扩展一下,如果传入的是对象,如何实现复制呢? 这就是原型式继承的模式 (参<<JavaScript高级程序设计>> 6.3.4).

增加一个全局函数:

function object(o)

{

function F() {};

F.prototype = o;

return new F();

}


然后试试以下两个新的对象:

var horky_alias = object(horky);

var arthas_alias = object(horky, {name:{value:"Arthas"}});

第二个对象在复制horky时,顺便将其中的名字也给改了.


它可以工作的核心在F.prototype上. 因为这个特殊指针的存在,使得这一切成为可能.每个函数都有一个prototype,它是一个指向某个对象的指针, 而这个对象包含了所有实例可以共享的属性和方法, 很像是享元的概念.



下面就说一下继承. JavaScript中所讲的继承,说白了就是使子对象可以访问父对象. 所以有两个重点: 子对象中需要有一个父对象的实例, 那就是prototype. 于是一个典型的子对象定义出来了:

function Boy(name, age, job)

{

this.sex = "Male";

this.prototype = new Person(name,age,job);

this.introduceSelf = function()

{

this.prototype.introduceSelf();

document.write("<p /> I am BOY!");

}

}


var boy = new Boy("A",3);


如果觉得使用prototype太过于底层,也有几分hack的味道,也可以使用"借用构造函数"的方式来实现简单一些继承.

分享到:
评论

相关推荐

    [JavaScript] JavaScript 面向对象设计原则 (英文版)

    [No Starch Press] JavaScript 面向对象设计原则 (英文版) [No Starch Press] The Principles of Object-Oriented JavaScript (E-Book) ☆ 图书概要:☆ If you've used a more traditional object-oriented ...

    Javascript面向对象设计一 工厂模式.docx

    Javascript面向对象设计一 工厂模式.docx

    JavaScript面向对象编程指南.pdf

    JavaScript作为一门浏览器语言的核心思想;面向对象编程的基础知识及其在... 《JavaScript面向对象编程指南》着重介绍JavaScript在面向对象方面的特性,展示如何构建强健的、可维护的、功能强大的应用程序及程序库

    JavaScript面向对象编程指南

    《JavaScript面向对象编程指南》内容包括:JavaScript作为一门浏览器语言的核心思想;面向对象编程的基础知识及其在JavaScript中的运用;数据类型、操作符以及流程控制语句;函数、闭包、对象和原型等概念,以代码...

    JavaScript面向对象程序设计

    JavaScript面向对象程序设计(1): 前言 JavaScript面向对象程序设计(2): 数组 JavaScript面向对象程序设计(3): 对象 JavaScript面向对象程序设计(4): 函数 JavaScript面向对象程序设计(5): 类 JavaScript面向对象程序...

    javascript面向对象编程

    javascript面向对象编程,详细叙述javascript面向对象设计,让你知道javascript也能同C#那样编写代码

    Javascript面向对象程序设计培训讲义

    由于JS不是纯的面向对象的语言,所以对象的继承是以原型函数的形式继承的,很多人刚开始接触的时候不太理解,但是JS这种以原型函数的形式实现面向对象技术,不仅是可行的,而且还为面向对象技术提供了动态继承的功能...

    JavaScript程序设计课件:面向对象概述.pptx

    JavaScript程序设计 面向过程与面向对象 6.1.1 面向过程与面向对象 1、概念 面向过程(Procedure Oriented)也可称之为“面向记录”,是一种以过程为中心的编程思想。它注重的是具体的步骤,只有按照步骤一步一步...

    javascript 经典面向对象设计

    比中文资料要清晰的多,深入细节,实例代码详尽

    javascript 面向对象编程.pdf javascript 设计模式与开发实践.pdf

    javascript 面向对象编程.pdf javascript 设计模式与开发实践.pdf 两本书都是高清文字版,带目录

    JavaScript面向对象编程指南 英文版

    《JavaScript面向对象编程指南》内容包括:JavaScript作为一门浏览器语言的核心思想;面向对象编程的基础知识及其在JavaScript中的运用;数据类型、操作符以及流程控制语句;函数、闭包、对象和原型等概念,以代码...

    JavaScript面向对象设计二 构造函数模式

    在Javascript面向对象设计一——工厂模式 中介绍了使用CreateEmployee()函数创建员工类。ECMAScript中的构造函数可以用来创建特定类型的对象,如Object和Array这样的原生构造函数,在运行时会自动出现在执行环境中...

    JavaScript面向对象编程指南 有书签

    《JavaScript面向对象编程指南》内容包括:JavaScript作为一门浏览器语言的核心思想;面向对象编程的基础知识及其在JavaScript中的运用;数据类型、操作符以及流程控制语句;函数、闭包、对象和原型等概念,以代码...

Global site tag (gtag.js) - Google Analytics