《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 person1=createPerson("Jack",29,"Engineer"); //检测对象类型
alert(person1 instanceof Object) //true
alert(person1 instanceof Person) //error Person is not defined

构造函数模式

构造函数模式相比工厂模式的优点就在于,构造函数模式可以将他的实例标示为特定类型

function Person(name,age,job)
{
this.name=name;
this.age=age;
this.job=job;
this.sayName=function(){
alert(this.name);
};
}
var person1=new Person("Jack",29,"Engineer"); //检测对象类型
alert(person1 instanceof Object) //true
alert(person1 instanceof Person) //true

构造函数也是函数,如果不通过new 操作符调用,和其他函数没有不同

function Person(name,age,job)
{
this.name=name;
this.age=age;
this.job=job;
this.sayName=function(){
alert(this.name);
};
}
//以构造函数模式调用
var person1=new Person("Jack",29,"Engineer");
person1.sayName();//Jack //以普通函数调用
Person("Lily",25,"Actor");//执行环境为全局执行环节,this指向window
window.sayName();//Lily //在另一个对象的作用域中调用
var o=new Object();
Person.apply(o,["Jim",21,"Teacher"]);//扩展Person至实例对象o的作用域
o.sayName();//Jim

构造函数模式缺点在于实例方法无法复用,创建两个对象person1,person2的sayName方法的不等的,解决方法可以将函数定义转至构造函数外部,构造函数这用函数指针作为对象属性,指向外部的函数定义。

但是这样的实现,首先污染了全局作用域,其次破坏了封装性

function Person(name,age,job)
{
this.name=name;
this.age=age;
this.job=job;
this.sayName=sayName;
}
function sayName(){
alert(this.Name);
}
var person1=new Person("Karl",28,"Doctor");

原型模式

每个函数都有一个prototype属性,这个属性是一个指针,指向一个对象,这个对象用途是包含可以由特定类型的所有实例共享的属性和方法

function Person()
{
}
Person.prototype.name="Jim";
Person.prototype.age=29;
Person.prototype.job="Teacher";
Person.prototype.sayName=function(){
alert(this.Name);
};
var person1=new Person();
person1.sayName();//"Jim"
var person2=new Person();
alert(person1.sayName==person2.sayName);//true

代码这构造函数、原型对象和实例对象之间关系如下图

原型模式简易写法

function Person()
{
}
Person.prototype={
constructor:Person,//对象字面量创建了新对象,如不指定,constructor指向了Object
name:"Jim",
age:29,
job:"Teacher",
sayName:function(){
alert(this.name);
}
};

原型模式的缺点:所有实例在默认情况下取得相同属性值

构造器与原型混合模式

function Person(name,age,job)
{
this.name=name;
this.age=age;
this.job=job;
this.friends=["Tom","Jack"];
}
Person.prototype={
constructor:Person,//对象字面量创建了新对象,如不指定,constructor指向了Object
sayName:function(){
alert(this.name);
}
}; var person1=new Person("Jim",25,"Teacher");
var person2=new Person("Lily",20,"Actor");
person1.friends.push("Mark");
alert(person1.friends===person2.friends);//false
alert(person1.sayName===person2.sayName);//true

动态原型模式

个人认为这一模式最优雅,所有代码封装在构造函数,首次调用将方法添加至原型对象

function Person(name,age,job)
{
this.name=name;
this.age=age;
this.job=job;
this.friends=["Tom","Jack"];
//方法
if(typeof this.sayName != "function")
{
Person.prototype.sayName=function(){
alert(this.name);
};
}
}

