上一节写了创建对象的三种方法,而其中通过函数创建对象的方式又有三种模式,分别是工厂模式、构造函数模式、原型模式。而这三种模式最常用的则是原型模式。还是上栗子:

  工厂模式:

function Fun1(name,age){
var obj = {};
obj.name = name;
obj.age = age;
obj.sayNmae = function(){
return this.name;
};
return obj;
} var p1 = Fun1('xiaohong', 22);
var p2 = Fun1('xiaoming', 25); p1 instanceof Fun1; // false

  工厂模式的缺点在于无法进行对象识别,就是知道一个对象的类型。(ps:其实我也没太搞明白这个用处,写的代码太少)

构造函数模式:

function Person(name,age) {
this.name = name;
this.age = age;
this.sayName = function() {
console.log('你好,我叫:' + this.name);
};
} var p1 = new Person('小明', 25);
var p2 = new Person('小花', 23); p1 instanceof Person; // true

  使用构造函数模式创建对象,需要使用new操作符来创建实例,通过这种方式调用构造函数会经历以下4个过程:

    1.创建一个新对象

    2.将构造函数的作用域赋给新对象,从而使this指向新对象

    3.执行构造函数中的代码

    4.返回新对象

  现在可以使用instanceof来检测对象类型了。

  不过单纯的通过构造函数来创建对象也是有缺点的,缺点就是重复创建实例,比如上面代码中的sayName()方法会被创建两次。

  组合使用构造函数模式和原型模式:

  因为方法sayName()是可以共享的,所以我们不需要让它多次创建,为了解决这个问题,我们可以把方法sayName()拿出来,放在函数Persorn的外面,但是这样做就体现不出封装性了,所以这个时候需要的就是原型模式了。

  构造函数模式用来定义实例的属性,原型模式用来定义共享的方法和属性。

function Person(name,age) {
this.name = name;
this.age = age;
}
Person.prototype.sayName = function() {
console.log('你好,我叫:' + this.name);
};
var p1 = new Person('小明', 25);
var p2 = new Person('小花', 23); p1.sayName(); // 你好,我叫:小明
p2.sayName(); // 你好,我叫:小花

原型

  prototype与__proto__

  每个函数都有一个prototype(原型)属性,这个属性指向一个对象,用来包含所有实例共享的属性和方法。

  通过构造函数创建一个新实例后,这个实例会有一个指针[[Prototype]],我们可以通过__proto__属性来访问,这个链接存在于实例和构造函数的原型对象之间:Person.prototype === person.__proto__。

  isPrototypeOf(instence)

  isPrototypeOf()方法用来确定实例与构建函数的原型对象的关系。

Person.prototype.isPrototypeOf(p1); // true

  Object.getPrototypeOf(instence)

  Object.getPrototypeOf()返回创建这个实例对象的构建函数的原型对象。

Object.getPrototypeOf(p1) === Person.prototype;  // true

  hasOwnProperty()

  hasOwnProperty()可以用来检测属性是否存在于实例对象中。

  for-in

  for-in循环中,返回实例和原型中所有可以访问,可枚举的属性。

function Person(name,age) {
this.name = name;
this.age = age; }
Person.prototype.sayName = function() {
console.log('你好,我叫:' + this.name + '。性别:' + this.sex);
};
Person.prototype.sex = '男';
var p1 = new Person('小明', 25); p1.sayName(); // 你好,我叫:小明。性别:男 for(var i in p1){
if(p1.hasOwnProperty(i)){
console.log(i); // name和age
}
}

  Object.keys()

  Object.keys()返回给定对象上所有可枚举的实例属性。

Object.keys(Person.prototype);  // ["sayName", "sex"]

  Object.getOwnPropertyNames()

  Object.getOwnPropertyNames()放回给定对象上所有实例属性,包括不可枚举的实例属性。

Object.getOwnPropertyNames(Person.prototype);  // ["constructor", "sayName", "sex"]

