《JavaScript应用程序设计》一一3.7 创建对象

3.7 创建对象

JavaScript中的对象一部分是通过构造函数生成的,例如:

function Car(color, direction, mph) {
  this.color = color || 'pink';
  this.direction = direction || 0; // 0 = Straight ahead
  this.mph = mph || 0;

  this.gas = function gas(amount) {
    amount = amount || 10;
    this.mph += amount;
    return this;
  };

  this.brake = function brake(amount) {
    amount = amount || 10;
    this.mph = ((this.mph - amount) < 0)? 0
      : this.mph - amount;
    return this;
  };
}

var myCar = new Car();

test('Constructor', function () {
  ok(myCar.color, 'Has a color');

  equal(myCar.gas().mph, 10,
    '.accelerate() should add 10mph.'
  );

  equal(myCar.brake(5).mph, 5,
    '.brake(5) should subtract 5mph.'
  );
});

使用私有变量来做数据封装:

function Car(color, direction, mph) {
  var isParkingBrakeOn = false;
  this.color = color || 'pink';
  this.direction = direction || 0; // 0 = Straight ahead
  this.mph = mph || 0;

  this.gas = function gas(amount) {
    amount = amount || 10;
    this.mph += amount;
    return this;
  };
  this.brake = function brake(amount) {
    amount = amount || 10;
    this.mph = ((this.mph - amount) < 0)? 0
      : this.mph - amount;
    return this;
  };
  this.toggleParkingBrake = function toggleParkingBrake() {
    isParkingBrakeOn = !isParkingBreakOn;
    return this;
  };
  this.isParked = function isParked() {
    return isParkingBrakeOn;
  }
}

var myCar = new Car();

test('Constructor with private property.', function () {
  ok(myCar.color, 'Has a color');
  equal(myCar.gas().mph, 10,
    '.accelerate() should add 10mph.'
  );
  equal(myCar.brake(5).mph, 5,
    '.brake(5) should subtract 5mph.'
  );
  ok(myCar.toggleParkingBrake().isParked(),
    '.toggleParkingBrake works.'
  );
});

对象字面量让对象构建的语法更为简单直观:

var myCar = {
  color: 'pink',
  direction: 0,
  mph: 0,

  gas: function gas(amount) {
    amount = amount || 10;
    this.mph += amount;
    return this;
  },

  brake: function brake(amount) {
    amount = amount || 10;
    this.mph = ((this.mph - amount) < 0)? 0
      : this.mph - amount;
    return this;
  }
};

test('Object literal notation.', function () {
  ok(myCar.color, 'Has a color');

  equal(myCar.gas().mph, 10,
    '.accelerate() should add 10mph.'
  );

  equal(myCar.brake(5).mph, 5,
    '.brake(5) should subtract 5mph.'
  );
});

请注意,由于对象字面量不具备函数作用域,所以数据封装性会丢失。

时间: 2024-09-28 18:01:37

《JavaScript应用程序设计》一一3.7 创建对象的相关文章

JavaScript高级程序设计(第3版)学习笔记3 js简单数据类型_基础知识

ECMAScript是一种动态类型的语言,构建于5种简单数据类型(Undefined.Null.Boolean.Number.String)和一种复杂数据类型(Object)的基础之上.这篇文章就来复习一下简单数据类型,我会尽量从编程实践的角度来描述,下面代码运行环境为FireFox 14.0.1. 简单数据类型 简单数据类型 取值 Undefined undefined(只有一个值) Null null(只有一个值) Boolean true|false(只有两个值) Number 数值 St

JavaScript高级程序设计(第3版)学习笔记8 js函数(中)_基础知识