《Javascript高级程序设计》读书笔记之对象创建的更多相关文章

  1. javascript高级程序设计读书笔记

    第2章  在html中使用javascript 一般都会把js引用文件放在</body>前面,而不是放在<head>里, 目的是最后读取js文件以提高网页载入速度. 引用js文 ...

  2. javascript高级程序设计读书笔记-事件(一)

    读书笔记,写的很乱   事件处理程序   事件处理程序分为三种: 1.html事件2. DOM0级,3,DOM2级别  没有DOM1 同样的事件 DOM0会顶掉html事件   因为他们都是属性  而 ...

  3. Javascript高级程序设计--读书笔记之理解原型对象

    先上一段代码和关系图 function Person(){} Person.prototype.name = "Nic" Person.prototype.age = 22 Per ...

  4. Javascript高级程序设计读书笔记(第六章)

    第6章  面向对象的程序设计 6.2 创建对象 创建某个类的实例,必须使用new操作符调用构造函数会经历以下四个步骤: 创建一个新对象: 将构造函数的作用域赋给新对象: 执行构造函数中的代码: 返回新 ...

  5. JavaScript高级程序设计-读书笔记(7)

    第22章 高级技巧 1.高级函数 (1)安全的类型检测 在任何值上调用Object原生的toString()方法,都会返回一个[object NativeConstructorName]格式的字符串. ...

  6. JavaScript高级程序设计-读书笔记(6)

    第20章 JSON JSON是一个轻量级的数据格式,可以简化表示复杂数据结构的工作量 JSON的语法可以表示一下三种类型的值 l        简单值:使用与JavaScript相同的语法,可以在JS ...

  7. JavaScript高级程序设计-读书笔记(5)

    第13章 事件 1.事件流 事件流描述的是从页面中接收事件的顺序.IE的事件流是事件冒泡流,而Netscape Communicator的事件流是事件捕获流. (1)事件冒泡,即事件开始时由最具体的元 ...

  8. JavaScript高级程序设计-读书笔记(4)

    第11章 DOM扩展 1.选择符API Selector API Level 1 的核心是两个方法:querySelector()和querySelectorAll().在兼容的浏览器中,可以通过Do ...

  9. JavaScript高级程序设计-读书笔记(3)

    第8章 BOM 1.window对象 (1)全局作用域 BOM的核心对象是window,它表示浏览器的一个实例.在浏览器中,window对象既是通过JavaScript访问浏览器窗口的一个接口,又是E ...

  10. JavaScript高级程序设计-读书笔记(2)

    第6章 面向对象的程序设计 创建对象 1.最简单方式创建Object的实例,如 var person = new Object(); person.name = “Greg”; person.age ...

随机推荐

  1. 找工作笔试面试那些事儿(16)---linux相关知识点(1)

    linux这部分的知识倒不是笔试面试必考的内容,不过现在很多公司开发环境都在linux系统下,一些简单的知识还是需要了解一下的,笔试面试中万一碰到了,也不会措手不及.作为菜硕的我,又因为读研期间的项目 ...

  2. Xamarin 后台持续定位与提示

    IOS后台持续运行对于c#程序员不懂得ios后台机制的是存在一定困扰的.特别是ios9过后对后台和安全进行了更严格的限制 好了废话不多说 一 设置info.plist权限信息 参考: 后台模式:htt ...

  3. VC++实现位图显示透明效果--实现原理

    我们在进行程序的界面设计时,常常希望将位图的关键部分,也既是图像的前景显示在界面上,而将位图的背景隐藏起来,将位图与界面很自然的融合在一起,本文介绍了透明位图的制作知识,并将透明位图在一个对话框中显示 ...

  4. Lucene.Net 2.3.1开发介绍 —— 简介

    原文:Lucene.Net 2.3.1开发介绍 -- 简介 Lucene.Net是Lucene在dot net平台上的移植版本.它的功能与Lucene一样,都是用来提供一组API,让我们能快速开发自己 ...

  5. 【COCOS2DX-游戏开发之三三】TMX边界控制与小窗体内预览TMX

    做一款像素游戏,须要确定地图的边界.保证人物的位置位于屏幕中央.到达地图左边界.地图位置不变.人向左走,到达右边界,地步位置不变,人向右走 如:地图左边.右边,上边空出的边界.还有下方留出操作butt ...

  6. 与众不同 windows phone (24) - Input(输入)之软键盘类型, XNA 方式启动软键盘, UIElement 的 Touch 相关事件, 触摸涂鸦

    原文:与众不同 windows phone (24) - Input(输入)之软键盘类型, XNA 方式启动软键盘, UIElement 的 Touch 相关事件, 触摸涂鸦 [索引页][源码下载] ...

  7. span标签可以使用hide()方法隐藏吗?

    /获取li下的span var $span = $('ul.selector li span'); //span对象隐藏 $span.hide(); //或者 $span.css('display', ...

  8. linux 软连接 硬连接

    1.Linux链接概念 Linux链接分两种,一种被称为硬链接(Hard Link),另一种被称为符号链接(Symbolic Link).默认情况下,ln命令产生硬链接. [硬连接] 硬连接指通过索引 ...

  9. SpringMVC存取Session的两种方法

    方法一:使用servlet-api @Controller public class ManagerController { @Resource private ManagerService mana ...

  10. Android中canvas.save()和canvas.restore()的使用

    自己定义控件时经常遇到重写View的Ondraw()方法,Ondraw()方法经常设计到save()和restore()这两个方法.这两个相互匹配出现的,作用是用来保存画布的状态和取出保存的状态的. ...