JavaScript 面向对象的程序设计记录笔记2(设计模式)

以下为JavaScript高级程序设计 第六章面向对象的程序设计6.2节 创建对象(设计模式部分)读书记录。

1)工厂模式:

  function createPerson(name, age, sex) {

    var o = new Obejct();

    o.age = age;

    o.sex = sex;

    o.name = name;

    return o;
  }

  var person = createPerson(‘Tom‘, 12, ‘male‘);

  var person = createPerson(‘Josn‘, 23, ‘male‘);

  通过改方式,可无数次调用createPerson方法,传入三个参数,即可返回包含三个属性的对象。

2)构造函数方式:

  function Person(name, age, sex) {

    this.name = name;

    this.age = age;

    this.sex = sex;

    this.seyName = function(){

      alert(this.name);

    }

  }

  var person1 = new Person(‘Tom‘, 23, ‘male‘);

  var person2 = new Person(‘Json‘, 23, ‘male‘);

  构造函数方式存在缺陷: 每次每个对象上的方法都会被实力化一次,即创建person1对象的时候,会实例化一次sayName对象,创建person2对象的时候,又会创建一次sayName对象,两次sayName对象不同。即:

  console.log(person1.sayName == person2.sayName) ; // 输出false

3) 原型模式:(详见JavaScript高级程序设计第三版P147 - P158)

  每个创建的函数上都有一个prototype(原型)属性, 这个属性是一个指针,指向一个对象,而指向的对象是包含由特定类型的所有实例共享的属性和方法

 function Person(){}

  Person.prototype.name = ‘Tom‘;

  Person.prototype.age = 24;

  Person.protoType.sayName = function(){alert(this.name)};

  var pserson1 = new Person();

  person1.sayName(); // Tom

  var person2 = new Person();

  person2.sayName(); // Tom

  console.log(person1.sayName == person2.sayName) ; // true

  通过原型模式创建的对象,所有的对象都共用一个prototype属性指定的对象。

   检验对象见是否存在Protptype关系,可用isPrototypeOf()方法,如果存在则返回true, 如:

  console.log(Person.prototype.isPrototypeOf(person1)); // true

  通过Object.getPrototypeOf()方法可返回指向原型对象的值,如:

  console.log(Object.getPrototypeOf(person1.name)); // 输出Tom

  注:每当代码读取某个对象的属性时,都会执行一次搜索,目标是具有给定名字的属性,首先从对象实例本身开始搜索,如果实例中存在具体给定的名字的属性,则返回改属性的值;如果没有找到,则继续搜索指针指向的原型对象,在原型对象中找到了具体的给定值,则返回该属性的值。 也就是说在person1.sayName()的时候,会先后执行两次搜索,首先解释器会问?person1实例对象中是否存在sayName属性,答:没有,则继续搜索,指针指向的原型对象中进行搜索,解释器问?存在sayName属性嘛?答:存在,于是就读取存在原型对象中的函数。

  当实例对象中存在的属性名与原型中存在的属性一致的时候,原型中对应的属性值会被屏蔽,如:

  function Person(){}

  Person.prototype.name = ‘Tom‘;

  Person.prototype.age = 24;

  Person.protptype.sayName = function(){alert(this.name);};

  var person1 = new Person();

  person1.name = ‘Json‘;

  var person2 = new Person();

  console.log(person1.name); // Json

  console.log(person2.name); // Tom

  注:delete操作符可删除对象实例上的属性,从而获得原型上的属性,如:

  delete person1.name;

  console.log(person1.name); // 输出Tom

  hasOwnProperty()方法可判断一个属性是否存在实例对象中还是在原型中,如调用以上Person demo:

  console.log(person1.hasOwnProperty(‘name‘)); // false, 来自原型;

  person1.name = ‘Tom‘;

  console.log(person1.hasOwnProperty(‘name‘)); // true, 来自实例

  与hasOwnProperty()方法有区别的操作符in, 只要对象上存在该属性,不关属性是来自实例的,还是来自原型的,都会返回true。

    

时间: 2024-12-25 11:06:10

JavaScript 面向对象的程序设计记录笔记2(设计模式)的相关文章

JavaScript 面向对象的程序设计记录笔记

以下为JavaScript高级程序设计第六章面向对象的程序设计读书笔记记录. 对象存在两个属性: 数据属性/ 访问器属性. 数据属性包括四个值: Configurable: 默认值为true, 表示能否通过delete删除属性重新定义:能否修改属性特性,或者能否吧属性修改为访问器属性. Enumable:  表示能否通过for in循环返回属性.默认值为true. writable: 表示能否修改属性,默认值为true. Value:包含这个属性的数据值. 访问器属性包括四个值:Configur