菜鸟快飞之JavaScript对象、原型、继承(二)的更多相关文章

  1. 菜鸟快飞之JavaScript对象、原型、继承(三)

    正文之前需要声明的一点是,菜鸟系列博文全是基于ES5的,不考虑ES6甚至更高版本. 继承 由于我个人不是学计算机的,所以对于很多东西只是知其然,不知其所以然.就像这个继承,刚开始学JavaScript ...

  2. 菜鸟快飞之JavaScript对象、原型、继承(一)

    有前辈说过,在JavaScript中,一切皆对象.由此可见,作为JavaScript的核心之一,对象是有多么重要.虽然今天走亲戚有点累,但还是得写写这个对象,免得吃几天好的,就又忘光了. 1.创建对象 ...

  3. 菜鸟快飞之JavaScript函数

    1.复制变量值 在说函数前,我觉得需要先说说关于变量值的复制,以便后面的理解. 复制基本类型的值: 当一个变量复制另外一个值为基本类型的变量时,两个变量可以参与任何操作而不会互相影响 var num1 ...

  4. 关于js的对象原型继承(二)

    本章讨论使用new一个构造函数来创建一个对象. 前期知识点说明: 1.prototype是函数的一个属性,每个函数都有一个prototype属性.这个属性是一个指针,指向一个对象.它是显示修改对象的原 ...

  5. #JavaScript对象与继承

    JavaScript对象与继承 JavaScript是我在C语言之后接触的第二门编程语言,大一暑假的时候在图书馆找了一本中国人写的JavaScript程序设计来看.那个时候在编程方面几乎还是小白,再加 ...

  6. JavaScript的原型继承

    JavaScript是一门面向对象的语言.在JavaScript中有一句很经典的话,万物皆对象.既然是面向对象的,那就有面向对象的三大特征:封装.继承.多态.这里讲的是JavaScript的继承,其他 ...

  7. JavaScript大杂烩4 - 理解JavaScript对象的继承机制

    JavaScript是单根的完全面向对象的语言 JavaScript是单根的面向对象语言,它只有单一的根Object,所有的其他对象都是直接或者间接的从Object对象继承.而在JavaScript的 ...

  8. 关于js的对象原型继承(一)

    javascript中,对象的继承是通过原型去继承. 可以这样理解:js中的对象,包含的除了属性和方法,还有一个最基本的原型__proto__对象.这个原型__proto__指向谁,这个对象就继承谁. ...

  9. JavaScript对象的继承

    原文 简书原文:https://www.jianshu.com/p/78ce11762f39 大纲 前言 1.原型链继承 2.借用构造函数实现继承 3.组合模式继承 4.原型式继承 5.寄生式继承 6 ...

随机推荐

  1. maven 快照

    大型应用软件一般由多个模块组成,一般它是多个团队开发同一个应用程序的不同模块,这是比较常见的场景.例如,一个团队正在对应用程序的应用程序,用户界面项目(app-ui.jar:1.0) 的前端进行开发, ...

  2. DevExpress - 使用 GaugeControl 标尺组件制作抽奖程序 附源码

    前不久,公司举办了15周年庆,其中添加了一个抽奖环节,要从在读学员中随机抽取幸运学员,当然,这个任务就分到了我这里. 最后的效果如下,启动有个欢迎页面,数据是来自Excel的,点击开始则上面的学号及姓 ...

  3. BZOJ 3083: 遥远的国度 [树链剖分 DFS序 LCA]

    3083: 遥远的国度 Time Limit: 10 Sec  Memory Limit: 1280 MBSubmit: 3127  Solved: 795[Submit][Status][Discu ...

  4. Linux.NET学习手记(8)

    上一回合中,我们讲解了Linux.NET面对OWIN需要做出的准备,以及介绍了如何将两个支持OWIN协议的框架:SignalR以及NancyFX以OwinHost的方式部署到Linux.NET当中.这 ...

  5. ubuntu 14.10 lts 64-bits环境下使用Android Studio

    距离google发布android studio 1.0正式版已经两个月左右了.由于一直习惯使用eclipse+ADT的模式,而且曾在windows下试用一次Android Studio预览版,感觉卡 ...

  6. Thinking in Unity3D:基于物理着色(PBS)的材质系统

    关于<Thinking in Unity3D> 笔者在研究和使用Unity3D的过程中,获得了一些Unity3D方面的信息,同时也感叹Unity3D设计之精妙.不得不说,笔者最近几年的引擎 ...

  7. Jquary入门(添加 修改 表单元素)+ JSON+弹框

    字符串拼接 计算机语言 都是 对  数据的处理(获取/修改数据)  添加元素  除了  固定的方法添加 以外 都是   字符串拼接(拼接成固定格式即可执行). 1.表单添加元素  append() 方 ...

  8. Nginx服务器 之反向代理与负载均衡

    一.反向代理 正向代理: 客户端要获取的资源就在服务器上,客户端请求的资源路径就是最终响应资源的服务器路径,这就是正向代理.正向代理的特点:就是我们明确知道要访问哪个网站地址. 反向代理: 客户端想获 ...

  9. AOP概述

    了解AOP之前,先大概讲述一下SOC: Soc:Separation of concerns 关注分离点, 在不同的场景SOC有着不同的含义 Soc是一个过程:Soc是一个将功能点分解以尽量减小功能交 ...

  10. JavaScript权威设计--JavaScript语言核心(简要学习笔记一)

    1.对象名/值得映射 var book={ top:"a", fat:true }   2.访问对象属性 book.top book["fat"] 3.通过赋值 ...