JavaScript高级程序设计(第三版)学习笔记6、7章
第6章,面向对象的程序设计
对象:
1、数据属性
configurable,表示能否通过delete删除属性从而重新定义属性,能否修改属性的特性,或能否把属性修改为访问器属性,默认为true
enumerbale,表示能否通过for-in访问属性,默认true
writable,表示能否修改属性值,默认true
value,数据存储位置,默认undefined
修改默认属性特性:Object.defineProperty(),接收三个参数:属性所在对象,属性名,描述符对象,描述符对象属性必须是:configurable、enumerable、writable、value
例:
var obj = {};
Object.defineProperty(obj,”name”,{
writable:true,
value:”nihao”
});
2、访问器属性
configurable,表示能否通过delete删除属性从而重新定义属性,能否修改属性的特性,或能否把属性修改为访问器属性,默认为true
enumerbale,表示能否通过for-in访问属性,默认true
get,读取属性时调用,默认undefined
set,写入属性时调用,默认undefined
修改必须通过Object.defineProperty()
例:
var obj = {
_year:2004,
edition:1
}
Object.defineProperty(book,”year”,{
get:function(){
return this._year;
},
set:function(newValue){
if(newValue > 2004){
this._year = newValue;
this.edition += newValue – 2004;
}
}
});
book.year = 2005;
alert(book.edition); //
定义多个属性:Object.defineProperties(),接收两个对象,一是要修改和添加属性的兑现,第二个对象属性与第一个对象要修改或添加的属性一一对应,支持的浏览器:IE9+,FireFox4+,Safari5+,Opera12+,chrome
读取属性:Object.getOwnPropertyDescriptor(),接收两个参数,属性所在对象,要读取描述符的属性名称,支持的浏览器:IE9+,FireFox4+,Safari5+,Opera12+,chrome
创建对象:
工厂模式:
function createPerson(name,age){
var o = new Object();
o.name = name;
o.age = age;
o.sayName = function(){
alert(this.name);
};
return o;
}
var person1 = createPerson(“g”,29);
构造函数模式:
function Person(name,age){
this.name = name;
this.age = age;
this.sayName() = function(){
alert(this.name);
};
}
var person = new Person(“g”,28);
两种模式区别:
构造函数模式中不需要显示创建对象,对this直接赋值,没有返回语句
构造函数名首字母必须大写,必须使用new操作符创建新实例
原型模式
创建的每个函数都有一个prototype(原型)属性,这个属性是一个指针,指向一个对象,这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法,换句话就是,prototype就是通过函数创建的对象的原型对象,好处在于可以是所有实例共享相同的属性和方法。
isPrototypeOf(),个人理解就是可以用以判断某个实例的原型是否与当前原型相同
例:
Person.prototype.isPrototypeOf(person1); //true
Object.getPrototypeOf(),可以返回某个实例的原型,支持的浏览器IE9+,Firefox3.5+,Safari5+,Opera12+,chrome
注:访问对象属性名时会进行一次搜索,先在实例对象搜索,不存在则到当前对象的原型对象去搜索。
注:实例中的属性若与原型对象中的属性一样,则会屏蔽原型对象的属性,与上一条刚好可以对的上
hasOwnProperty()方法可以确定某个属性是否来自实例,不是来自实例,则返回false,否则返回true
在实例上调用delete时,只会删除实例上的属性名,并不会删除原型的属性
例:
function Person(){
}
Person.prototype.name = "Nicholas";
Person.prototype.age = 29;
Person.prototype.sayName = function(){
alert(this.name);
}
var per1 = new Person();
var per2 = new Person();
per1.name = "Greg";
alert(per1.name); //"Greg" 来自实例
alert(per2.name); //"Nicholas"
delete per1.name;
alert(per1.name); //"Nicholas" 来自原型
delete per1.name;
alert(per1.name); //"Nicholas"
注:Object.getOwnPropertyDescriptor()方法只能用于实例属性,要取得原型属性描述符,必须直接在原型对象上调用本方法
in操作符:只有当属性在实例对象中或者在原型对象中时,返回true
例:
alert(“name” in Person); //true
alert(“name” in per1); //true
同时使用in和hasOwnProperty可以确定该属性是存在原型中,还是实例中
Object.keys()方法:接收一个对象作为参数,返回所有可枚举的属性组成的字符串数组
Object.getOwnPropertyNames()方法:接收一个对象,返回所有属性组成的字符串数组,无论是否可枚举
更简单的原型语法:
使用上述方法实在太麻烦了,更经常使用的是以下方法:使用对象字面量
Person.prototype = {
name : “Nicholas”,
age : 29
sayName = function(){
alert(this.name);
}
}
不过,此方法,相当于重写了整个prototype对象,将导致constructor属性不再指向Person而是指向Object,虽然instanceof还是会返回正确的结果,但通过constructor已经不能确定对象类型了。
var per = new Person();
alert(per instanceof Object); //true
alert(per instanceof Person); //true
alert(per constructor Object); //true
alert(per constructor Person); //false
若constructor真的很重要,可以如下设置
Person.prototype = {
constructor:Person,
name : “Nicholas”,
age : 29
sayName = function(){
alert(this.name);
}
}
以上写法会使constructor的enumerable特性被设置为true,默认情况下原生的是false的,在兼容ECMAScript5的浏览器可以使用Object.defineProperty()进行设置
Object.defineProperty(Person.prototype,”constructor”,{
enumerable:false,
value:Person
});
注:重写原型对象,将会切断现有原型与任何之前已经存在的对象实例之间的联系
继承(难度较大,需再仔细研究)
使用原型链来实现
子类型要覆盖超类的方法,应该将给原型添加方法的代码放在替换原型之后,
注:通过原型链实现继承时,不能使用对象字面量创建原型方法,否则会重写原型链
借用构造函数
组合继承
原型式继承,Object.creat();接收两个参数:一是用作新对象原型的对象和(可选的)一个为新对象定义额外属性的对象
例:Object.creat(person,{name:{value:”greg”}});
寄生式继承
寄生组合式继承
第7章,函数表达式
创建方式:
1、函数声明,可以函数声明提升,就是可以把使用函数的语句放在函数声明之前
function funName(arg0,arg1){
//函数体
}
2、函数表达式,不能进行函数提升,也就是无法在函数创建前使用函数,在这种情况下创建的函数称为匿名函数,有时也叫拉姆达函数
var funName = function(arg0,arg1){
//函数体
}
严格模式下无法使用arguments.callee来实现递归,可以使用如下方式实现递归:
var factorial = (function f(num){
if(num <= 1){
return 1;
}else{
return num * f(num - 1);
}
});
闭包(难度也不小)
闭包指有权访问另一个函数作用域中的变量的函数,闭包,也是一个函数
创建闭包的常见方式是在一个函数内部创建另一个函数
闭包只能取得包含函数即外部函数中任何变量的最后一个值。下例可以清晰说明问题
例:
function createFuncrions(){
var result = new Array();
for(var i = 0;i < 10;i++){
result[i] = function(){
return i;
}
}
return result;
}
var re = createFuncrions();
alert(re[2]());
每个函数返回的都将是10,而不是如预期般返回对应的索引值,因为createFuncrions函数最后返回时I = 10,此时每个函数都引用保存着变量i的同一个对象,所以在每个函数内部i都是10,可以使用如下方法强制闭包返回预期效果:
function createFuncrions(){
var result = new Array();
for(var i = 0;i < 10;i++){
result[i] = function(num){
return function(){
return num;
};
}(i);
}
return result;
}
var re = createFuncrions();
alert(re[2]());
每一个都会返回各自的索引值
模仿块级作用域
使用匿名函数可以模仿块级作用域:
(function(){
alert("test"); //块级作用域,没有使用圆括号将function包起来将会出错
})();
使用闭包和私有变量的明显不足之处在于,会在作用域链中多查找一个层次,在一定程度上影响查找速度
函数中定义的变量可以在一定程度上称为私有变量,通过函数可以模拟出私有变量,静态私有变量
增强模块模式:
var singleton = function(){
//private arg and private method
var privateVariable = 10;
function privateFunction(){
return false;
}
//create obj
var obj = new Object();
obj.publicProperty = true;
obj.publicFunction = function(){
privateVariable ++;
return privateFunction();
};
return obj;
}();
alert(typeof singleton);
alert(singleton.publicProperty);
alert(singleton.publicFunction());
JavaScript高级程序设计(第三版)学习笔记6、7章的更多相关文章
- JavaScript高级程序设计第三版学习笔记(一)之数据类型区分详谈
null.NaN.undefined三者的区别是什么? 在初次接触到JavaScript的时候,傻傻的分不清null.NaN.undefined三者到底区别何在,在实际的项目开发中也因为这个问题而困惑 ...
- JavaScript高级程序设计第三版-读书笔记(1-3章)
这是我第一次用markdown,也是我第一次在网上记录我自己的学习过程. 第一章 JavaScript主要由以下三个不同的部分构成 ECMAScript 提供核心语言功能 DOM 提供访问 ...
- JavaScript高级程序设计第三版.CHM【带实例】
从驱动全球商业.贸易及管理领域不计其数的复杂应用程序的角度来看,说 JavaScript 已经成为当今世界上最流行的编程语言一点儿都不为过. JavaScript 是一种非常松散的面向对象语言,也是 ...
- Javascript高级程序设计第三版-笔记
1.JS数值最大值最小值: >Number.MIN_VALUE <5e-324 >Number.MAX_VALUE <1.7976931348623157e+308 判断数值是 ...
- javascript高级程序设计第三版书摘
在HTML 中使用JavaScript <script>元素 在使用<script>元素嵌入 JavaScript 代码时,只须为<script>指定 type 属 ...
- 22.1 高级函数【JavaScript高级程序设计第三版】
函数是JavaScript 中最有趣的部分之一.它们本质上是十分简单和过程化的,但也可以是非常复杂和动态的.一些额外的功能可以通过使用闭包来实现.此外,由于所有的函数都是对象,所以使用函数指针非常简单 ...
- 21.1 XMLHttpRequest 对象【JavaScript高级程序设计第三版】
IE5 是第一款引入XHR 对象的浏览器.在IE5 中,XHR 对象是通过MSXML 库中的一个ActiveX对象实现的.因此,在IE 中可能会遇到三种不同版本的XHR 对象,即MSXML2.XMLH ...
- 2.1 <script>元素【JavaScript高级程序设计第三版】
向 HTML 页面中插入 JavaScript 的主要方法,就是使用<script>元素.这个元素由 Netscape 创造并在 Netscape Navigator 2 中首先实现.后来 ...
- 14.5 富文本编辑【JavaScript高级程序设计第三版】
富文本编辑,又称为WYSIWYG(What You See Is What You Get,所见即所得).在网页中编辑富文本内容,是人们对Web 应用程序最大的期待之一.虽然也没有规范,但在IE 最早 ...
- DOM 操作技术【JavaScript高级程序设计第三版】
很多时候,DOM 操作都比较简明,因此用JavaScript 生成那些通常原本是用HTML 代码生成的内容并不麻烦.不过,也有一些时候,操作DOM 并不像表面上看起来那么简单.由于浏览器中充斥着隐藏的 ...
随机推荐
- 设计原则 Design Principle
Design Principle设计原则 最近由于碰到要参与设计一个音频处理系统,有人提议用一个大的全局变量结构体来做状态信息交流的地方,引起了我对设计一个系统的思考,于是找到了如下资料,当然,关于这 ...
- 1.2CPU和GPU的设计区别
CPU和GPU之所以大不相同,是由于其设计目标的不同,它们分别针对了两种不同的应用场景.CPU需要很强的通用性来处理各种不同的数据类型,同时又要逻辑判断又会引入大量的分支跳转和中断的处理.这些都使得C ...
- matlab 函数说明—conv2
conv 是卷积的意思,2表示2维卷积. conv2的调用形式如下: 1. C = conv2(A,B) 这是最简单的一种调用形式,B作为卷积核在A的范围内滑动,若[ma na] =size(A) ...
- sublime Text2.0.2注册码
----- BEGIN LICENSE ----- Andrew Weber Single User License EA7E-855605 813A03DD 5E4AD9E6 6C0EEB94 BC ...
- mapreduce学习指导及疑难解惑汇总
原文链接http://www.aboutyun.com/thread-7091-1-1.html 1.思想起源: 我们在学习mapreduce,首先我们从思想上来认识.其实任何的奇思妙想,抽象的,好的 ...
- poj1743--Musical Theme(后缀数组)
题意:求一列数字中走向相同的两个字序列,长度要求大于5 题解:相邻数字求差,原题就变成求相同的长度大于4的子串. [存疑:在保证两个子串不相交时觉得限定条件应该是大于x,但是wa了= = 不是很理解] ...
- JBOss 端口没占用!
打开exlipse ,启动服务器 后,报如下错误:
- 关于 javascript:void(0) 的使用
在 Wep App 中,我们经常需要在 JavaScript 中处理链接的点击.因此,我们希望用户点击 <a> 元素时阻止它的默认行为.此时我们可以用很多不同的方法来处理.例如: < ...
- ios怎样实现快速将显卡中数据读出压缩成视频在cocos2dx扩展开发中
如果解决ios怎样实现快速将显卡中数据读出压缩成视频在cocos2dx扩展开发中 手机平台性能是个关键问题. 压缩视频分成3个步骤: 读取显卡数据, 使用编码器压缩,保存文件. 使用libav 压缩的 ...
- php获取内容中第一张图片地址
$note = '<img src="http://images.xxx.com/article/cover/201601/20/141539161273.png?imageView2 ...