JavaScript 面向对象的程序设计记录笔记4

组合使用构造函数模式和原型模式: function Person(name, age, job){ this.name = name; this.age = age; this.job = job; this.friends = ['Shelby', 'Court']; } Person.prototype = { connstructor: Person, sayName: function(){ return this.name; } } var person1 = new Person('

JavaScript 面向对象的程序设计记录笔记5

继承: 原型链继承 function SuperType() { this.propperty = true; } Supertype.prototype.getSuperValue = function() { return this.propperty; } function SubType() { this.subproperty = false; } // 继承了SubType SubType.prototype = new SuperType(); SubType.prototype.

JavaScript 面向对象的程序设计(一)之理解对象属性

首先,JavaScript 面向对象的程序设计,主要分三部分. 理解对象属性: 理解并创建对象: 理解继承. 本文主要从第一方面来阐述: 理解对象属性 首先我们来理解Javascript对象是什么?在Javascript中,万物皆对象.其中创建自定义对象的最简单的方式就是创建一个Object的实例,如下: ECMAScript中有两种属性:数据属性和访问器属性. 数据属性:其中数据属性有四个描述其行为的特性:Configurable: 表示能都通过delete删除属性从而重新定义属性.Enume

《Javascript面向对象精要》笔记

刚读过<Javascript面向对象精要>这本书,在现有的知识体系里面有一些新鲜的认识,记录一下. 原始类型和引用类型 Javascript存在两种类型:原始类型和引用类型.原始类型包括String.Number.Boolean.Null.Undefined,引用类型保存对象,其本质是对象所在内存位置的引用. 原始类型的赋值或者给函数传参,实际上都是传递原始类型值的拷贝: 引用类型则是引用的拷贝.修改其中一个引用的话,其他引用也会受到影响.如果对象中的某个属性也是对象,在对象拷贝时就会引入深拷

JavaScript面向对象编程指南——学习笔记1

第1章 引言 1.1 回顾历史 1.2 变革之风 1.3 分析现状 1.4 展望未来 1.5 面向对象的程序设计 1.5.1 对象(属性和方法的集合) 1.5.2 类 (相似对象的共同特征,如麻雀.老鹰都是鸟类) 1.5.3 封装 (将属性和方法集合起来,也有封闭作用域的概念,如封装一个播放器对象) 1.5.4 聚合 (将几个对象合并成一个对象) 1.5.5 继承 (一个实例对象继承父级对象的一些属性和方法) 1.5.6 多态 (一个对象调用其他对象的方法,call和apply) 1.6 OPP

Javascript面向对象的程序设计

面向对象的语言有一个标志,那就是它们都有类的概念,而通过类可以创建任意多个具有相同属性和方法的对象. 每个对象都是基于一个引用类型创建的,这个引用类型可以是之前的原生类型,也可以是开发人员定义的类型. 1.理解对象 ①属性类型:ECMAScript中有两种属性:数据属性和访问器属性. (1)数据属性:数据属性包含一个数据值的位置.在这个位置可以读取和写入值,数据户型有4个描述其行为的特性: 数据属性有4个描述其行为的特性. [[Configurable]]:表示能否通过delete删除属性从而重

《JavaScript面向对象编程指南》读书笔记②

概述 <JavaScript面向对象编程指南>读书笔记① 这里只记录一下我看JavaScript面向对象编程指南记录下的一些东西.那些简单的知识我没有记录,我只记录几个容易遗漏的或者精彩的知识点,以后再看也可当做拾遗之用! 内容 1.枚举属性用for-in循环显示. 2.当我们对对象的prorotype属性进行完全重写时,有可能会对对象constructor属性产生一定的负面影响. 3.uber--子对象访问父对象的方式Triangle.uber = TwoDShape.prototype 4

JavaScript高级程序设计学习笔记--面向对象程序设计

工厂模式 虽然Object构造函数或对象字面量都可以用来创建单个对象,但这些方式有个明显的缺点:使用同一个接口创建很多对象,会产生大量的重复代码.为解决这个问题,人们开始使用 工厂模式的一种变体. function createPerson(name,age,job){ var o=new Object(); o.name=name; o.age=age; o.job=job; o.sayName=function(){ alert(this.name); }; return o; } var