6.执行环境和作用域 (1)执行环境(execution context):所有的JavaScript代码都运行在一个执行环境中,当控制权转移至JavaScript的可执行代码时,就进入了一个执行环境.活动的执行环境从逻辑上形成了一个栈,全局执行环境永远是这个栈的栈底元素,栈顶元素就是当前正在运行的执行环境.每一个函数都有自己的执行环境,当执行流进入一个函数时,会将这个函数的执行环境压入栈顶,函数执行完之后再将这个执行环境弹出,控制权返回给之前的执行环境. (2)变量对象(variable ob

JavaScript高级程序设计(第3版)学习笔记7 js函数(上)_基础知识

变量类型 在说函数之前,先来说说变量类型. 1.变量:变量在本质上就是命名的内存空间. 2.变量的数据类型:就是指变量可以存储的值的数据类型,比如Number类型.Boolean类型.Object类型等,在ECMAScript中,变量的数据类型是动态的,可以在运行时改变变量的数据类型. 3.变量类型:是指变量本身的类型,在ECMAScript中,变量类型就只有两种:值类型和引用类型.当变量的数据类型是简单数据类型时,变量类型就是值类型,当变量的数据类型是对象类型时,变量类型就是引用类型.在不引起

JavaScript高级程序设计(第3版)学习笔记6 初识js对象_基础知识

在房子里面可以放你想放的任意事物--如果你有足够的美学造诣,你甚至可以弄一个房中房试试--当然,为了方便管理,我们会给房子里存放的所有事物都会取上一个不重复的名字,比如医药房间里的各种药品名称.在ECMAScript中,你可以在对象中存放任意你想放的数据,同样,我们需要给存放的数据取一个名字--也就是对象的属性名,再存放各种数据.再看看ECMA-262中对象的定义:无序属性的集合,其属性可以包含简单数据类型值.对象或者函数. 进入对象,我开始有些激动了,说实话,让我想起做这系列学习笔记的最初原因

《JavaScript高级程序设计》学习笔记

系统学习JS, 从<JavaScript高级程序设计>入门,通过学习jQuery或者angularJS源码来进阶. 第1章 JavaScript简介 1.JS问世的目的是处理以前由服务器端语言(如Perl)负责的一些输入验证操作, 由Netscape主导开发,那时候微软的IE还不能独领风骚.最初叫做LiveScript,当时媒体热炒Java,于是改名为JavaScript. JavaScript和ECMAScript通常指同一门语言,但是,JavaScript是ECMA-262标准的实现和扩展

JavaScript高级程序设计(第三版)学习笔记6、7章_javascript技巧

第6章面向对象的程序设计 对象 1.数据属性 configurable表示能否通过delete删除属性从而重新定义属性能否修改属性的特性或能否把属性修改为访问器属性默认为true enumerbale表示能否通过for-in访问属性默认true writable表示能否修改属性值默认true value数据存储位置默认undefined 修改默认属性特性Object.defineProperty()接收三个参数属性所在对象属性名描述符对象描述符对象属性必须是configurable.enumer

javascript面向对象程序设计高级特性经典教程(值得收藏)_javascript技巧

本文实例讲述了javascript面向对象程序设计的高级特性.分享给大家供大家参考,具体如下: 1.创建对象的三种方式: 第一种构造法:new  Object var a = new Object(); a.x = 1, a.y = 2; 第二种构造法:对象直接量 var b = { x : 1, y : 2 }; 第三种构造法:定义类型 function Point(x, y){ this.x = x; this.y = y; } var p = new Point(1,2); 2.访问对象

javascript中类的定义及其方式(《javascript高级程序设计》学习笔记)_js面向对象

关于javascript中类的继承可以参考阮一峰的Blog<Javascript继承机制的设计思想>,说的很透. 一.在javascript中实例化遇到的问题: 下面用<javascript高级程序设计>中的例子来做说明,假如现在定义了一个car的对象,它是Object类的实例.像下面这样的: 复制代码 代码如下: var oCar=new Object(); oCar.color = "red"; oCar.doors = 4; oCar.mpg = 23;

JavaScript高级程序设计 扩展--关于动态原型_javascript技巧

但是作者Nicholas C. Zakas在[动态原型]方式创建对象的时候没有深究可能会存在的问题和解决方案.而仅仅在继承的时候对[动态原型]的瓶颈作了说明.即在作子类继承的时候,不能通过动态原型的方式来实现. 原文大致如下: 继承机制不能采用动态化的原因是:prototype对象的唯一性.实例代码: 复制代码 代码如下: function A (i) { this.a = i; if (typeof A._init == 'undefined') { A.prototype.func = fu

JavaScript面向对象程序设计教程_javascript技巧

JavaScript中对象的定义为:无序属性的集合,其属性可以包含基本值.对象或者函数.可以把对象想象成散列表,就是一组名值对(key:value),其中值可以是数据或函数,每个对象都是基于一个引用类型创建的. 理解对象 前面的博客里写过创建对象的方式有两种,一种是创建一个object的实例,另一种是使用对象字面量法: var person = new Object(); person.sex = man; person.name = bluce person.age = 58; person.