javascript写类方式之四
通过前面几篇得知javascript写类无非基于构造函数
和原型
。既然这样,我们写个工具函数来写类。
/**
* $class 写类工具函数之一
* @param {Object} constructor
* @param {Object} prototype
*/
function $class(constructor,prototype) {
var c = constructor || function(){};
var p = prototype || {};
c.prototype = p;
return c;
}
嗯。工具类写好了,来组装下:用构造函数来生成类实例的属性(字段),原型对象用来生成类实例的方法。
//构造函数
function Person(name) {
this.name = name;
}
//原型对象
var proto = {
getName : function(){return this.name},
setName : function(name){this.name = name;}
}
//组装
var Man = $class(Person,proto);
var Woman = $class(Person,proto);
ok,这时候已经得到了两个类Man,Woman。并且是同一个类型的。测试如下:
console.log(Man == Woman);//true
console.log(Man.prototype == Woman.prototype);//true
创建对象看看,
var man = new Man("Andy");
var woman = new Woman("Lily");
console.log(man instanceof Man);//true
console.log(woman instanceof Woman);//true
console.log(man instanceof Person);//true
console.log(woman instanceof Person);//true
ok一切如我们所期望。但是有个问题,下面代码的结果输出false,
console.log(man.constructor == Person);//false
这让人不悦:从以上的代码看出man的确是通过Man类new出来的 var man = new Man("Andy"),那么对象实例man的构造器应该指向Man,但为何事与愿违呢?
原因就在于$class中重写了Person的原型:c.prototype = p;
好了,我们把$class稍微改写下,将方法都挂在构造器的原型上(而不是重写构造器的原型),如下:
function $class(constructor,prototype) {
var c = constructor || function(){};
var p = prototype || {};
// c.prototype = p;
for(var atr in p)
c.prototype[atr] = p[atr];
return c;
}
相关文档:
看书的时候遇到这样一个问题,程序代码如下
var ob = function(){
var obj = this;
function fn1(){
alert( obj === window );//false
alert( this === window );//ture
}
this.fn2 = function() {
fn1();
}
}
当时很不明白fn1里面第二个alert的结果,为 ......
作用域 Scope
Javascript 中的函数属于词法作用域,也就是说函数在它被定义时的作用域中运行而不是在被执行时的作用域内运行。这是犀牛书上的说法。但“定义时”和“执行(被调用)时”这两个东西有些人搞不清楚。简单来说,一个函数A在“定义时”就是 function A(){} 这个语句执行的时候就 ......
Grouping Scripts 成组脚本
Since each <script> tag blocks the page from rendering during initial download, it's helpful to limit the total number of <script> tags contained in the page. This applies to both inline scripts as well as those in external files. Every time ......
Dynamic Script Elements 动态脚本元素
The Document Object Model (DOM) allows you to dynamically create almost any part of an HTML document using JavaScript. At its root, the <script> element isn't any different than any other element on a page: references can be retrie ......
SCRIPT 标记
用于包含JavaScript代码.
属性
LANGUAGE 定义脚本语言
SRC 定义一个URL用以指定以.JS结尾的文件
window对象
每个HTML文档的顶层对象.
属性
frames[] 子桢数组.每个子桢数组按源文档中定义的 ......