`

Javascript高级编程4

阅读更多
ECMAScript 拥有很多创建对象或类的方法。

1.工厂方式
function createCar() {
  var oTempCar = new Object;
  oTempCar.color = "blue";
  oTempCar.doors = 4;
  oTempCar.mpg = 25;
  oTempCar.showColor = function() {
    alert(this.color);
  };
  return oTempCar;
}

var oCar1 = createCar();
var oCar2 = createCar();

1.1为函数传递参数
function createCar(sColor,iDoors,iMpg) {
  var oTempCar = new Object;
  oTempCar.color = sColor;
  oTempCar.doors = iDoors;
  oTempCar.mpg = iMpg;
  oTempCar.showColor = function() {
    alert(this.color);
  };
  return oTempCar;
}

var oCar1 = createCar("red",4,23);
var oCar2 = createCar("blue",3,25);

oCar1.showColor(); //输出 "red"
oCar2.showColor(); //输出 "blue"

1.2在工厂函数外定义对象的方法
function showColor() {
  alert(this.color);
}
oTempCar.showColor = showColor;

2.构造函数方式
创建构造函数就像创建工厂函数一样容易。第一步选择类名,即构造函数的名字。根据惯例,这个名字的首字母大写,以使它与首字母通常是小写的变量名分开。除了这点不同,构造函数看起来很像工厂函数。

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);

3.原型方式
该方式利用了对象的 prototype 属性,可以把它看成创建新对象所依赖的原型。
这里,首先用空构造函数来设置类名。然后所有的属性和方法都被直接赋予 prototype 属性。
function Car() {
}

Car.prototype.color = "blue";
Car.prototype.doors = 4;
Car.prototype.mpg = 25;
Car.prototype.showColor = function() {
  alert(this.color);
};


var oCar1 = new Car();
var oCar2 = new Car();

原型方式的问题

首先,这个构造函数没有参数。使用原型方式,不能通过给构造函数传递参数来初始化属性的值,因为 Car1 和 Car2 的 color 属性都等于 "blue",doors 属性都等于 4,mpg 属性都等于 25。这意味着必须在对象创建后才能改变属性的默认值,这点很令人讨厌,但还没完。真正的问题出现在属性指向的是对象,而不是函数时。函数共享不会造成问题,但对象却很少被多个实例共享。

function Car() {
}

Car.prototype.color = "blue";
Car.prototype.doors = 4;
Car.prototype.mpg = 25;
Car.prototype.drivers = new Array("Mike","John");
Car.prototype.showColor = function() {
  alert(this.color);
};

var oCar1 = new Car();
var oCar2 = new Car();

oCar1.drivers.push("Bill");

alert(oCar1.drivers); //输出 "Mike,John,Bill"
alert(oCar2.drivers); //输出 "Mike,John,Bill"

4.混合的构造函数/原型方式
联合使用构造函数和原型方式,就可像用其他程序设计语言一样创建对象。这种概念非常简单,即用构造函数定义对象的所有非函数属性,用原型方式定义对象的函数属性(方法)。结果是,所有函数都只创建一次,而每个对象都具有自己的对象属性实例。
function Car(sColor,iDoors,iMpg) {
  this.color = sColor;
  this.doors = iDoors;
  this.mpg = iMpg;
  this.drivers = new Array("Mike","John");
}

Car.prototype.showColor = function() {
  alert(this.color);
};

var oCar1 = new Car("red",4,23);
var oCar2 = new Car("blue",3,25);

oCar1.drivers.push("Bill");

alert(oCar1.drivers); //输出 "Mike,John,Bill"
alert(oCar2.drivers); //输出 "Mike,John"

5.动态原型方法
class Car {
  public String color = "blue";
  public int doors = 4;
  public int mpg = 25;

  public Car(String color, int doors, int mpg) {
    this.color = color;
    this.doors = doors;
    this.mpg = mpg;
  }
 
  public void showColor() {
    System.out.println(color);
  }
}

-------------------
var arr = new Array();
arr[0] = "hello ";
arr[1] = "world";
var str = arr.join("");
//存储字符串2
function StringBuffer () {
  this._strings_ = new Array();
}

StringBuffer.prototype.append = function(str) {
  this._strings_.push(str);
};

StringBuffer.prototype.toString = function() {
  return this._strings_.join("");
};

var buffer = new StringBuffer ();
buffer.append("hello ");
buffer.append("world");
var result = buffer.toString();

通过使用 ECMAScript,不仅可以创建对象,还可以修改已有对象的行为。
prototype 属性不仅可以定义构造函数的属性和方法,还可以为本地对象添加属性和方法。

通过已有的方法创建新方法
Number.prototype.toHexString = function() {
  return this.toString(16);
};

重命名已有方法
Array.prototype.enqueue = function(vItem) {
  this.push(vItem);
};

Array.prototype.dequeue = function() {
  return this.shift();
};
添加与已有方法无关的方法
Array.prototype.indexOf = function (vItem) {
  for (var i=0; i<this.length; i++) {
    if (vItem == this[i]) {
  return i;
}
  }
为本地对象添加新方法
Object.prototype.showValue = function () {
  alert(this.valueOf());
};


  return -1;
}
重定义已有方法
Function.prototype.toString = function() {
  return "Function code hidden";
}
分享到:
评论

相关推荐

    JavaScript高级编程 pdf

    JavaScript高级编程 pdfJavaScript高级编程 pdfJavaScript高级编程 pdfJavaScript高级编程 pdf

    JavaScript_高级编程

    JavaScript一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标准通用标记语言下的一个...

    javascript高级编程JavaScript.pdf

    高级编程

    javascript高级编程.pdf

    javascript高级编程,包括语言概述,语言基础,事件处理,对象编程,文档对象模型,windows对象,document对象

    javascript高级编程PPT.zip

    javascript高级编程的JavaScript开始讲起,直到当前它对XML和Web服务的具体支持,内容主要涉及JavaScript的语言特点、JavaScript与浏览器的交互、更高级的JavaScript技巧,以及与在Web应用程序中部署JavaScript解决...

    javascript高级编程(第2版)pdf.part2

    javascript 高级编程 (第2版)pdf.part2

    javascript高级编程

    javascript高级编程 快速学习 易学易懂

    JavaScript高级编程.ppt

    javascript高级编程的 幻灯片文件

    JavaScript 高级编程

    很详细透彻的 javascript 网上收集 的 但是不知道是那本书 知道的告诉我下 我去买本 入门与提高 javascript教程 入门与提高 javascript教程入门与提高 javascript教程

    javaScript高级编程

    Javascript 高级编程主要JavaScript的基本语法,Document对象,文本对象,按钮对象,选择和隐藏对象,Location对象,history对象等等的属性和方法,最后讲述了Javascript的服务器编程;比较适合初学者;

    JavaScript 高级编程(成书).pdf

    JavaScript 高级编程(成书).pdf JavaScript 高级编程(成书).pdf

    javascript高级编程学习手册

    目录: 第一章 javascript语言概述 第二章 JavaScript语言基础 第三章 JavaScript事件处理 第四章 JavaScript基于对象编程 第六章 string,math,array等数据对象 第七章 window及相关顶级对象 第八章 document对象

    Javascript 高级编程第2版PDF part1

    从最佳编程实践到即将成为现实的api,直至javascript未来的发展,全景式地展示了javascript高级程序设计的方方面面。 本书适合不同层次的javascript/web开发人员阅读参考,也可作为高校相关专业课程的教材。

    JavaScript_高级编程(成书).pdf

    JavaScript_高级编程(成书).pdf

    Javascript 高级编程第2版PDF part4

    本书在上一版基础上进行了大幅度更新和修订,融入了近几年来javascript应用发展的最新成果,几乎...从最佳编程实践到即将成为现实的api,直至javascript未来的发展,全景式地展示了javascript高级程序设计的方方面面。

    javascript高级编程技术

    一、了解脚本的概念,掌握:JavaScrip语言基本语法、... 二、了解JavaScrip的各种数据类型,掌握各种运算符,表达式的运算。使用控制选择结构编写简单的程序。 三、了解各种对象的的概念,掌握各种对象的属性和方法。

    JavaScript_高级编程(成书)

    JavaScript_高级编程(成书),详细请下载查看。

    JavaScript高级编程

    很好的JavaScript入门教材,概念讲解清晰,准确,扎实。

    javascript高级编程ppt详细

    javascript高级编程ppt详细资料

Global site tag (gtag.js) - Google Analytics